blob: b8173aa054e607b66550507c9cca0a41812bc7e5 [file] [log] [blame]
rniwa@webkit.org9b388122017-01-04 03:39:39 +00001<!DOCTYPE html>
2<html>
3<body>
4<p>Tests for moving focus by pressing tab key across label and legend elements.<br>
5To manually test, press tab key seven times then shift+tab six times.<br>
6It should traverse focusable elements in the ascending order from 1 to 7 and then in the descending order back to 1.</p>
7</p>
8<input id="startingNode">
9<div id="test-content">
10 <label title="FAIL - a non-focusable label with an input should not be focused">
11 <input title="1. An input element inside a non-focusable label element">hello
12 </label>
13 <label tabindex="0" title="2. A label element with an input element">
14 <input title="3. An input elment inside a focusable label element">world</label>
15 <label tabindex="0" title="4. A label element with just text">webkit</label>
16 <label title="FAIL - an label element without tabindex should not be focused">rocks</label>
17 <fieldset tabindex="0" title="5. A fieldset element with tabindex">
18 <legend tabindex="0" title="6. A focusable legend element inside a fieldset element">foo</legend>
19 <input title="7. An input element inside a fieldset element">
20 </fieldset>
21</div>
22<style> :focus { background: red; } </style>
23<pre id="result"></pre>
24<script>
25
26function moveFocusForward(focusCount)
27{
28 setTimeout(function () {
29 if (!focusCount)
30 return moveFocusBackward(7);
31 eventSender.keyDown('\t');
32 setTimeout(function () {
33 moveFocusForward(focusCount - 1);
34 }, 1);
35 }, 1);
36}
37
38function moveFocusBackward(focusCount)
39{
40 setTimeout(function () {
41 if (!focusCount) {
42 testContent.style.display = 'none';
43 testRunner.notifyDone();
44 return;
45 }
46 eventSender.keyDown('\t', ['shiftKey']);
47 setTimeout(function () {
48 moveFocusBackward(focusCount - 1);
49 }, 1);
50 }, 1);
51}
52
53let testContent = document.getElementById('test-content');
54
55window.onload = () => {
56 document.getElementById('startingNode').focus();
57 if (window.eventSender) {
58 testRunner.dumpAsText();
59 testRunner.waitUntilDone();
60 }
61 moveFocusForward(7);
62}
63
64testContent.querySelectorAll('*').forEach((element) => {
65 element.onfocus = function () {
66 document.getElementById('result').textContent += (element.title || 'FAIL - focused an unexpected element') + '\n';
67 }
68});
69
70</script>
71</body>
72</html>