OLD | NEW |
| (Empty) |
1 <!DOCTYPE html> | |
2 <html> | |
3 <head> | |
4 <script src="../../../resources/js-test.js"></script> | |
5 </head> | |
6 <body id="body" tabindex="1"> | |
7 <dialog id="top-dialog" tabindex="1" style="width: 100px; top: 30px"><button id=
"top-dialog-button">I get focus</button></dialog> | |
8 <dialog id="bottom-dialog" tabindex="-1" style="width: 100px; bottom: 30px"><but
ton id="bottom-dialog-button">I don't get focus.</button></dialog> | |
9 <div id="container"> | |
10 <input id="text" type="text"> | |
11 <input id="datetime" type="datetime"> | |
12 <input id="color" type="color"> | |
13 <select id="select"> | |
14 <optgroup id="optgroup"> | |
15 <option id="option">Option</option> | |
16 </optgroup> | |
17 </select> | |
18 <div id="contenteditable-div" contenteditable>I'm editable</div> | |
19 <span id="tabindex-span" tabindex="0">I'm tabindexed.</div> | |
20 <embed id="embed" type="application/x-blink-test-plugin" width=100 height=10
0></embed> | |
21 <a id="anchor" href="">Link</a> | |
22 </div> | |
23 <script> | |
24 description('Test that inert nodes are not focusable. The test passses if only t
he ' + | |
25 'topmost dialog and its button are focusable.'); | |
26 | |
27 function testFocus(element, expectFocus) { | |
28 focusedElement = null; | |
29 element.addEventListener('focus', function() { focusedElement = element; },
false); | |
30 element.focus(); | |
31 expected = expectFocus ? "true" : "false" | |
32 theElement = element; | |
33 shouldBe('"' + element.id + '"; focusedElement === theElement', expected); | |
34 } | |
35 | |
36 function testTree(element, expectFocus) { | |
37 if (element.nodeType == Node.ELEMENT_NODE) | |
38 testFocus(element, expectFocus); | |
39 var childNodes = element.childNodes; | |
40 for (var i = 0; i < childNodes.length; i++) | |
41 testTree(childNodes[i], expectFocus); | |
42 } | |
43 | |
44 var bottomDialog = document.getElementById('bottom-dialog'); | |
45 bottomDialog.showModal(); | |
46 | |
47 var topDialog = document.getElementById('top-dialog'); | |
48 topDialog.showModal(); | |
49 | |
50 testFocus(document.body, false); | |
51 testTree(topDialog, true); | |
52 testTree(bottomDialog, false); | |
53 testTree(document.getElementById('container'), false); | |
54 </script> | |
55 </body> | |
56 </html> | |
OLD | NEW |