Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Support selecting menu item from <input> #38

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

Closed
wants to merge 11 commits into from
Closed

Conversation

muan
Copy link
Contributor

@muan muan commented Oct 21, 2019

Currently when a menu contains a filtering input, navigating items will take user's focus away from the input. This creates quite an annoyance when quick filtering actions are performed.

This adds support for managing focus via aria-activedescendant when an input is specified on the menu element, and said input is focused. Aside from setting input attribute, the markup should also fulfill the following (not enforced by details-menu):

  • aria-owns on <input> targeting the menu item container
  • id and role on the menu item container since role=menu should not contain <input>
  • Static id on each of the menu item (there is a dynamically generated ID, but in testing it seems AT might be slow in picking them up)
  • Styling focus style with :focus, [aria-selected="true"]
Keyboard VO w/ Safari

References:

@muan muan requested a review from a team October 21, 2019 20:26
Copy link
Contributor

@keithamus keithamus left a comment

Choose a reason for hiding this comment

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

LGTM 👍

getCurrentFocus is always used in conjunction with these two other
checks. This refactor would save us from having to write those checks
at every call site.
@muan
Copy link
Contributor Author

muan commented Feb 5, 2020

We're no longer pursuing this.

@muan muan closed this Feb 5, 2020
@muan muan deleted the input-support branch February 5, 2020 20:00
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.

3 participants