refactor

mui · Jul 21, 2023 · 68dc0cc · 68dc0cc
1 parent 1ab2ae1
commit 68dc0cc
Show file tree

Hide file tree

Showing 2 changed files with 112 additions and 55 deletions.
diff --git a/packages/grid/x-data-grid-premium/src/tests/DataGridPremium.test.tsx b/packages/grid/x-data-grid-premium/src/tests/DataGridPremium.test.tsx
@@ -0,0 +1,108 @@
+import * as React from 'react';
+import { createRenderer, act } from '@mui/monorepo/test/utils';
+import { expect } from 'chai';
+import {
+  DataGridPremium as DataGrid,
+  DataGridPremiumProps as DataGridProps,
+  GridApi,
+  GridToolbar,
+  useGridApiRef,
+} from '@mui/x-data-grid-premium';
+import { getColumnValues } from 'test/utils/helperFn';
+
+const isJSDOM = /jsdom/.test(window.navigator.userAgent);
+
+describe('<DataGrid /> - Quick Filter', () => {
+  const { render } = createRenderer();
+
+  const baselineProps = {
+    autoHeight: isJSDOM,
+    disableVirtualization: true,
+    rows: [
+      {
+        id: 0,
+        brand: 'Nike',
+      },
+      {
+        id: 1,
+        brand: 'Adidas',
+      },
+      {
+        id: 2,
+        brand: 'Puma',
+      },
+    ],
+    columns: [{ field: 'brand' }],
+  };
+
+  let apiRef: React.MutableRefObject<GridApi>;
+
+  function TestCase(props: Partial<DataGridProps>) {
+    apiRef = useGridApiRef();
+
+    return (
+      <div style={{ width: 300, height: 300 }}>
+        <DataGrid
+          {...baselineProps}
+          apiRef={apiRef}
+          slots={{ toolbar: GridToolbar }}
+          disableColumnSelector
+          disableDensitySelector
+          disableColumnFilter
+          {...props}
+          slotProps={{
+            ...props?.slotProps,
+            toolbar: {
+              showQuickFilter: true,
+              ...props?.slotProps?.toolbar,
+            },
+          }}
+        />
+      </div>
+    );
+  }
+
+  // https://github.com/mui/mui-x/issues/9677
+  it('should not fail when adding a grouping criterion', () => {
+    const { setProps } = render(
+      <TestCase
+        rows={[
+          {
+            id: 1,
+            company: '20th Century Fox',
+            director: 'James Cameron',
+            year: 1999,
+            title: 'Titanic',
+          },
+        ]}
+        columns={[
+          { field: 'company' },
+          { field: 'director' },
+          { field: 'year' },
+          { field: 'title' },
+        ]}
+        initialState={{
+          rowGrouping: {
+            model: ['company'],
+          },
+          aggregation: {
+            model: {
+              director: 'size',
+            },
+          },
+        }}
+      />,
+    );
+
+    act(() => apiRef.current.addRowGroupingCriteria('year'));
+
+    setProps({
+      filterModel: {
+        items: [],
+        quickFilterValues: ['Cameron'],
+      },
+    });
+
+    expect(getColumnValues(0)).to.deep.equal(['20th Century Fox (1)', '']);
+  });
+});
diff --git a/packages/grid/x-data-grid/src/tests/quickFiltering.DataGrid.test.tsx b/packages/grid/x-data-grid/src/tests/quickFiltering.DataGrid.test.tsx
@@ -1,17 +1,15 @@
 import * as React from 'react';
-import { createRenderer, screen, fireEvent, act } from '@mui/monorepo/test/utils';
+import { createRenderer, screen, fireEvent } from '@mui/monorepo/test/utils';
 import { expect } from 'chai';
 import { spy } from 'sinon';
 import {
-  DataGridPremium as DataGrid,
-  DataGridPremiumProps as DataGridProps,
-  GridApi,
+  DataGrid,
+  DataGridProps,
   GridFilterModel,
   GridLogicOperator,
   GridToolbar,
   getGridStringQuickFilterFn,
-  useGridApiRef,
-} from '@mui/x-data-grid-premium';
+} from '@mui/x-data-grid';
 import { getColumnValues, sleep } from 'test/utils/helperFn';
 
 const isJSDOM = /jsdom/.test(window.navigator.userAgent);
@@ -39,16 +37,11 @@ describe('<DataGrid /> - Quick Filter', () => {
     columns: [{ field: 'brand' }],
   };
 
-  let apiRef: React.MutableRefObject<GridApi>;
-
   function TestCase(props: Partial<DataGridProps>) {
-    apiRef = useGridApiRef();
-
     return (
       <div style={{ width: 300, height: 300 }}>
         <DataGrid
           {...baselineProps}
-          apiRef={apiRef}
           slots={{ toolbar: GridToolbar }}
           disableColumnSelector
           disableDensitySelector
@@ -645,48 +638,4 @@ describe('<DataGrid /> - Quick Filter', () => {
       rows: [],
     });
   });
-
-  // https://github.com/mui/mui-x/issues/9677
-  it('should not fail when adding a grouping criterion', () => {
-    const { setProps } = render(
-      <TestCase
-        rows={[
-          {
-            id: 1,
-            company: '20th Century Fox',
-            director: 'James Cameron',
-            year: 1999,
-            title: 'Titanic',
-          },
-        ]}
-        columns={[
-          { field: 'company' },
-          { field: 'director' },
-          { field: 'year' },
-          { field: 'title' },
-        ]}
-        initialState={{
-          rowGrouping: {
-            model: ['company'],
-          },
-          aggregation: {
-            model: {
-              director: 'size',
-            },
-          },
-        }}
-      />,
-    );
-
-    act(() => apiRef.current.addRowGroupingCriteria('year'));
-
-    setProps({
-      filterModel: {
-        items: [],
-        quickFilterValues: ['Cameron'],
-      },
-    });
-
-    expect(getColumnValues(0)).to.deep.equal(['20th Century Fox (1)', '']);
-  });
 });