Explore aria live region solutions

The current implementation of the aria-live region works pretty well, but we are starting to hit some edge cases. Specifically when we are attempting to announce a message that has previously been on the DOM.

Example being (once my other PR is merged) if I attempt to select a disabled option, it announces ‘option ${value} is disabled. Select another option.’ which is correct. If I then focus on another option I get another appropriate message, but when navigating back to attempt to select the disabled option again, voice over does not announce the message again because it has not changed.

Options include appending <p> elements within the A11yText component instead of changing the paragraph content, or alternating live regions. Essentially both tricks in order to make sure the VoiceOver recognizes a change.

There was a library (not sure which) that took care of the more elaborate switching solution, but was decided against because it didn’t support all of our use cases. Maybe it’s time to revisit it and maybe fork it? Let’s discuss 😃

[seancurtis]

We built it originally using the aria attributes, but it falls over once you start trying to support multiple selections. The browser/AT support was also pretty atrocious when we tested that. There are slight changes in the 1.1 version of the spec, but those didn’t support all the use cases either.

Other features such as async loading of items (conveying something like “20 options added”) are impossible as well.

The same case happens for drag and drop, there is native support and aria roles, but they’re too minimal and support is bad, hence live regions.

[ebonow]

Greetings,

In an effort to close old issues, we will be closing this issue. If you feel this is still relevant, then let us know and we can kindly re-open this.