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

Unified 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, 8 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 side-by-side diff with in-line comments
Download patch
Index: LayoutTests/svg/custom/tabindex-order.html
diff --git a/LayoutTests/svg/custom/tabindex-order.html b/LayoutTests/svg/custom/tabindex-order.html
new file mode 100644
index 0000000000000000000000000000000000000000..a3fe411c5f9d9db1edc18686cf97e6f9f6dfbe0c
--- /dev/null
+++ b/LayoutTests/svg/custom/tabindex-order.html
@@ -0,0 +1,94 @@
+<html>
+<head>
+ <script>
+ function log(msg)
+ {
+ document.getElementById('log').appendChild(document.createTextNode(msg + '\n'));
+ }
+
+ function description(element)
+ {
+ if (element.tagName && element.tagName.match(/rect/i)) {
+ return '<rect id="' + element.id + '" tabindex="' + element.tabIndex + '">';
+ } else {
+ return element.toString();
+ }
+ }
+
+ function dispatchTabPress(element, shiftKey)
+ {
+ var event = document.createEvent('KeyboardEvents');
+ var tabKeyIdentifier = 'U+0009';
+ event.initKeyboardEvent('keydown', true, true, document.defaultView, tabKeyIdentifier, 0, false, false, shiftKey, false, false);
+ element.dispatchEvent(event);
+ }
+
+ var lastFocusedElement = null;
+ function focusListener(event)
+ {
+ log('<rect id="' + event.target.id + '" tabindex="' + event.target.tabIndex + '"> focused');
+ lastFocusedElement = event.target;
+ }
+
+ function addEventListenersToRects(rects)
+ {
+ for (var i = 0; i < rects.length; ++i) {
+ rects[i].addEventListener('focus', focusListener, false);
+ }
+ }
+
+ function test()
+ {
+ if (window.testRunner) {
+ testRunner.dumpAsText();
+ }
+
+ var rects = document.getElementsByTagName('rect');
+
+ // Put focus in the page
+ rects[0].focus();
+ rects[0].blur();
+
+ addEventListenersToRects(rects);
+
+ log('Tabbing forward....\n');
+ for (var i = 0; i < rects.length; ++i) {
+ if (rects[i].tabIndex >= 0)
+ dispatchTabPress(document, false);
+ }
+
+ lastFocusedElement.blur();
+
+ log('\nTabbing backward....\n');
+ for (var i = 0; i < rects.length; ++i) {
+ if (rects[i].tabIndex >= 0)
+ dispatchTabPress(document, true);
+ }
+
+ log('\nTest finished\n');
+ }
+ </script>
+</head>
+<body onload="test()">
+ <p>This page tests that the SVG tabbing order is respected properly.</p>
+ <p>To test, put focus in &quot;a&quot;. Pressing Tab should focus &quot;a&quot; through &quot;k&quot; in order, and pressing Shift-Tab should reverse the order.</p>
+ <svg>
+ <rect tabindex="6" id="g" width="1" height="1"/>
+ <rect tabindex="1" id="a" width="1" height="1"/>
+ <rect tabindex="-5" id="not in tab order (negative tabindex)" width="1" height="1"/>
+ <rect tabindex="1" id="b" width="1" height="1"/>
+ <rect tabindex="0" id="i" width="1" height="1"/>
+ <rect tabindex="6" id="h" width="1" height="1"/>
+ <rect tabindex="1" id="c" width="1" height="1"/>
+ <rect tabindex="1" id="d" width="1" height="1"/>
+ <rect tabindex="0" id="j" width="1" height="1"/>
+ <rect tabindex="-1" id="not in tab order (negative tabindex)" width="1" height="1"/>
+ <rect tabindex="0" id="k" width="1" height="1"/>
+ <rect tabindex="4" id="f" width="1" height="1"/>
+ <rect tabindex="3" id="e" width="1" height="1"/>
+ </svg>
+
+ <pre id="log"></pre>
+</body>
+</html>
+
« 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