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.

Sign up for GitHub

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

Jump to bottom

Wrong use of aria-hidden #346

Open

mp-horm opened this issue Sep 28, 2023 · 1 comment

mp-horm commented Sep 28, 2023

Describe the bug
Carousel items are marked as aria-hidden=true when not visible. Aria-hidden should only be applied to non-interactive elements.
https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-hidden
The attribute causes WCAG errors when using focusable elements (buttons, inputs, links) in carousel items.

To Reproduce
Steps to reproduce the behavior:

Render a carousel with two items, one of them using a focusable element (ie a button)
Click on the non-button item
Copy page html to https://validator.w3.org/#validate_by_input
See error related to
https://accessibilityinsights.io/info-examples/web/aria-hidden-focus/

Expected behavior
No accessibility errors

kwilfert commented Oct 10, 2023

I second this. During my migration to vue 3, its compatibility mode keeps logging the aria-hidden property's false-value.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment