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