diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
commit | 26a029d407be480d791972afb5975cf62c9360a6 (patch) | |
tree | f435a8308119effd964b339f76abb83a57c29483 /testing/web-platform/tests/inert/inert-node-is-unfocusable.html | |
parent | Initial commit. (diff) | |
download | firefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz firefox-26a029d407be480d791972afb5975cf62c9360a6.zip |
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/inert/inert-node-is-unfocusable.html')
-rw-r--r-- | testing/web-platform/tests/inert/inert-node-is-unfocusable.html | 79 |
1 files changed, 79 insertions, 0 deletions
diff --git a/testing/web-platform/tests/inert/inert-node-is-unfocusable.html b/testing/web-platform/tests/inert/inert-node-is-unfocusable.html new file mode 100644 index 0000000000..8b5de37fdc --- /dev/null +++ b/testing/web-platform/tests/inert/inert-node-is-unfocusable.html @@ -0,0 +1,79 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <title>inert nodes are unfocusable</title> + <link rel="author" title="Alice Boxhall" href="aboxhall@chromium.org"> + <script src="/resources/testharness.js"></script> + <script src="/resources/testharnessreport.js"></script> + </head> +<body id="body" tabindex="1"> + <button id="focusable">Outside of inert container</button> + <button inert id="inert">Inert button</button> + <div inert id="container"> + <input id="text" type="text"> + <input id="datetime" type="datetime"> + <input id="color" type="color"> + <select id="select"> + <optgroup id="optgroup"> + <option id="option">Option</option> + </optgroup> + </select> + <div id="contenteditable-div" contenteditable>I'm editable</div> + <span id="tabindex-span" tabindex="0">I'm tabindexed.</div> + <embed id="embed" type="application/x-blink-test-plugin" width=100 height=100></embed> + <a id="anchor" href="">Link</a> + </div> +<script> +function testFocus(element, expectFocus) { + focusedElement = null; + element.addEventListener('focus', function() { focusedElement = element; }, false); + element.focus(); + theElement = element; + assert_equals(focusedElement === theElement, expectFocus); +} + +function testTree(element, expectFocus, excludeCurrent) { + if (element.nodeType == Node.ELEMENT_NODE && !excludeCurrent) + testFocus(element, expectFocus); + if (element.tagName === "SELECT") + return; + var childNodes = element.childNodes; + for (var i = 0; i < childNodes.length; i++) + testTree(childNodes[i], expectFocus); +} + + +test(function() { + testFocus(document.getElementById('focusable'), true); +}, "Button outside of inert container is focusable."); + +test(function() { + testFocus(document.getElementById('inert'), false); +}, "Button with inert atribute is unfocusable."); + +test(function() { + testTree(document.getElementById('container'), false); +}, "All focusable elements inside inert subtree are unfocusable"); + +test(function() { + assert_false(document.getElementById("focusable").inert, "Inert not set explicitly is false") + assert_true(document.getElementById("inert").inert, "Inert set explicitly is true"); + assert_true(document.getElementById("container").inert, "Inert set on container is true"); +}, "Can get inert via property"); + +test(function() { + assert_false(document.getElementById("text").inert, "Elements inside of inert subtrees return false when getting inert"); +}, "Elements inside of inert subtrees return false when getting 'inert'"); + +test(function() { + document.getElementById('focusable').inert = true; + testFocus(document.getElementById('focusable'), false); + document.getElementById('inert').inert = false; + testFocus(document.getElementById('inert'), true); + document.getElementById('container').inert = false; + testTree(document.getElementById('container'), true, true); +}, "Setting inert via property correctly modifies inert state"); +</script> +</body> +</html> |