<html> <head> <title>ARIA state change event testing</title> <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css" /> <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> <script type="application/javascript" src="../common.js"></script> <script type="application/javascript" src="../role.js"></script> <script type="application/javascript" src="../states.js"></script> <script type="application/javascript" src="../events.js"></script> <script type="application/javascript"> /** * Do tests. */ var gQueue = null; //gA11yEventDumpID = "eventdump"; // debugging //gA11yEventDumpToConsole = true; // debugging function expandNode(aID, aIsExpanded) { this.DOMNode = getNode(aID); this.eventSeq = [ new expandedStateChecker(aIsExpanded, this.DOMNode) ]; this.invoke = function expandNode_invoke() { this.DOMNode.setAttribute("aria-expanded", (aIsExpanded ? "true" : "false")); }; this.getID = function expandNode_getID() { return prettyName(aID) + " aria-expanded changed to '" + aIsExpanded + "'"; }; } function busyify(aID, aIsBusy) { this.DOMNode = getNode(aID); this.eventSeq = [ new stateChangeChecker(STATE_BUSY, kOrdinalState, aIsBusy, this.DOMNode) ]; this.invoke = function busyify_invoke() { this.DOMNode.setAttribute("aria-busy", (aIsBusy ? "true" : "false")); }; this.getID = function busyify_getID() { return prettyName(aID) + " aria-busy changed to '" + aIsBusy + "'"; }; } function setAttrOfMixedType(aID, aAttr, aState, aValue) { this.DOMNode = getNode(aID); this.eventSeq = [ new stateChangeChecker(aState, kOrdinalState, aValue == "true", this.DOMNode) ]; if (hasState(aID, STATE_MIXED) || aValue == "mixed") { this.eventSeq.push( new stateChangeChecker(STATE_MIXED, kOrdinalState, aValue == "mixed", this.DOMNode) ); } this.invoke = function setAttrOfMixedType_invoke() { this.DOMNode.setAttribute(aAttr, aValue); }; this.getID = function setAttrOfMixedType_getID() { return prettyName(aID) + " " + aAttr + " changed to '" + aValue + "'"; }; } function setPressed(aID, aValue) { this.__proto__ = new setAttrOfMixedType(aID, "aria-pressed", STATE_PRESSED, aValue); } function setChecked(aID, aValue) { this.__proto__ = new setAttrOfMixedType(aID, "aria-checked", STATE_CHECKED, aValue); } function buildQueueForAttr(aList, aQueue, aID, aInvokerFunc) { for (var i = 0; i < aList.length; i++) { for (var j = i + 1; j < aList.length; j++) { // XXX: changes from/to "undefined"/"" shouldn't fire state change // events, bug 472142. aQueue.push(new aInvokerFunc(aID, aList[i])); aQueue.push(new aInvokerFunc(aID, aList[j])); } } } function buildQueueForAttrOfMixedType(aQueue, aID, aInvokerFunc) { var list = [ "", "undefined", "false", "true", "mixed" ]; buildQueueForAttr(list, aQueue, aID, aInvokerFunc); } function buildQueueForAttrOfBoolType(aQueue, aID, aInvokerFunc) { var list = [ "", "undefined", "false", "true" ]; buildQueueForAttr(list, aQueue, aID, aInvokerFunc); } function doTests() { gQueue = new eventQueue(); gQueue.push(new expandNode("section", true)); gQueue.push(new expandNode("section", false)); gQueue.push(new expandNode("div", true)); gQueue.push(new expandNode("div", false)); gQueue.push(new busyify("aria_doc", true)); gQueue.push(new busyify("aria_doc", false)); buildQueueForAttrOfMixedType(gQueue, "pressable", setPressed); buildQueueForAttrOfMixedType(gQueue, "pressable_native", setPressed); buildQueueForAttrOfMixedType(gQueue, "checkable", setChecked); buildQueueForAttrOfBoolType(gQueue, "checkableBool", setChecked); gQueue.invoke(); // Will call SimpleTest.finish(); } SimpleTest.waitForExplicitFinish(); addA11yLoadEvent(doTests); </script> </head> <body> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=551684" title="No statechange event for aria-expanded on native HTML elements, is fired on ARIA widgets"> Mozilla Bug 551684 </a><br> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=648133" title="fire state change event for aria-busy"> Mozilla Bug 648133 </a><br> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=467143" title="mixed state change event is fired for focused accessible only"> Mozilla Bug 467143 </a> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=989958" title="Pressed state is not exposed on a button element with aria-pressed attribute"> Mozilla Bug 989958 </a> <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1136563" title="Support ARIA 1.1 switch role"> Mozilla Bug 1136563 </a> <p id="display"></p> <div id="content" style="display: none"></div> <pre id="test"> </pre> <div id="eventdump"></div> <!-- aria-expanded --> <div id="section" role="section" aria-expanded="false">expandable section</div> <div id="div" aria-expanded="false">expandable native div</div> <!-- aria-busy --> <div id="aria_doc" role="document" tabindex="0">A document</div> <!-- aria-pressed --> <div id="pressable" role="button"></div> <button id="pressable_native"></button> <!-- aria-checked --> <div id="checkable" role="checkbox"></div> <div id="checkableBool" role="switch"></div> </body> </html>