| <!DOCTYPE html> |
| <meta charset="utf-8"> |
| <title>Tabbing through Non-Rendered SVG elements</title> |
| <link rel="author" title="Divyansh Mangal" href="mailto:dmangal@microsoft.com"> |
| <link rel="help" href="https://svgwg.org/svg2-draft/single-page.html#interact-Focus"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="/resources/testdriver.js"></script> |
| <script src="/resources/testdriver-vendor.js"></script> |
| |
| <svg xmlns="http://www.w3.org/2000/svg"> |
| <a href="#void" id="start"> |
| <text tabindex='-1' x="10" y="10">start</text> |
| </a> |
| <g x="30" y="10" style="display: none;"> |
| <a href="#void" id="middle"> |
| <text tabindex='-1' x="30" y="10">middle</text> |
| </a> |
| </g> |
| <a href="#void" id="end"> |
| <text tabindex='-1' x="50" y="10">end</text> |
| </a> |
| </svg> |
| |
| <script> |
| promise_test(async t => { |
| const start = document.getElementById('start'); |
| const end = document.getElementById('end'); |
| |
| start.focus(); |
| assert_equals(document.activeElement, start, "Start element should be focused initially"); |
| |
| // Simulate pressing the Tab key |
| await test_driver.send_keys(start, '\uE004'); // '\uE004' is the WebDriver key code for Tab |
| |
| // Verify that the focus moved to the end element and middle element is skipped |
| assert_equals(document.activeElement, end, "End element should be focused after pressing Tab"); |
| }, "Hidden SVG Tab focus test"); |
| </script> |
