[DataGrid] Add test coverage for issues fixed in #15184 (@MBilalShafi) (

#15464)

Co-authored-by: Bilal Shafi <[email protected]>

packages/x-data-grid-pro/src/tests/rowSelection.DataGridPro.test.tsx

@@ -11,6 +11,7 @@ import {
   GridRowSelectionModel,
   GridRowsProp,
   GridColDef,
+  GridFilterModel,
 } from '@mui/x-data-grid-pro';
 import { getBasicGridData } from '@mui/x-data-grid-generator';
 
@@ -194,6 +195,69 @@ describe('<DataGridPro /> - Row selection', () => {
     expect(apiRef.current.getSelectedRows()).to.have.keys([1]);
   });
 
+  // Context: https://github.com/mui/mui-x/issues/15045
+  it('should not throw when using `isRowSelectable` and `keepNonExistentRowsSelected`', () => {
+    function TestDataGrid() {
+      const [gridRows, setRows] = React.useState(rows);
+      const onFilterChange = React.useCallback(
+        (filterModel: GridFilterModel) => {
+          if (filterModel.items?.length === 0) {
+            return;
+          }
+
+          const filteredRows = rows.filter((row) => {
+            return row.jobTitle.includes(filterModel.items[0].value);
+          });
+          setRows(filteredRows);
+        },
+        [setRows],
+      );
+      return (
+        <TreeDataGrid
+          defaultGroupingExpansionDepth={-1}
+          isRowSelectable={() => true}
+          rows={gridRows}
+          onFilterModelChange={onFilterChange}
+          keepNonExistentRowsSelected
+        />
+      );
+    }
+    render(<TestDataGrid />);
+
+    // Select `Thomas`
+    fireEvent.click(
+      screen.getAllByRole('checkbox', {
+        name: /select row/i,
+      })[1],
+    );
+
+    expect(apiRef.current.getSelectedRows()).to.have.length(1);
+    expect(Array.from(apiRef.current.getSelectedRows())[0][0]).to.equal(1);
+
+    act(() => {
+      apiRef.current.setFilterModel({
+        items: [{ field: 'jobTitle', value: 'Head of Human Resources', operator: 'contains' }],
+      });
+    });
+
+    expect(apiRef.current.getSelectedRows()).to.have.length(1);
+    expect(Array.from(apiRef.current.getSelectedRows())[0][0]).to.equal(1);
+  });
+
+  // Context: https://github.com/mui/mui-x/issues/15068
+  it('should not call `onRowSelectionModelChange` when adding a new row', () => {
+    const onRowSelectionModelChange = spy();
+    const { setProps } = render(
+      <TreeDataGrid onRowSelectionModelChange={onRowSelectionModelChange} />,
+    );
+
+    act(() => {
+      setProps({ rows: [...rows, { id: 15, hierarchy: ['New'], jobTitle: 'Test Job' }] });
+    });
+
+    expect(onRowSelectionModelChange.callCount).to.equal(0);
+  });
+
   it('should put the parent into indeterminate if some but not all the children are selected', () => {
     render(<TreeDataGrid defaultGroupingExpansionDepth={-1} density="compact" />);
 

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

@@ -18,6 +18,7 @@ import {
   useGridApiRef,
   GridApi,
   GridPreferencePanelsValue,
+  GridRowSelectionModel,
 } from '@mui/x-data-grid';
 import {
   getCell,
@@ -65,6 +66,29 @@ describe('<DataGrid /> - Row selection', () => {
     );
   }
 
+  // Context: https://github.com/mui/mui-x/issues/15079
+  it('should not call `onRowSelectionModelChange` twice when using filterMode="server"', () => {
+    const onRowSelectionModelChange = spy();
+    function TestDataGrid() {
+      const [, setRowSelectionModel] = React.useState<GridRowSelectionModel>([]);
+      const handleRowSelectionModelChange = React.useCallback((model: GridRowSelectionModel) => {
+        setRowSelectionModel(model);
+        onRowSelectionModelChange(model);
+      }, []);
+      return (
+        <TestDataGridSelection
+          getRowId={(row) => row.id}
+          checkboxSelection
+          onRowSelectionModelChange={handleRowSelectionModelChange}
+          filterMode="server"
+        />
+      );
+    }
+    render(<TestDataGrid />);
+    fireEvent.click(getCell(0, 0).querySelector('input')!);
+    expect(onRowSelectionModelChange.callCount).to.equal(1);
+  });
+
   describe('prop: checkboxSelection = false (single selection)', () => {
     it('should select one row at a time on click WITHOUT ctrl or meta pressed', () => {
       render(<TestDataGridSelection />);