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] Select inside cell doesn't trigger keyboard navigation when an item is selected via keyboard #2880

Closed
2 tasks done
m4theushw opened this issue Oct 15, 2021 · 0 comments · Fixed by #3220
Closed
2 tasks done
Labels
bug 🐛 Something doesn't work component: data grid This is the name of the generic UI component, not the React module!

Comments

@m4theushw
Copy link
Member

Duplicates

  • I have searched the existing issues

Latest version

  • I have tested the latest version

Current behavior 😯

Selecting an item with Enter doesn't close the Select and the focus is not moved to the correct cell.

MOzZnhjFK9

Expected behavior 🤔

In https://v4.mui.com/components/data-grid/demo

d5NlwGP7PK

It should move the focus to the cell underneath when an item is selected with Enter.

Steps to reproduce 🕹

It can be reproduced in https://mui.com/components/data-grid/demo/.

Context 🔦

This check is wrong: https://github.com/mui-org/material-ui-x/blob/998b4024d2793b673baa9f410e8b4c08c6dd7811/packages/grid/_modules_/grid/hooks/features/keyboard/useGridKeyboard.ts#L58-L60

When using MUI Core v4, a keyDown event fired by a Select has a fake target, which doesn't satisfy the above condition: https://github.com/mui-org/material-ui/blob/c545ccab7edfdf4a44d4ec2f4bf10ebc7fd00259/packages/material-ui/src/Select/SelectInput.js#L194

In v5, it was changed to not override the original target, which made it to fall into the condition: https://github.com/mui-org/material-ui/blob/81578f0b52b469e0b0d2cb9df2ebf6820e05e6c6/packages/mui-material/src/Select/SelectInput.js#L269-L271

Flavien raised a similar issue in #2862 (comment).

Your environment 🌎

`npx @mui/envinfo`
  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

Order ID 💳 (optional)

No response

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
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.

1 participant