Skip to content

[Menu] Disabled MenuItems still accessible via keyboard #13464

Description

@kylane
  • This is not a v0.x issue.
  • I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior

The keyboard should not be able to navigate focus to the disabled MenuItem in a Select.

Current Behavior

When focussing a select to activate the popper on a Select, the disabled MenuItem is still able to be selected.

Steps to Reproduce

Link: https://codesandbox.io/s/7yvj6qyy4j
ScreenCap: https://www.youtube.com/watch?v=T77Ue7Srr0s

  1. Use keyboard to navigate and highlight the select
  2. Open the select and chose a valid value to set the state and re-render the select with that value
  3. Use keyboard to navigate back to the select and open the popper and arrow-up to the disabled item (wont have any focus styles) and select it
  4. The Select is now the disabled value

Context

Just a bit confusing from an accessibility POV is all.

Your Environment

Tech Version
Material-UI v3.2.0
React 16.3.2
Browser Any
TypeScript
etc.

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions