refactor

packages/x-data-grid/src/DataGrid/useDataGridProps.ts

@@ -104,15 +104,26 @@ export const useDataGridProps = <R extends GridValidRowModel>(inProps: DataGridP
     [themedProps.slots],
   );
 
+  const injectDefaultProps = React.useMemo(() => {
+    return (
+      Object.keys(DATA_GRID_PROPS_DEFAULT_VALUES) as Array<
+        keyof DataGridPropsWithDefaultValues<any>
+      >
+    ).reduce((acc, key) => {
+      // @ts-ignore
+      acc[key] = themedProps[key] ?? DATA_GRID_PROPS_DEFAULT_VALUES[key];
+      return acc;
+    }, {} as DataGridPropsWithDefaultValues<any>);
+  }, [themedProps]);
+
   return React.useMemo<DataGridProcessedProps<R>>(
     () => ({
-      ...DATA_GRID_PROPS_DEFAULT_VALUES,
       ...themedProps,
-      paginationMode: themedProps.paginationMode ?? DATA_GRID_PROPS_DEFAULT_VALUES.paginationMode,
+      ...injectDefaultProps,
       localeText,
       slots,
       ...DATA_GRID_FORCED_PROPS,
     }),
-    [themedProps, localeText, slots],
+    [themedProps, localeText, slots, injectDefaultProps],
   );
 };

packages/x-data-grid/src/tests/DataGrid.test.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { createRenderer } from '@mui/internal-test-utils';
 import { expect } from 'chai';
-import { DataGrid } from '@mui/x-data-grid';
+import { DataGrid, DATA_GRID_PROPS_DEFAULT_VALUES } from '@mui/x-data-grid';
 
 const isJSDOM = /jsdom/.test(window.navigator.userAgent);
 
@@ -62,4 +62,30 @@ describe('<DataGrid />', () => {
       </div>,
     );
   });
+
+  it('should not cause unexpected behavior when props are explictly set to undefined', () => {
+    const rows = [
+      { id: 'a', col1: 'Hello', col2: 'World' },
+      { id: 'constructor', col1: 'DataGridPro', col2: 'is Awesome' },
+      { id: 'hasOwnProperty', col1: 'MUI', col2: 'is Amazing' },
+    ];
+
+    const columns = [
+      { field: 'col1', headerName: 'Column 1', width: 150 },
+      { field: 'col2', headerName: 'Column 2', width: 150 },
+    ];
+    expect(
+      render(
+        <DataGrid
+          rows={rows}
+          columns={columns}
+          {...Object.keys(DATA_GRID_PROPS_DEFAULT_VALUES).reduce((acc, key) => {
+            // @ts-ignore
+            acc[key] = undefined;
+            return acc;
+          }, {})}
+        />,
+      ),
+    ).not.toErrorDev();
+  });
 });

packages/x-data-grid/src/tests/pagination.DataGrid.test.tsx

@@ -751,10 +751,4 @@ describe('<DataGrid /> - Pagination', () => {
       ].join('\n'),
     );
   });
-
-  it('should not log an error if paginationMode is set to undefined', () => {
-    expect(() => {
-      render(<BaselineTestCase paginationMode={undefined} />);
-    }).not.toErrorDev();
-  });
 });