ARIA Live Regions and `role="alert"` not working on Mac

2
votes

I am trying to get an error alert scenario working properly with assistive technology. There are two approaches i like which I am testing:

Using ARIA Live Regions

http://pauljadam.com/demos/aria-alert-validation.html

Using ARIA Alert

http://test.cita.illinois.edu/aria/alert/alert1.php

Both of this test pages work fine on Jaws 14 and VDA on PC in that the error is read outloud. However, using a Mac with voice over it does not read the errors in those examples out load.

To reproduce:

Is there some non-default setting I need to be away of? Or is there a better way to do this? I'm a little surprised all theses examples do not work.

1
accessibilityvoiceoverwai-aria
It works for me in OSX 10.9 (Mavericks), perhaps live regions weren't supported before. – AlastairC
Any ideas of a setting it could be for that? I am also on OSX 10.9 and it doesnt read the alert or live.... – Tim
I haven't changed the settings, I'm on the default. Just tried the alert1 page in 10.7 as well, works fine. – AlastairC

1 Answers

1
votes

Here is solution by Steve Faulkner from Paciello Group Blog that supports Safari on Mac:

function addError() {
    var elem1 = document.getElementById("add1");

    document.getElementById('add1').setAttribute("role", "alert");

    document.getElementById('display2').style.clip = 'auto';
    alertText = document.createTextNode("alert via createTextnode()");
    elem1.appendChild(alertText);
    elem1.style.display = 'none';
    elem1.style.display = 'inline';
}
<div id="display2" role="alert"><span id="add1"></span></div>
<input type="submit" value="Method 4 alert - display" onClick="addError()">