search

rstacruz / nprogress

For slim progress bars like on YouTube, Medium, etc
http://ricostacruz.com/nprogress
MIT License
26.08k stars 1.81k forks source link

Uses invalid ARIA roles #232

Open aardrian opened 3 years ago

aardrian commented 3 years ago

The animated line has this construct:

<div class="bar" role="bar" style="[…]">[…]</div>

The spinner has this construct:

<div class="spinner" role="spinner">[…]</div>

There is no ARIA role bar and no role spinner. An automated accessibility checker would have picked this up. You can see a full list of roles at the ARIA 1.1 spec. As it stands now, this constitutes a WCAG failure.

I suggest rebuilding this to expose correct roles, states, and properties so the browser accessibility APIs can convey the progress bar to assistive technology users.

aardrian commented 3 years ago

I performed a poor search. I see this is a duplicate of this 2017 issue: Invalid ARIA roles #180

It looks like this has been forked and made accessible (per the claim; did not test): https://github.com/nmackey/accessible-nprogress