devtools icon indicating copy to clipboard operation
devtools copied to clipboard

[Feature] Improve accessibility of the devtools

Open Svish opened this issue 2 years ago • 4 comments

Would be great if the devtools was more accessible. See for example the sad accessibility tree when I select the collapse button:

image

The toggle button, should have an aria-label and be linked to the panel via aria-controls, aria-haspopup and aria-expanded.

The panel itself should be an <aside> and also have a descriptive name via aria-label.

The buttons inside the panel and such could probably be improved too, but at least the above should make the devtools itself more "visible" in the accessibility tree.

Svish avatar Jun 15 '22 07:06 Svish

Valid for the feedback itself. It's an open-source project if you have a strong opinion (a valid one) about things you can contribute and send us a PR. Rolling face around doesn't add any value to the project and shows any thought of appreciation toward people using their free time on the project like myself.

So conclusion: Feel free to send a PR to improve on the accesiblity. thanks

bluebill1049 avatar Jun 15 '22 08:06 bluebill1049

Sorry, wasn't aware the 🙃 smiley was considered offensive or ungrateful, I just wanted to be nice. Removed it now.

Svish avatar Jun 15 '22 08:06 Svish

all good. It's a contextual thing, like I said it's valid feedback in general.

bluebill1049 avatar Jun 15 '22 08:06 bluebill1049

So what is being done to make the devtools more accessible?

mgifford avatar Sep 09 '22 12:09 mgifford