NVDA not reading aria-label on div

Question

I have a div element with role="listitem". It contains multiple divs with some text inside. When he outer div is focused, I want a custom aria-label to be read instead of the inner texts. Here is my sample code:

<div role="listitem" aria-label="Hello World" tab-index="0">
  <div> A </div>  <div> b </div>  <div> c </div>  <div> d </div>
</div>

On JAWS and Narrator, it works as expected. On NVDA, it's reading the inner text.

On changing outer div to anchor tag, NVDA is reading correct aria-label, but I cannot do that in prod code.

slugolicious slugolicious · Accepted Answer · 2018-05-02T16:34:32

NVDA seems to honor the aria-label for some roles but not others. It works for button and menuitem, it reads both the aria-label and the nested <div>s for checkbox, and ignores aria-label for listitem, as you mentioned.

This seems to be a current bug. See https://github.com/nvaccess/nvda/issues/7807

NVDA not reading aria-label on div

1 Answers