[DataGrid] Fix header filters keyboard navigation when there are no r…

…ows (#16126) Co-authored-by: Bilal Shafi <[email protected]>
mui · Jan 28, 2025 · e564238 · e564238
1 parent dd43aa0
commit e564238
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 6 deletions.
diff --git a/packages/x-data-grid-pro/src/tests/filtering.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/filtering.DataGridPro.test.tsx
@@ -1235,6 +1235,33 @@ describe('<DataGridPro /> - Filter', () => {
       await waitFor(() => expect(getColumnValues(0)).to.deep.equal(['100', '1,000']));
       expect(changeSpy.lastCall.args[0].items[0].value).to.equal(10); // 0.1e2
     });
+
+    it('should allow to navigate to the header filter cell when there are no rows', async () => {
+      clock.restore();
+      const { user } = render(
+        <TestCase
+          headerFilters
+          initialState={{
+            filter: {
+              filterModel: {
+                items: [
+                  {
+                    field: 'brand',
+                    operator: 'contains',
+                    value: 'abc',
+                  },
+                ],
+              },
+            },
+          }}
+        />,
+      );
+      const headerCell = getColumnHeaderCell(0, 0);
+      const filterCell = getColumnHeaderCell(0, 1);
+      await user.click(headerCell);
+      await user.keyboard('{ArrowDown}');
+      expect(filterCell).toHaveFocus();
+    });
   });
 
   describe('Read-only filters', () => {

diff --git a/packages/x-data-grid/src/hooks/features/keyboardNavigation/useGridKeyboardNavigation.ts b/packages/x-data-grid/src/hooks/features/keyboardNavigation/useGridKeyboardNavigation.ts
@@ -177,13 +177,12 @@ export const useGridKeyboardNavigation = (
 
       switch (event.key) {
         case 'ArrowDown': {
-          if (firstRowIndexInPage !== null) {
-            if (headerFilteringEnabled) {
-              goToHeaderFilter(colIndexBefore, event);
-            } else {
-              goToCell(colIndexBefore, getRowIdFromIndex(firstRowIndexInPage));
-            }
+          if (headerFilteringEnabled) {
+            goToHeaderFilter(colIndexBefore, event);
+          } else if (firstRowIndexInPage !== null) {
+            goToCell(colIndexBefore, getRowIdFromIndex(firstRowIndexInPage));
           }
+
           break;
         }