-
-
Notifications
You must be signed in to change notification settings - Fork 32.7k
Description
- The issue is present in the latest release.
- I have searched the issues of this repository and believe that this is not a duplicate.
Current Behavior 😯
When interacting with the Select component using a keyboard, hitting the space key when focused on the component opens and then immediately closes the menu, selecting the first option. Options can be selected by holding space, navigating using the arrow keys, and then releasing the space key, but I doubt this is intended functionality.
Expected Behavior 🤔
When focused on the Select component, hitting the space key should open the menu and allow the user to select an option in the same way as hitting the enter key - This is how the Native Select component works.
One thing I did notice is that when using a native select, the space key is able to open the options menu however it is not able to select an option (only the enter key seems to be able to do this) - unsure if we want to replicate this exact functionality in the Select component or have the space key work exactly the same as the enter key. This could be specific to Chrome also, as I haven't tested on other browsers.
Steps to Reproduce 🕹
This issue can be reproduced on the docs site easily:
https://material-ui.com/components/selects/
Steps:
- Navigate to the Select examples page on the Material UI docs site using the link above
- Using the tab key, focus onto one of the Simple Select example inputs
- Hit or hold the space key (menu will open and immediately close)
- Focus onto one of the Native Select examples
- Hit the space key (menu will open as expected)
Below is a gif showing what happens when the space key is hit:

Context 🔦
In our application we have a form built from MUI components - using the keyboard to navigate between inputs is a feature that is commonly used.
Your Environment 🌎
| Tech | Version |
|---|---|
| Material-UI | v4.7.1 |
| React | v16.12.0 |
| Browser | 72.0.3626.81 (Official Build) (64-bit) (Windows 10) |
| TypeScript | v3.7.2 |