WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Additions to list not read in live region

for

From: James Nurthen
Date: Feb 18, 2016 5:00PM

This sounds very similar to a bug we currently have open with Freedom
Scientific. This used to work fine (JAWS 16) but broke sometime in the JAWS
17 release.

On Thu, Feb 18, 2016 at 1:49 PM, Robert Fentress < <EMAIL REMOVED> > wrote:

> Hello, all.
>
> Just wanted to let folks know of a quirk I discovered in how live regions
> are handled, in case anybody else goes searching on the list archives for a
> solution.
>
> If you have created an unordered list in your page using standard HTML
> markup, and have made that list a live region, then JAWS with Firefox will
> not voice any items added to that list, if aria-atomic is false. It
> doesn't matter what you set aria-relevant to. Here is a simplified
> example:
>
> <ul aria-live="polite" aria-atomic="false" aria-relevant="additions">
>
> <li>item 1</li>
> <li>item 2</li>
>
> </ul>
>
> Then, if you try to add the following to the list, nothing is voiced:
> <li>item 3</li>
>
> This is not an issue with anything else I've tested it on, only
> JAWS/Firefox.
>
> The best solution I've come up with so far, if you want to preserve the
> list semantics, is to change the <ul> and <li> tags to divs, and set their
> respective roles with aria to list and listitem. So that would be:
>
> <div aria-live="polite" aria-atomic="false" aria-relevant="additions"
> role="list">
>
> <div role="listitem">item 1</div>
> <div role="listitem">item 2</div>
>
> </div>
>
> This seems to work, but is not ideal.
>
> If anyone has a better idea or knows what I'm doing wrong, let me know.
> Either way, I thought I'd contribute to the body of knowledge, either
> through example or non-example, as the case may be.
>
> Here are a couple of codepens for the non-example and example
>
>
> - Non-example using <ul> and <li> broken in JAWS/FF
> http://codepen.io/robfentress/pen/ZQNpjJ
>
> - Example using aria
> http://codepen.io/robfentress/pen/YwbGjg
>
>
>
>
> Best,
> Rob
>
> --
> Robert Fentress
> Senior Accessibility Solutions Designer
> 540.231.1255
>
> Technology-enhanced Learning & Online Strategies
> Assistive Technologies
> 1180 Torgersen Hall
> 620 Drillfield Drive (0434)
> Blacksburg, Virginia 24061
> > > > >