I am using Angular, Every timewhen isVisible
in the following code becomes true, the following html code will be rendered on the page .
<div *ngIf="isVisible"> <span aria-live="assertive" aria-atomic="true">Read this new text</span> </div>
Every time I render (which can be removed and added multiple times depending on the behavior), I need JAWS to pronounce the text in the span: Read this new text
.
For this I tried using aria-live="polite" (not pronounced) and even aria-live="assertive" and even aria-live="assertive" and aria-atomic="true" based on this Aria - on chrome issue The live area does not read out updates when an element is deleted.
How to make it work? Using: JAWS, Google Chrome.
Adding or deleting active areas does not work well and you should only manipulate the content of such areas.
assertive
Whether it is the right choice should be considered very carefully. This is quite disruptive to users. Most of the timepolite
is the better choice.– ARIA
on
aria-liveAnother general suggestion is that the information posted also needs to be easily accessible on the user's terms, in case the user misses it or doesn't understand it. The field's error message should be announced via an alert, but should also be bound to the input field so that it is read every time the user focuses on the field.