132 lines
3.8 KiB
HTML
132 lines
3.8 KiB
HTML
<!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() {
|
|
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);
|
|
|
|
const noDialogTree = { SECTION: [ // dialogContainer
|
|
{ TEXT_LEAF: [] }
|
|
] };
|
|
testAccessibleTree("dialogContainer", noDialogTree);
|
|
|
|
info("Showing modal dialog");
|
|
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>
|