Webdock buttons missing accessible names

[LJWatson]

In the webdock there are buttons that are missing accessible names, which means they're announced like "button 0" by screen readers. The buttons appear to be for switching between spaces.

I can't open dev tools on this part of the screen, at least not using a keyboard, but the most likely cause is that there's no detectable content within the <button> element. The most common reason for this is that there's an icon inside the button but it's either a CSS background image or an SVG image.

The same fix can be applied in either case; use the aria-label attribute to provide an accessible name for each button:

<button aria-label="Accessible name"></button>

Or:

<button aria-label="Accessible name here"><svg></svg></button>

Where "Accessible name here" is the name of the space, or a suitable text alternative for whatever the button represents.

If the latter case is true, the accessible name could alternatively be assigned to the <svg> element, like this:

<button><svg role="img" aria-label="Accessible name here"></svg></button>

Applying the img role and the aria-label attribute exposes the <svg> as an image, just as though there'd been an <img> element inside of the button.

[Thomas101]

Thanks, I'll get these added in. I think they should ship with Wavebox 10.139 onwards 👍