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

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.”

7개의 좋아요

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.

3개의 좋아요

@dan can you add this to your list?

5개의 좋아요

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:

https://github.com/discourse/discourse/commit/31ffcf989ce63e451baaed7deb61bf3e3126f197

8개의 좋아요