1 files changed, 117 insertions, 0 deletions
diff --git a/accessible/tests/mochitest/events/test_statechange.xhtml b/accessible/tests/mochitest/events/test_statechange.xhtml
new file mode 100644
index 0000000000..4d63c664f1
--- /dev/null
+++ b/accessible/tests/mochitest/events/test_statechange.xhtml
@@ -0,0 +1,117 @@
+<?xml version="1.0"?>
+<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
+<?xml-stylesheet href="chrome://mochikit/content/tests/SimpleTest/test.css"
+                 type="text/css"?>
+
+<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
+        title="XUL state change event tests">
+
+  <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js" />
+  <script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"/>
+
+  <script type="application/javascript"
+          src="../common.js" />
+  <script type="application/javascript"
+          src="../role.js" />
+  <script type="application/javascript"
+          src="../states.js" />
+  <script type="application/javascript"
+          src="../promisified-events.js" />
+
+  <script type="application/javascript">
+  <![CDATA[
+    function offscreenChangeEvent(acc, enabled) {
+      return [
+        EVENT_STATE_CHANGE,
+        event => {
+          const scEvent = event.QueryInterface(nsIAccessibleStateChangeEvent);
+          return event.accessible == acc &&
+            scEvent.state == STATE_OFFSCREEN &&
+            scEvent.isEnabled == enabled;
+        }
+      ];
+    }
+
+    async function testTabpanels() {
+      const tabs = getNode("tabs");
+      is(tabs.selectedIndex, 0, "tab1 initially selected");
+      const panel1 = getAccessible("panel1");
+      testStates(panel1, 0, 0, STATE_OFFSCREEN);
+      const panel2 = getAccessible("panel2");
+      testStates(panel2, STATE_OFFSCREEN);
+      const panel3 = getAccessible("panel3");
+      testStates(panel3, STATE_OFFSCREEN);
+
+      let events = waitForEvents([
+        offscreenChangeEvent(panel1, true),
+        offscreenChangeEvent(panel2, false)
+      ]);
+      info("Selecting tab2");
+      tabs.selectedIndex = 1;
+      await events;
+
+      events = waitForEvents([
+        offscreenChangeEvent(panel2, true),
+        offscreenChangeEvent(panel3, false)
+      ]);
+      info("Selecting tab3");
+      tabs.selectedIndex = 2;
+      await events;
+
+      events = waitForEvents([
+        offscreenChangeEvent(panel3, true),
+        offscreenChangeEvent(panel1, false)
+      ]);
+      info("Selecting tab1");
+      tabs.selectedIndex = 0;
+      await events;
+    }
+
+    async function testPressed() {
+      const toolbarbuttonCheckbox = getNode("toolbarbuttonCheckbox");
+      testStates(toolbarbuttonCheckbox, 0, 0, STATE_PRESSED);
+      info("Checking toolbarbuttonCheckbox");
+      let changed = waitForStateChange(toolbarbuttonCheckbox, STATE_PRESSED, true);
+      toolbarbuttonCheckbox.setAttribute("checked", true);
+      await changed;
+      info("Unchecking toolbarbuttonCheckbox");
+      changed = waitForStateChange(toolbarbuttonCheckbox, STATE_PRESSED, false);
+      toolbarbuttonCheckbox.removeAttribute("checked");
+      await changed;
+    }
+
+    async function doTests() {
+      await testTabpanels();
+      await testPressed();
+      SimpleTest.finish();
+    }
+
+    SimpleTest.waitForExplicitFinish();
+    addA11yLoadEvent(doTests);
+  ]]>
+  </script>
+
+  <hbox flex="1" style="overflow: auto;">
+    <body xmlns="http://www.w3.org/1999/xhtml">
+      <p id="display"></p>
+      <div id="content" style="display: none"></div>
+      <pre id="test">
+      </pre>
+    </body>
+
+    <tabbox id="tabbox" selectedIndex="0">
+      <tabs id="tabs">
+        <tab id="tab1" label="tab1"/>
+        <tab id="tab2" label="tab2"/>
+        <tab id="tab3" label="tab3"/>
+      </tabs>
+      <tabpanels>
+        <hbox id="panel1"><button label="b1"/></hbox>
+        <hbox id="panel2"><button label="b2"/></hbox>
+        <hbox id="panel3"><button label="b3"/></hbox>
+      </tabpanels>
+    </tabbox>
+
+    <toolbarbutton id="toolbarbuttonCheckbox" type="checkbox">toolbarbuttonCheckbox</toolbarbutton>
+  </hbox>
+</window>