| Index: third_party/WebKit/LayoutTests/fast/dom/inert/inert-node-is-unfocusable.html
|
| diff --git a/third_party/WebKit/LayoutTests/fast/dom/inert/inert-node-is-unfocusable.html b/third_party/WebKit/LayoutTests/fast/dom/inert/inert-node-is-unfocusable.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..721d49b7a0b93b007ee4d9dc980335f9829b7cc1
|
| --- /dev/null
|
| +++ b/third_party/WebKit/LayoutTests/fast/dom/inert/inert-node-is-unfocusable.html
|
| @@ -0,0 +1,76 @@
|
| +<!DOCTYPE html>
|
| +<html>
|
| +<head>
|
| +<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>
|
|
|
Chromium Code Reviews
Issue 2088453002:
Implement the inert attribute (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master