OLD | NEW |
| (Empty) |
1 <!DOCTYPE html> | |
2 <html> | |
3 <head> | |
4 <script src="../../../resources/testharness.js"></script> | |
5 <script src="../../../resources/testharnessreport.js"></script> | |
6 </head> | |
7 <body id="body" tabindex="1"> | |
8 <button id="focusable">Outside of inert container</button> | |
9 <button inert id="inert">Inert button</button> | |
10 <div inert id="container"> | |
11 <input id="text" type="text"> | |
12 <input id="datetime" type="datetime"> | |
13 <input id="color" type="color"> | |
14 <select id="select"> | |
15 <optgroup id="optgroup"> | |
16 <option id="option">Option</option> | |
17 </optgroup> | |
18 </select> | |
19 <div id="contenteditable-div" contenteditable>I'm editable</div> | |
20 <span id="tabindex-span" tabindex="0">I'm tabindexed.</div> | |
21 <embed id="embed" type="application/x-blink-test-plugin" width=100 height=10
0></embed> | |
22 <a id="anchor" href="">Link</a> | |
23 </div> | |
24 <script> | |
25 function testFocus(element, expectFocus) { | |
26 focusedElement = null; | |
27 element.addEventListener('focus', function() { focusedElement = element; },
false); | |
28 element.focus(); | |
29 theElement = element; | |
30 assert_equals(focusedElement === theElement, expectFocus); | |
31 } | |
32 | |
33 function testTree(element, expectFocus, excludeCurrent) { | |
34 if (element.nodeType == Node.ELEMENT_NODE && !excludeCurrent) | |
35 testFocus(element, expectFocus); | |
36 if (element.tagName === "SELECT") | |
37 return; | |
38 var childNodes = element.childNodes; | |
39 for (var i = 0; i < childNodes.length; i++) | |
40 testTree(childNodes[i], expectFocus); | |
41 } | |
42 | |
43 | |
44 test(function() { | |
45 testFocus(document.getElementById('focusable'), true); | |
46 }, "Button outside of inert container is focusable."); | |
47 | |
48 test(function() { | |
49 testFocus(document.getElementById('inert'), false); | |
50 }, "Button with inert atribute is unfocusable."); | |
51 | |
52 test(function() { | |
53 testTree(document.getElementById('container'), false); | |
54 }, "All focusable elements inside inert subtree are unfocusable"); | |
55 | |
56 test(function() { | |
57 assert_false(document.getElementById("focusable").inert, "Inert not set expl
icitly is false") | |
58 assert_true(document.getElementById("inert").inert, "Inert set explicitly is
true"); | |
59 assert_true(document.getElementById("container").inert, "Inert set on contai
ner is true"); | |
60 }, "Can get inert via property"); | |
61 | |
62 test(function() { | |
63 assert_false(document.getElementById("text").inert, "Elements inside of iner
t subtrees return false when getting inert"); | |
64 }, "Elements inside of inert subtrees return false when getting 'inert'"); | |
65 | |
66 test(function() { | |
67 document.getElementById('focusable').inert = true; | |
68 testFocus(document.getElementById('focusable'), false); | |
69 document.getElementById('inert').inert = false; | |
70 testFocus(document.getElementById('inert'), true); | |
71 document.getElementById('container').inert = false; | |
72 testTree(document.getElementById('container'), true, true); | |
73 }, "Setting inert via property correctly modifies inert state"); | |
74 </script> | |
75 </body> | |
76 </html> | |
OLD | NEW |