In narrow window sizes, New Topic button has no ARIA description

(Dan Fabulich) #1

Resize your browser window to be slightly less than 850px wide. The “+ New Topic” button will collapse to a + button.

Using a screen reader like macOS VoiceOver, select the button. (I’ve also reproduced this in JAWS on Windows with Firefox.)

Expected: The collapsed button should have an ARIA description, explaining that this is a New Topic button

Actual: The collapsed button has no description. The screen reader just says, “button.”

(Dan Fabulich) #2

Note that this does not impact iOS VoiceOver, because on iOS, the New Topic button doesn’t collapse; the navigation collapses into a drop-down menu instead.

(Sam Saffron) #3

@udan11 can you add this to your list?

(Dan Ungureanu) #4

We’ve been mapping the title attribute to aria-label and it looks like macOS’s VoiceOver ignores it.

What I’ve done is to map the label attribute (which is the visible text) to the aria-label attribute. A quick search shows up that 268 d-buttons have labels and only 69 have a titles, so other parts of the interface will also be improved. :blush:

(Dan Ungureanu) closed #5