Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(61)

Side by Side Diff: LayoutTests/svg/custom/tabindex-order.html

Issue 166163005: [SVG2] Add tabindex handling in svg. (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: rebase Created 6 years, 7 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
1 <html>
2 <head>
3 <script>
4 function log(msg)
5 {
6 document.getElementById('log').appendChild(document.createTextNode(m sg + '\n'));
7 }
8
9 function description(element)
10 {
11 if (element.tagName && element.tagName.match(/rect/i)) {
12 return '<rect id="' + element.id + '" tabindex="' + element.tabI ndex + '">';
13 } else {
14 return element.toString();
15 }
16 }
17
18 function dispatchTabPress(element, shiftKey)
19 {
20 var event = document.createEvent('KeyboardEvents');
21 var tabKeyIdentifier = 'U+0009';
22 event.initKeyboardEvent('keydown', true, true, document.defaultView, tabKeyIdentifier, 0, false, false, shiftKey, false, false);
23 element.dispatchEvent(event);
24 }
25
26 var lastFocusedElement = null;
27 function focusListener(event)
28 {
29 log('<rect id="' + event.target.id + '" tabindex="' + event.target.t abIndex + '"> focused');
30 lastFocusedElement = event.target;
31 }
32
33 function addEventListenersToRects(rects)
34 {
35 for (var i = 0; i < rects.length; ++i) {
36 rects[i].addEventListener('focus', focusListener, false);
37 }
38 }
39
40 function test()
41 {
42 if (window.testRunner) {
43 testRunner.dumpAsText();
44 }
45
46 var rects = document.getElementsByTagName('rect');
47
48 // Put focus in the page
49 rects[0].focus();
50 rects[0].blur();
51
52 addEventListenersToRects(rects);
53
54 log('Tabbing forward....\n');
55 for (var i = 0; i < rects.length; ++i) {
56 if (rects[i].tabIndex >= 0)
57 dispatchTabPress(document, false);
58 }
59
60 lastFocusedElement.blur();
61
62 log('\nTabbing backward....\n');
63 for (var i = 0; i < rects.length; ++i) {
64 if (rects[i].tabIndex >= 0)
65 dispatchTabPress(document, true);
66 }
67
68 log('\nTest finished\n');
69 }
70 </script>
71 </head>
72 <body onload="test()">
73 <p>This page tests that the SVG tabbing order is respected properly.</p>
74 <p>To test, put focus in &quot;a&quot;. Pressing Tab should focus &quot;a&qu ot; through &quot;k&quot; in order, and pressing Shift-Tab should reverse the or der.</p>
75 <svg>
76 <rect tabindex="6" id="g" width="1" height="1"/>
77 <rect tabindex="1" id="a" width="1" height="1"/>
78 <rect tabindex="-5" id="not in tab order (negative tabindex)" wi dth="1" height="1"/>
79 <rect tabindex="1" id="b" width="1" height="1"/>
80 <rect tabindex="0" id="i" width="1" height="1"/>
81 <rect tabindex="6" id="h" width="1" height="1"/>
82 <rect tabindex="1" id="c" width="1" height="1"/>
83 <rect tabindex="1" id="d" width="1" height="1"/>
84 <rect tabindex="0" id="j" width="1" height="1"/>
85 <rect tabindex="-1" id="not in tab order (negative tabindex)" wi dth="1" height="1"/>
86 <rect tabindex="0" id="k" width="1" height="1"/>
87 <rect tabindex="4" id="f" width="1" height="1"/>
88 <rect tabindex="3" id="e" width="1" height="1"/>
89 </svg>
90
91 <pre id="log"></pre>
92 </body>
93 </html>
94
OLDNEW
« no previous file with comments | « LayoutTests/svg/custom/focus-ring-2-expected.html ('k') | LayoutTests/svg/custom/tabindex-order-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698