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

[a11y] More accessible MultiCheckboxFacets #319

Merged
merged 4 commits into from
Jul 9, 2019
Merged

[a11y] More accessible MultiCheckboxFacets #319

merged 4 commits into from
Jul 9, 2019

Conversation

cee-chen
Copy link
Member

@cee-chen cee-chen commented Jul 9, 2019

Description

This is a quick semantic markup change which enhances many screen readers' ability to associate multiple checkbox groups with its parent group label.

Before

After

Notice how California now reads out the parent "States" label, giving more context to keyboard tabbing users.

Screencap

fieldset

^ Posting for general edification - note how the parent legend is only read out when the user tabs into the first input within the fieldset group, and is not read out again when tabbing to other items within the group. This is great behavior for context while not becoming repetitive.

List of changes

  • Changes MultiCheckboxFacet markup from divs to fieldset/legend tags.

QA

  • Tested in MacOS Voiceover
  • Tested in Chrome for no visual regressions
  • Tested in Firefox for no visual regressions
  • Tested in Edge for no visual regressions

@cee-chen cee-chen requested a review from JasonStoltz July 9, 2019 16:31
@yakhinvadim yakhinvadim self-requested a review July 9, 2019 17:40
yakhinvadim
yakhinvadim previously approved these changes Jul 9, 2019
Copy link
Contributor

@yakhinvadim yakhinvadim left a comment

Choose a reason for hiding this comment

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

I like it 👍

@cee-chen
Copy link
Member Author

cee-chen commented Jul 9, 2019

Rebased to fix a merge conflict with #311!

@cee-chen cee-chen merged commit 728f386 into elastic:master Jul 9, 2019
@cee-chen cee-chen deleted the a11y-multicheckbox-facet branch July 9, 2019 19:06
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