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

Make inline toolbar navigable by arrow keys #43645

Merged
merged 5 commits into from
Sep 13, 2022

Conversation

apmatthews
Copy link
Contributor

@apmatthews apmatthews commented Aug 26, 2022

What?

Allows users to navigate the inline toolbar using arrow keys rather than tabs.

Why?

Users can navigate the block toolbar using arrow keys. The inline toolbar should behave the same way for consistency.

Resolves #43564

How?

Adds the NavigableToolbar component to the inline toolbar.

Testing Instructions

  1. Add an Image block to the page, and insert an image in it;
  2. Caption should be focused automatically;
  3. Press Shift+Tab to enter the caption toolbar;
  4. Note that the toolbar can be navigated using arrow keys.
  5. Press Tab and note that focus moves back to the caption.

@apmatthews apmatthews marked this pull request as draft August 26, 2022 17:08
@apmatthews
Copy link
Contributor Author

I will follow up on these failing tests next week.

@alexstine alexstine self-requested a review August 27, 2022 17:31
@alexstine alexstine added [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [a11y] Keyboard & Focus labels Aug 27, 2022
@apmatthews apmatthews marked this pull request as ready for review August 30, 2022 21:51
Copy link
Contributor

@alexstine alexstine left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@apmatthews Thanks for the improvements. Could you please refresh the branch and maybe tests will pass?

@alexstine alexstine added the [Type] Bug An existing feature does not function as intended label Sep 11, 2022
@alexstine
Copy link
Contributor

@apmatthews Maybe try one more refresh? Lots seems to be changing around this at the moment.

@apmatthews
Copy link
Contributor Author

@alexstine I've just kicked it off once more. If tests do not pass this time, I'll try and find some time this week to pull it down and debug whatever is failing. The failures don't seem related at first glance, but who knows 🤷🏻. Thanks for bumping it!

Copy link
Contributor

@alexstine alexstine left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM.

@alexstine alexstine merged commit 95bf511 into WordPress:trunk Sep 13, 2022
@github-actions github-actions bot added this to the Gutenberg 14.2 milestone Sep 13, 2022
@apmatthews apmatthews deleted the navigable-inline-toolbar branch September 13, 2022 22:52
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Inline toolbar keyboard navigation should be consistent with block toolbar
2 participants