Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[DataGrid] Fix error when keyboard navigating an empty grid #10081

Merged
merged 4 commits into from
Aug 31, 2023
Merged

[DataGrid] Fix error when keyboard navigating an empty grid #10081

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
3d1473a
branch: create
romgrk Aug 18, 2023
c92a6ce
fix: keyboard error
romgrk Aug 18, 2023
6b89bbd
fix: something
romgrk Aug 28, 2023
c4f1bfe
test: fix
romgrk Aug 29, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions packages/grid/x-data-grid/src/hooks/features/keyboardNavigation/useGridKeyboardNavigation.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -171,7 +171,7 @@ export const useGridKeyboardNavigation = (

const getRowIdFromIndex = React.useCallback(
(rowIndex: number) => {
return currentPageRows?.[rowIndex].id;
return currentPageRows[rowIndex]?.id;
},
[currentPageRows],
);
Expand All @@ -197,7 +197,7 @@ export const useGridKeyboardNavigation = (

const viewportPageSize = apiRef.current.getViewportPageSize();
const colIndexBefore = params.field ? apiRef.current.getColumnIndex(params.field) : 0;
const firstRowIndexInPage = 0;
const firstRowIndexInPage = currentPageRows.length > 0 ? 0 : null;
const lastRowIndexInPage = currentPageRows.length - 1;
const firstColIndex = 0;
const lastColIndex = gridVisibleColumnDefinitionsSelector(apiRef).length - 1;
Expand Down
15 changes: 15 additions & 0 deletions packages/grid/x-data-grid/src/tests/keyboard.DataGrid.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -715,4 +715,19 @@ describe('<DataGrid /> - Keyboard', () => {
fireEvent.keyDown(firstCell, { key: 'ArrowDown' });
expect(virtualScroller.scrollLeft).to.equal(0);
});

it('should not throw when moving into an empty grid', async () => {
Copy link
Member

@oliviertassinari oliviertassinari Aug 31, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Doesn't look needed:

Suggested change
it('should not throw when moving into an empty grid', async () => {
it('should not throw when moving into an empty grid', () => {

const columns = [{ field: 'id', width: 400 }, { field: 'name' }];
const rows = [] as any[];

render(
<div style={{ width: 300, height: 300 }}>
<DataGrid rows={rows} columns={columns} />
</div>,
);

const cell = getColumnHeaderCell(0);
act(() => cell.focus());
fireEvent.keyDown(cell, { key: 'ArrowDown' });
});
});