📝♿️ Progress a11y

[oddvernes]

resolves #2020

I added an invisible output element to linear and circular determinate progress so screenreaders should read out new values if it is inside a container with aria-live (I could not get it to read out aria-valuenow, I think maybe the element needs to be made focusable and be in focus for that to work). The output value is limited to 25/50/75/100% to limit readouts (its possible setting aria-live to assertive instead of polite also helps with this, its hard to tell with this behaving different in different browsers)

The other issues about aria-describedby/aria-label is already supported by ...rest going to the element with role="progressbar" so I added stories to storybook showing this

[mimarz]

When testing the accessibility story for linear and circular the voice over is stuck on "loading 0%" 🤔

[oddvernes]

When testing the accessibility story for linear and circular the voice over is stuck on "loading 0%" 🤔

Well first of all I am going to rebase on develop, stand by

[oddvernes]

Hmm it looks like the mac voiceover reads out a bunch of stuff that is not read on windows. It is not supposed to read loading percentages for indeterminate loader. I need to investigate more on mac. The determinate loader demos on circular and linear works as it is supposed

[oddvernes]

Fixed mac issue by not including output element for indeterminate

[mimarz]

VoiceOver on Mac does not seem to read out loading states for linear and star accessibility stories... 🤔

[oddvernes]

It was due to aria-busy. I removed it and made aria-live assertive as well so the loading readout interrupts the long winded readout of the button context

[mimarz]

Works now! ♿👍