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

[core] fix(MenuItem): make items focusable for a11y consistency #4892

Merged
merged 1 commit into from
Sep 8, 2021

Conversation

adidahiya
Copy link
Contributor

Fixes #4810

Changes proposed in this pull request:

Apply tabIndex="0" to all MenuItems by default, even if they don't have an href or onChange. The reasoning for this is that we make MenuItems look interactive regardless of whether they are actually hooked up to do something in an application (with :hover and :active styles), so for accessible consistency we should also make them focusable via the keyboard.

Reviewers should focus on:

N/A

Screenshot

Before this PR (pressing TAB, TAB, TAB, TAB, SHIFT+TAB, SHIFT+TAB, SHIFT+TAB, SHIFT+TAB):

2021-09-08 16 01 12

After this PR (pressing TAB, TAB, TAB, TAB, SHIFT+TAB, SHIFT+TAB, SHIFT+TAB, SHIFT+TAB):

2021-09-08 16 01 26

@adidahiya adidahiya changed the title [core] fix(MenuItem): add tabIndex={0} to make items focussable [core] fix(MenuItem): make items focusable for a11y consistency Sep 8, 2021
@blueprint-bot
Copy link

[core] fix(MenuItem): add tabIndex={0} to make items focussable

Previews: documentation | landing | table

@adidahiya adidahiya merged commit 88a158b into develop Sep 8, 2021
@adidahiya adidahiya deleted the ad/menu-item-tabindex branch September 8, 2021 20:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Clickable menu items should specify tabindex="0" for keyboard accessible controls
2 participants