Dialogs and Screen Readers

Skip to first unread message

Rich Caloggero

Sep 28, 2010, 3:00:18 PM9/28/10
to jquer...@googlegroups.com

I've seen jQuery-ui use increasing drammatically in the web apps I'm testing
for accessibility. This is excellent, since much of the hard work with
respect to accessibility has been done, and done well!

One of the sticking points, however, has been the dialog widget. Tagging
containers with either a role of dialog or alertdialog is supposed to cause
screen readers to alert the user when the dialog appears, and alertdialog
should additionally cause the screen reader to read the dialog text.
In recent versions of Jaws (i.e. 12 public beta) we now get consistent
behavior with respect to the announcement of existance of the dialog, but
neither jaws nor nvda will read dialog text when alertdialog is used. In a
few random cases I've goten this to work, but it is not reproducible.

I believe there is some sort of timing issues here. For instance, if I
simply append a div to the dom which is tagged with aria-live="assertive",
and then immediately write some text into it, the screen reader will never
announce this newly written text. I believe this is because the live region
markup has not yet been processed by the browser and screen reader before
the new tet is written into the div. I believe it is this issue that is
causing screen readers to skip reading of dialog text when the dialog is

I eleviate this situation by:
1. taggging the content I supply to dialog() as a live region;
2. in the callback for the dialogopen event, rewrite any content you wish to
have spoken when the dialog opens

See the example at the above URL.
Comments please...
-- Rich

David Bolter

Oct 8, 2010, 9:33:16 AM10/8/10
to jQuery Accessibility
Hi Rich,

As a data point, what happens if you introduce a delay between
appending an aria-live div to the DOM, and adding text to it?


Rich Caloggero

Oct 8, 2010, 11:09:12 AM10/8/10
to jquer...@googlegroups.com
>As a data point, what happens if you introduce a delay between
>appending an aria-live div to the DOM, and adding text to it?

It works fine when I do this. Placing code in the dialogopen callback
introduces such a delay.
There are other situations however where one wishes to use liveregions, but
there are no handy event callbacks to tell you when things have settled
enough to depend on liveregions, so then your just left introducing some
random delay and hoping it works robustly.

Hi Rich,


You received this message because you are subscribed to the Google Groups
"jQuery Accessibility" group.
To post to this group, send email to jquer...@googlegroups.com.
To unsubscribe from this group, send email to
For more options, visit this group at

David Bolter

Oct 8, 2010, 11:20:13 AM10/8/10
to jQuery Accessibility
Thanks for confirming that Rich. We are improving this situation from
the browser side in FF4 but in the meantime I fear we are stuck with
advising web devs use such a delay.

Reply all
Reply to author
0 new messages