Skip to content

fix(overlay): ARIA attributes for buttons - #1115

Open
skirtles-code wants to merge 1 commit into
vuejs:mainfrom
skirtles-code:overlay-a11y
Open

fix(overlay): ARIA attributes for buttons#1115
skirtles-code wants to merge 1 commit into
vuejs:mainfrom
skirtles-code:overlay-a11y

Conversation

@skirtles-code

Copy link
Copy Markdown
Contributor

Closes #928.

Elements with aria-label must also have a suitable role. This problem is currently being reported by ARIA testing tools, including the built-in Lighthouse tool in Chrome.

The roles that support aria-label are listed at:

I think role="button" is the most appropriate for this use case. I'm not sure why these buttons are using <div> rather than <button> but I haven't changed that.

I've made similar changes to the other button.

I've also added aria-pressed as both buttons function as toggle buttons with pressed and unpressed states.

@netlify

netlify Bot commented Jul 26, 2026

Copy link
Copy Markdown

Deploy Preview for vue-devtools-docs canceled.

Name Link
🔨 Latest commit f338402
🔍 Latest deploy log https://app.netlify.com/projects/vue-devtools-docs/deploys/6a659ada37f78c0008829a29

@pkg-pr-new

pkg-pr-new Bot commented Jul 26, 2026

Copy link
Copy Markdown

Open in StackBlitz

@vue/devtools-applet

npm i https://pkg.pr.new/@vue/devtools-applet@1115

@vue/devtools-core

npm i https://pkg.pr.new/@vue/devtools-core@1115

@vue/devtools

npm i https://pkg.pr.new/@vue/devtools@1115

@vue/devtools-api

npm i https://pkg.pr.new/@vue/devtools-api@1115

@vue/devtools-kit

npm i https://pkg.pr.new/@vue/devtools-kit@1115

@vue/devtools-electron

npm i https://pkg.pr.new/@vue/devtools-electron@1115

@vue/devtools-shared

npm i https://pkg.pr.new/@vue/devtools-shared@1115

@vue/devtools-ui

npm i https://pkg.pr.new/@vue/devtools-ui@1115

vite-plugin-vue-devtools

npm i https://pkg.pr.new/vite-plugin-vue-devtools@1115

commit: f338402

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.

accessibility / aria issue in vue devtools button

1 participant