restored test in xgrid

mui · Nov 6, 2020 · 57caf63 · 57caf63
1 parent d76711b
commit 57caf63
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 35 deletions.
diff --git a/packages/grid/data-grid/src/DataGrid.test.tsx b/packages/grid/data-grid/src/DataGrid.test.tsx
@@ -4,13 +4,7 @@ import PropTypes from 'prop-types';
 import { createClientRender, ErrorBoundary } from 'test/utils';
 import { useFakeTimers } from 'sinon';
 import { expect } from 'chai';
-import { DataGrid, GridState } from '@material-ui/data-grid';
-
-function getColumnValues() {
-  return Array.from(document.querySelectorAll('[role="cell"][aria-colindex="0"]')).map(
-    (node) => node!.textContent,
-  );
-}
+import { DataGrid } from '@material-ui/data-grid';
 
 describe('<DataGrid />', () => {
   const render = createClientRender();
@@ -197,33 +191,6 @@ describe('<DataGrid />', () => {
       );
     });
   });
-  describe('State', () => {
-    it('should allow to control the state using useState', () => {
-      function GridStateTest({direction, sortedRows}) {
-        const [gridState, setGridState] = React.useState<Partial<GridState>>({
-          sorting: {sortModel: [{field: 'brand', sort: direction}], sortedRows},
-        });
-
-        React.useEffect(() => {
-          setGridState({
-            sorting: {sortModel: [{field: 'brand', sort: direction}], sortedRows},
-          });
-        }, [direction, sortedRows]);
-
-        return (
-          <div style={{width: 300, height: 300}}>
-            <DataGrid {...defaultProps} state={gridState}/>
-          </div>
-        );
-      }
-
-      const {setProps} = render(<GridStateTest direction={'desc'} sortedRows={[2, 0, 1]}/>);
-      expect(getColumnValues()).to.deep.equal(['Puma', 'Nike', 'Adidas']);
-      setProps({direction: 'asc', sortedRows: [1, 0, 2]});
-      expect(getColumnValues()).to.deep.equal(['Puma', 'Nike', 'Adidas'].reverse());
-    });
-  });
-
   describe('column width', () => {
     before(function beforeHook() {
       if (/jsdom/.test(window.navigator.userAgent)) {

diff --git a/packages/grid/x-grid/src/XGrid.test.tsx b/packages/grid/x-grid/src/XGrid.test.tsx
@@ -1,8 +1,9 @@
+import { DataGrid } from '@material-ui/data-grid';
 import * as React from 'react';
 // @ts-expect-error need to migrate helpers to TypeScript
 import { fireEvent, screen, createClientRender } from 'test/utils';
 import { expect } from 'chai';
-import { XGrid, useApiRef, Columns } from '@material-ui/x-grid';
+import { XGrid, useApiRef, Columns, GridState } from '@material-ui/x-grid';
 import { useData } from 'packages/storybook/src/hooks/useData';
 
 async function raf() {
@@ -309,5 +310,29 @@ describe('<XGrid />', () => {
       expect(onStateParams.state).to.not.be.empty;
 
     });
+    it('should allow to control the state using useState', async () => {
+      function GridStateTest({direction, sortedRows}) {
+        const [gridState, setGridState] = React.useState<Partial<GridState>>({
+          sorting: {sortModel: [{field: 'brand', sort: direction}], sortedRows},
+        });
+
+        React.useEffect(() => {
+          setGridState({
+            sorting: {sortModel: [{field: 'brand', sort: direction}], sortedRows},
+          });
+        }, [direction, sortedRows]);
+
+        return (
+          <div style={{width: 300, height: 300}}>
+            <DataGrid {...defaultProps} state={gridState}/>
+          </div>
+        );
+      }
+
+      const {setProps} = render(<GridStateTest direction={'desc'} sortedRows={[2, 0, 1]}/>);
+      expect(getColumnValues()).to.deep.equal(['Puma', 'Nike', 'Adidas']);
+      setProps({direction: 'asc', sortedRows: [1, 0, 2]});
+      expect(getColumnValues()).to.deep.equal(['Puma', 'Nike', 'Adidas'].reverse());
+    });
   });
 });