ARIA Alert role
Jump to navigation
Jump to search
The toggle button adds and removes the role="alert"
from the dynamically added text.
Results
JAWS 2018 IE 11 | JAWS 2018 FF 61 | NVDA 2018.2.1 FF 61 | VoiceOver Safari iOS 11.4.1 | Talkback 4.5.1 FF 47 | Talkback 6.2.0 Chrome | JAWS 2018 google Chrome | NVDA 2018.2.1 Google chrome |
---|---|---|---|---|---|---|---|
When the Show e-mail hint link is activated the alert text This is a hint is announced as expected. | When the Show e-mail hint link is activated the alert text This is a hint is announced as expected. | When the Show e-mail hint link is activated the alert text This is a hint is announced as expected. | When the Show e-mail Hint link is activated the Alert is not announced automatically. It is possible to swipe to the text this is a hint. The Role of Alert is announced when swiping to the alert. | When the Show e-mail Hint link is activated the Alert is not announced automatically. It is possible to swipe to the text this is a hint. The Role of Alert is announced twice. | When the Show e-mail Hint link is activated the Alert is announced automatically. the text this is a hint is announced twice. The focus is shifted to the top of the page when the link is activated. This does not occur when the Alert button is used. | When the Show e-mail hint link is activated the alert text This is a hint is announced as expected. The Role of alert is announced as expected. | When the Show e-mail hint link is activated the alert text This is a hint is announced as expected. The Role of alert is not announced. |
Note: the link has been coded to trigger an alert in all browsers. The button also works now. The element with role=alert needs to be present in the DOM before a technique like element.innerHTML is used to write the content to be announced to it, otherwise the live region may not work reliably.