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.

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] Keyboard navigation with variable row height #3758

Closed
Tracked by #3737
cherniavskii opened this issue Jan 27, 2022 · 0 comments · Fixed by #3761
Closed
Tracked by #3737

[DataGrid] Keyboard navigation with variable row height #3758

cherniavskii opened this issue Jan 27, 2022 · 0 comments · Fixed by #3761
Assignees
Labels
accessibility a11y bug 🐛 Something doesn't work component: data grid This is the name of the generic UI component, not the React module!

Comments

@cherniavskii
Copy link
Member

cherniavskii commented Jan 27, 2022

Fix keyboard navigation, e.g. Page Up, to use the scroll position and the position of each row

So there's two issues here when it comes to keyboard navigation:

1. PageUp is jumping directly to the column header while not on the first row yet

This was reported here #3218 (comment)

It's reproducible in 5.3.0, so even before variable row height was introduced.

Screen.Recording.2022-01-27.at.19.26.02.mov

Codesandbox: https://codesandbox.io/s/flexlayoutgrid-material-demo-forked-08wux

2. Next rows not loading when navigating with arrow key down when rows have different row height

Screen.Recording.2022-01-27.at.19.17.34.mov

This issue is reproducible in both DataGrid and DataGridPro.
Furthermore, same issue is already present in columns keyboard navigation.
For columns, it's already reported in #3436
The solution seems to be rowThreshold={0}.
Looks like we won't be fixing it before v6. In v6 rowThreshold will be removed.

@cherniavskii cherniavskii changed the title Fix keyboard navigation, e.g. Page Up, to use the scroll position and the position of each row [DataGridPro] Keyboard navigation with variable row height Jan 27, 2022
@cherniavskii cherniavskii self-assigned this Jan 27, 2022
@cherniavskii cherniavskii changed the title [DataGridPro] Keyboard navigation with variable row height [DataGrid] Keyboard navigation with variable row height Jan 27, 2022
@cherniavskii cherniavskii added bug 🐛 Something doesn't work component: data grid This is the name of the generic UI component, not the React module! labels Jan 27, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
accessibility a11y bug 🐛 Something doesn't work component: data grid This is the name of the generic UI component, not the React module!
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants