1 files changed, 138 insertions, 0 deletions
diff --git a/accessible/tests/mochitest/treeupdate/test_inert.html b/accessible/tests/mochitest/treeupdate/test_inert.html
new file mode 100644
index 0000000000..0364f6612b
--- /dev/null
+++ b/accessible/tests/mochitest/treeupdate/test_inert.html
@@ -0,0 +1,138 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+  <title>Inert tree update test</title>
+
+  <link rel="stylesheet" type="text/css"
+        href="chrome://mochikit/content/tests/SimpleTest/test.css" />
+
+  <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+  <script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script>
+
+  <script src="../common.js"></script>
+  <script src="../promisified-events.js"></script>
+  <script src="../role.js"></script>
+
+  <script>
+    async function doTest() {
+      if (SpecialPowers.getBoolPref("html5.inert.enabled")) {
+        const inertContainer = getAccessible("inertContainer");
+        const inertTree = { SECTION: [ // inertContainer
+          { PARAGRAPH: [{ TEXT_LEAF: [] }] }, // before
+          { PARAGRAPH: [{ TEXT_LEAF: [] }] }, // after
+        ]};
+        testAccessibleTree(inertContainer, inertTree);
+
+        info("Unsetting inert");
+        let reordered = waitForEvent(EVENT_REORDER, inertContainer);
+        const inertNode = getNode("inert");
+        inertNode.inert = false;
+        await reordered;
+        testAccessibleTree(inertContainer, { SECTION: [ // inertContainer
+          { PARAGRAPH: [{ TEXT_LEAF: [] }] }, // before
+          { SECTION: [ // inert
+            { TEXT_LEAF: [] },
+            { PUSHBUTTON: [] },
+          ] },
+          { PARAGRAPH: [{ TEXT_LEAF: [] }] }, // after
+        ]});
+
+        info("Setting inert");
+        reordered = waitForEvent(EVENT_REORDER, inertContainer);
+        inertNode.inert = true;
+        await reordered;
+        testAccessibleTree(inertContainer, inertTree);
+      } else {
+        // It's too late to flip the pref now. We'd need to load a new document
+        // to pick up the change.
+        todo(false, "Inert not enabled, skipping inert tests");
+      }
+
+      const noDialogTree = { SECTION: [ // dialogContainer
+        { TEXT_LEAF: [] }
+      ] };
+      testAccessibleTree("dialogContainer", noDialogTree);
+
+      info("Showing modal dialog");
+      let reordered = waitForEvent(EVENT_REORDER, document);
+      const dialogNode = getNode("dialog");
+      dialogNode.showModal();
+      await reordered;
+      // The dialog makes everything else in the document inert.
+      testAccessibleTree(document, { DOCUMENT: [
+        { DIALOG: [
+          { PUSHBUTTON: [] }
+        ] }
+      ] });
+
+      info("Closing dialog");
+      reordered = waitForEvent(EVENT_REORDER, document);
+      dialogNode.close();
+      await reordered;
+      testAccessibleTree("dialogContainer", noDialogTree);
+
+      const fullscreenTree = { SECTION: [ // fullscreen
+        { PUSHBUTTON: [] }
+      ] };
+      const notFullscreenTree = { SECTION: [ // fullscreenContainer
+        { SECTION: [
+          { PUSHBUTTON: [] } // requestFullscreen
+        ] },
+        fullscreenTree,
+      ] };
+      testAccessibleTree("fullscreenContainer", notFullscreenTree);
+
+      info("Requesting fullscreen");
+      reordered = waitForEvent(EVENT_REORDER, document);
+      // Fullscreen must be requested by a user input event.
+      synthesizeMouseAtCenter(getNode("requestFullscreen"), {});
+      await reordered;
+      // Fullscreen makes everything else in the document inert.
+      testAccessibleTree(document, { DOCUMENT: [
+        fullscreenTree
+      ] });
+
+      info("Exiting fullscreen");
+      reordered = waitForEvent(EVENT_REORDER, document);
+      document.exitFullscreen();
+      await reordered;
+      testAccessibleTree("fullscreenContainer", notFullscreenTree);
+
+      SimpleTest.finish();
+    }
+
+    SimpleTest.waitForExplicitFinish();
+    addA11yLoadEvent(doTest);
+  </script>
+</head>
+<body>
+
+  <p id="display"></p>
+  <div id="content" style="display: none"></div>
+  <pre id="test">
+  </pre>
+
+  <div id="inertContainer">
+    <p>before</p>
+    <div id="inert" inert>inert <button></button></div>
+    <p>after</p>
+  </div>
+
+  <div id="dialogContainer">
+    dialogContainer
+    <dialog id="dialog"><button></button></dialog>
+  </div>
+
+  <div id="fullscreenContainer">
+    <div>
+      <button id="requestFullscreen"
+          onclick="document.getElementById('fullscreen').requestFullscreen();">
+      </button>
+    </div>
+    <div id="fullscreen"><button></button></div>
+  </div>
+
+  <div id="eventdump"></div>
+</body>
+</html>