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

[Bug Report][3.3.13] a11y: v-data-table checkboxes do not have labels, v-select has nested interactive components #18228

Closed
kmmerc18 opened this issue Sep 7, 2023 · 0 comments · Fixed by #19406
Assignees

Comments

@kmmerc18
Copy link

kmmerc18 commented Sep 7, 2023

Environment

Vuetify Version: 3.3.13
Vue Version: 3.1.5
Browsers: Chrome 116.0.0.0
OS: Mac OS 10.15.7

Steps to reproduce

Use the aXe Accessibility chrome extension and scan the playground example's page. There are two errors.

Expected Behavior

No errors should appear

Actual Behavior

The v-select nested in the v-data-table (and any plain, standalone v-select) give the error "Interactive Features must not be nested" referring to the input element inside the v-field. The v-data-table itself needs an aria-label on the checkbox input that shows as a result of the show-select prop

Reproduction Link

https://play.vuetifyjs.com/#...

@johnleider johnleider self-assigned this Nov 30, 2023
johnleider added a commit that referenced this issue Mar 26, 2024
fixes #18228

Co-authored-by: John Leider <john@vuetifyjs.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants