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

Empty elements referenced by aria-labelledby should fail #4517

Open
WilcoFiers opened this issue Jul 1, 2024 · 0 comments
Open

Empty elements referenced by aria-labelledby should fail #4517

WilcoFiers opened this issue Jul 1, 2024 · 0 comments
Labels
Accessible text false negative rules Issue or false result from an axe-core rule

Comments

@WilcoFiers
Copy link
Contributor

The following should result in two failures for the button element:

<button aria-label="foo" aria-labelledby="foo"></button>
<button>
  <img alt="foo" aria-labelledby="foo">
</button>
<div id="foo"></div>

I'm not sure why these elements aren't getting an accessible name in Chrome. I'm pretty sure these used to get an accessible name. We should test if assistive tech also think these are empty. This issue is going to be true for quite a lot of rules too,

Fixing this is going to be tricky. Axe-core runs any checks with these, so right now if a button has aria-label it just passes. We'll have to somehow prevent that if the button also has aria-labelledby? We'll need to think about how to clearly communicate this. This is unintuitive that an empty aria-labelledby ref is not ignored while a missing ref, or an empty aria-label is ignored.

@WilcoFiers WilcoFiers added rules Issue or false result from an axe-core rule false negative Accessible text labels Jul 1, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Accessible text false negative rules Issue or false result from an axe-core rule
Projects
None yet
Development

No branches or pull requests

1 participant