Chromium Code Reviews Chromium Code Reviews
Issue 166163005:
[SVG2] Add tabindex handling in svg. (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master| 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..76950134585c25a65c4c19c2c675c732facc5e53 |
| --- /dev/null |
| +++ b/LayoutTests/svg/custom/tabindex-order.html |
| @@ -0,0 +1,94 @@ |
| +<html> |
| +<head> |
| + <script> |
|
fs
2014/03/14 16:05:12
Could maybe use js-test.js for slightly less boile
Erik Dahlström (inactive)
2014/03/17 14:45:29
This is based on LayoutTests/fast/html/tab-order.h
|
| + 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 "a". Pressing Tab should focus "a" through "k" in order, and pressing Shift-Tab should reverse the order.</p> |
| + <svg> |
| + <rect tabindex="6" id="g" /> |
| + <rect tabindex="1" id="a" /> |
| + <rect tabindex="-5" id="not in tab order (negative tabindex)" /> |
| + <rect tabindex="1" id="b" /> |
| + <rect tabindex="0" id="i" /> |
| + <rect tabindex="6" id="h" /> |
| + <rect tabindex="1" id="c" /> |
| + <rect tabindex="1" id="d" /> |
| + <rect tabindex="0" id="j" /> |
| + <rect tabindex="-1" id="not in tab order (negative tabindex)" /> |
| + <rect tabindex="0" id="k" /> |
| + <rect tabindex="4" id="f" /> |
| + <rect tabindex="3" id="e" /> |
| + </svg> |
| + |
| + <pre id="log"></pre> |
| +</body> |
| +</html> |
| + |
