Use dojo.attr for ARIA states and properties

[simonjb]

We could move the functionality of:

• dijit.hasWaiState
• dijit.getWaiState
• dijit.setWaiState
• dijit.removeWaiState

into dojo.attr, using the "aria-" prefix for state and property names. For example dijit.setWaiState(elem, "haspopup", true) would become dojo.attr(elem, "aria-haspopup", true). This change would have the advantage of reducing the API size and implementing the latest ARIA attribute syntax. We will need some FF2 special-case processing but that can be triggered by the "aria-" prefix.

[becky]

We need to this or #4828 but not both.

[becky]

this got support at a recent dojo meeting but it won't make 1.3 unless someone else tackles it

[clown]

Step 1: Modified dojo/_base/html.js to handle the aria state functions, namely get/set/remove/hasWaiState(). For example:

dijit.setWaiState(element, "checked", "true");

becomes:

dojo.attr(element, "aria-checked", "true");

Attaching patches to get feedback as to whether this is a good approach.

Changes to:

• dojo.attr() to get and set aria states.
• dojo.hasAttr() to detect aria states.
• dojo.removeAttr() to remove aria states.
• internal _fixAttrName() in html.js to handle "aria-*" attribute names, specifically takes an optional second boolean parameter indicating if the attribute is an aria name, truncating the "aria-" prefix.
• redefined xWaiState() functions in dijit/_base/wai.js to use the changes in dojo/_base/html.js (for backward compatibility).
• updated unit tests in dijit/tests/_base/wai.html in light of the above.

The two patch files, "5984dojo.patch", and "5984dijit.patch" should be applied to dojo and dijit respectively. The unit tests in dijit's "wai.html" pass in FF2, FF3 (Mac OSX), IE7, and IE6. The dojo unit tests also pass for the same browsers/OSes.

To do:

• similar changes to html.js to handle dijit's get/set/has/removeWaiRole().
• update dijit's xAWaiRole() functions to use dojo.attr(), etc.
• "migrate" dijit wai unit tests to dojo's html unit tests.

[clown]

Use in conjunction with attachment "5984dijit.patch"

[clown]

Use in conjunction with "5984dojo.patch"

[bill]

FYI, if this goes in for 1.4 then I think we can drop the FF2 support. In theory FF2 has already been desupported by mozilla although we agreed to support it in dojo until 1.4.

[davidb]

Replying to bill:

FYI, if this goes in for 1.4 then I think we can drop the FF2 support

+1

[clown]

Attaching "5984a.patch" that does everything the previous patches did, with the additional feature of using dojo.attr() to set/get/remove the "role" attribute. For example, dijit.setWaiRole(node, "menuitem") is replaced by dojo.attr(node, "role", "menuitem"). The latter call will take into account XHTML landmark roles (see #4828), as per the existing dijit.set|get|has|removeWaiRole() functions.

Changes to .../dojo/_base/html.js:

• added private var _xhtmlRoles (regular expression).
• added private _setRole() utility.
• modified dojo.attr() to special case the role attribute.
• added public getAriaRole() utility.
• added public hasAriaRole() utility.
• added public removeAriaRole() utility.
• added unit tests for above to .../dojo/tests/_base/html.html

Changes to .../dijit/_base/wai.js:

• removed private var _XhtmlRoles.
• modifed xWaiRole() functions to use the changes in .../dojo/_base/html.js
• modified unit tests in .../dijit/tests/_base/wai.html in light of above.

Ran unit tests in FF2/FF3/MacOSX and FF2/FF3/IE7/IE8RC1/WinXP.

Note: these changes still special case the way FF2 handles roles. Bill and DavidB have expressed the dropping this support. I await an official decision on this; for now support for FF2 is maintained.

[clown]

Moves handling of aria states and properties, and the role attribute to html.js

[davidb]

Don't hit me, but it would be interesting to see what this patch looks like trimmed down with no FF < 3 sniffing (i.e. no FF2 wai: support).

Would it be more likely to land in core if it was smaller?

[davidmark]

I don't recommend adding any more complexity to the attr (or realAttr) methods. These low-level functions needs to be as simple (and fast) as possible. There is already some extra baggage in there that should be removed for 2.0 (e.g. innerHTML.)

IMO, the current interface is superior to adding custom prefixes to attributes names.

Also, note that - despite the name - attr deals with properties, not attributes. I'm looking into what sort of mapping there is between them (attributes and properties) in ARIA. That will probably lead to a test for ARIA support, which will resolve the FF2 issue.

[clown]

Replying to davidmark:

One quick comment. Using "aria-" is not "...adding a custom prefix to attribute names". According to the current spec, ARIA state and property attributes all begin "aria-". FF2 implemented an earlier draft version of ARIA where xml namespaces were used. Name spaces have since been abandoned.