Updating information on a page without a page refresh can be confusing to some users of AT (assistive technology), the user may have no idea that information has been updated.

ARIA (accessible rich internet applications, a W3C draft recommendation) provides a live region role that communicates these updates through the browser to AT.

On the user profile > edit page password strength and password matching is updated by ajax without a page refresh.

Recommendation
Add ARIA live region roles to the containers for the password strength and matching information. This is found in modules/user/user.js

Resources
WAI-ARIA Overview - http://www.w3.org/WAI/intro/aria.php

Set of ARIA Test Cases - CodeTalks (Live Regions) - http://wiki.codetalks.org/wiki/index.php/Set_of_ARIA_Test_Cases#aria-live

Web Accessibility Initiative (WAI) home page - http://www.w3.org/WAI/

CommentFileSizeAuthor
#15 issue-521904-aria-password-match.patch1.08 KBEverett Zufelt
#3 password_aria_1.patch1.06 KBmgifford
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

Everett Zufelt’s picture

Everett Zufelt CreditAttribution: Everett Zufelt commented
Status: Active » Postponed

Setting to postponed until #331893: Add colouring (and description) to password checker gets committed to head.

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented
Status: Postponed » Needs work

This is now committed to head - http://drupal.org/node/331893#comment-2065466

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented
Status: Needs work » Needs review
FileSize
password_aria_1.patch1.06 KB

Is this essentially a matter of adding in the aria attribute 'aria-live="polite"' in the right place?

If so I think that this is the patch. Needs to be tested with AT though.

Status: Needs review » Needs work

The last submitted patch failed testing.

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented
Status: Needs work » Needs review

testing if the bot was bust

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented

I ran the CSS Unit Tests locally after applying the patches without problem.

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented

Same problem as here - http://drupal.org/node/515262

Maybe the simpletest doesn't like ARIA

mgifford requested that failed test be re-tested.

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented

I've got this code up on our sandbox here - http://drupal7.dev.openconcept.ca

It essentially adds aria-live="polite" to the jQuery password validator:

<div id="password-strength-text" aria-live="polite">Fair</div>
<div class="password-strength-title">Password strength:</div>

This seems like it's a no-brainer to get into core, but we need some more reviews.

bowersox’s picture

bowersox CreditAttribution: bowersox commented

+1 for this fix. The code is clean and the tests have been passing for a while (I'll do another re-test to confirm again).

However, I haven't tested this in a screenreader to confirm that it works, so I agree that we should get some further review.

Re-test of password_aria_1.patch from comment #3 was requested by mgifford.

pratikp1’s picture

pratikp1 CreditAttribution: pratikp1 commented
Status: Needs review » Reviewed & tested by the community

Tested with JAWS and NVDA. The ARIA live region implementation now allows screen readers to announce password strength as screen update occurs.

Dries’s picture

Dries CreditAttribution: Dries commented
Status: Reviewed & tested by the community » Fixed

Committed to CVS HEAD. Thanks.

Everett Zufelt’s picture

Everett Zufelt CreditAttribution: Everett Zufelt commented
Status: Fixed » Needs work

Glad to see this in core. I think that this live region should be set to assertive instead of polite. Any thoughts?

See: http://www.w3.org/TR/wai-aria/states_and_properties#aria-live

Everett Zufelt’s picture

Everett Zufelt CreditAttribution: Everett Zufelt commented
Status: Needs work » Needs review
FileSize
issue-521904-aria-password-match.patch1.08 KB

Small little patch to correct the aria-live attribute from "polite" to "assertive". The "assertive" attribute is recommended by ARIA 1.0 for situations like same-time form field validation. See linked reference in #14 above.

pratikp1’s picture

pratikp1 CreditAttribution: pratikp1 commented
Status: Needs review » Reviewed & tested by the community

Agreed. Depending on Screen reader settings, polite is not going to be sufficient to alert the user unless he/she knows that the password strength changes. Polite provides a passive alert. In this case, assertive is appropriate. I have tested the patch on a dev sandbox and prefer the assertive behavior over polite—especially considering the needs of novice users.

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented

Thanks for catching this Everett! I've been looking for example cases and not finding any. It makes sense that an alert would be sent immediately to a user when the password is properly entered and that the AT device not politely wait until the next convenient opportunity to convey this to the user.

Everett Zufelt’s picture

Everett Zufelt CreditAttribution: Everett Zufelt commented
Status: Reviewed & tested by the community » Needs review

Setting back to needs review so patch can be tested by bots.

mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford commented
Status: Needs review » Reviewed & tested by the community

Ya, the bot's back! Great to see this get corrected.

Dries’s picture

Dries CreditAttribution: Dries commented
Status: Reviewed & tested by the community » Fixed

Committed. Thanks.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

Liam Morland’s picture

Liam Morland
Primary language English
Location Ontario, CA 🇨🇦
CreditAttribution: Liam Morland commented
mgifford’s picture

mgifford
he/him
Primary language English
CreditAttribution: mgifford at OpenConcept Consulting Inc. commented
Issue summary: View changes
Issue tags: +aria-live