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

fix(core): use updated aria control attribute for root element #1278

Merged
merged 1 commit into from
Oct 14, 2024

Conversation

dhayab
Copy link
Member

@dhayab dhayab commented Oct 14, 2024

Summary

This PR updates getRootProps() to return aria-controls instead of aria-owns, following the latest ARIA specs.

From MDN:

When a combobox's popup is displayed, ensure the aria-controls attribute on the combobox element is set to the id of the popup listbox, tree, grid, or dialog element. This is how the relationship between the element with the combobox role and the popup it controls is indicated. (Note: In older ARIA specs, this was aria-owns rather than aria-controls, so you may see aria-owns in older combobox implementations. The aria-owns in the code should be updated to aria-controls!)

Result

Assistive technologies correctly link the combobox with the listbox it controls. Accessibility tools like WAVE and axe stop reporting errors relevant to this.

Closes #1271

@dhayab dhayab requested review from a team, sarahdayan and aymeric-giraudet and removed request for a team October 14, 2024 12:40
Copy link

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 34bd1df:

Sandbox Source
@algolia/autocomplete-example-github-repositories-custom-plugin Configuration
@algolia/autocomplete-example-instantsearch Configuration
@algolia/autocomplete-example-playground Configuration
@algolia/autocomplete-example-preview-panel-in-modal Configuration
@algolia/autocomplete-example-starter-algolia Configuration
@algolia/autocomplete-example-starter Configuration
@algolia/autocomplete-example-reshape Configuration
@algolia/autocomplete-example-vue Configuration

Copy link
Member

@sarahdayan sarahdayan left a comment

Choose a reason for hiding this comment

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

LGTM!

A good improvement for the future would be to include automated Axe Core tests in our CI to flag those issues.

@dhayab dhayab merged commit f64497b into next Oct 14, 2024
10 checks passed
@dhayab dhayab deleted the fix/rootprops-aria-controls-attribute branch October 14, 2024 14:11
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.

The aria-controls attribute isn't returned by getRootProps
2 participants