Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Accessibility: toasts are "double-announced" in Chrome/NVDA #957

Open
patrickhlauke opened this issue Oct 26, 2022 · 3 comments
Open

Accessibility: toasts are "double-announced" in Chrome/NVDA #957

patrickhlauke opened this issue Oct 26, 2022 · 3 comments

Comments

@patrickhlauke
Copy link
Contributor

patrickhlauke commented Oct 26, 2022

A follow-up to #934 - there may have been a recent change in timings on how the toasts are now created, or something may have changed in the timing of how Chrome/Windows exposes these, but currently when testing https://ngx-toastr.vercel.app/ in Chrome/NVDA, most toasts are "double-announced" (once because of the aria-live="polite" on the toast container, and then again because of the role="alert" in the actual toast).

This does not happen in Firefox/NVDA, which makes me suspect it's possibly some change in Chrome specifically.

Video recording using Chrome/NVDA

toast-double-announcements.mp4

I'm pressed for time at the moment, but over the weekend I can file a follow-up to #934 that further tweaks the output, removing the role="alert" itself, leaving the announcement purely down to the aria-live="polite".

Question though: I assume that if an author does NOT create their custom toast container per https://github.com/scttcper/ngx-toastr#put-toasts-in-your-own-container, that this script generates its own, and that THAT also includes aria-live="polite" ? src/lib/overlay/overlay-container.ts makes me think that's the case, but just to be sure...

@patrickhlauke patrickhlauke changed the title Accessibility: toasts are "double-announced" Accessibility: toasts are "double-announced" in Chrome/NVDA Oct 26, 2022
@patrickhlauke
Copy link
Contributor Author

incidentally, I found some further flakyness (described in bitwarden/clients#3487 (comment)) caused by the overlay-container being generated dynamically the first time around. this may result, depending on specific browser/timings, with it not being registered/seen in time as a live region container and primed to then announce toasts that are injected. I'll see if i can get to some more definitive solution here ... it may need a slight explicit pause of a few milliseconds between the container being generated and the first toast being injected. or, alternatively, generating the overlay-container directly on page load, way before the first toast needs to actually use it.

@scttcper
Copy link
Owner

maybe we could expose a way for you to create the container manually when you want it

@lamhuynhorient
Copy link

I also got this issue. Chrome + NVDA, toasts are "double-announced". It is because role alert on toast message. How can we fix this issue?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants