| <!DOCTYPE html> |
| <script src="../../../../../resources/testharness.js"></script> |
| <script src="../../../../../resources/testharnessreport.js"></script> |
| <script src="../../../../../fast/spatial-navigation/resources/snav-testharness.js"></script> |
| |
| <style> |
| div { |
| width: 100px; |
| height: 100px; |
| margin: 5px; |
| border: 1px solid black; |
| } |
| </style> |
| |
| <div id="first" tabindex="0">First</div> |
| <div id="second" tabindex="0">Second</div> |
| <div id="third" tabindex="0">Third</div> |
| |
| <script> |
| var resultMap = [ |
| ["Down", "first"], |
| ["Down", "second"], |
| ["Down", "third"], |
| ]; |
| |
| // This test checks basic movement operation of the "focusless spatial |
| // navigation" feature. This feature puts spatial navigation into a mode that |
| // moves a visual-only indicator, rather than page focus. However, in |
| // accessibility mode, we still shift focus, despite the name, since a great |
| // deal of functionality is tied to focus. |
| let no_focus_test = async_test("Focusless SpatNav"); |
| let first = document.getElementById("first"); |
| let second = document.getElementById("second"); |
| let third = document.getElementById("third"); |
| |
| var count = 0; |
| |
| first.addEventListener("focus", () => { count++; }); |
| second.addEventListener("focus", () => { count++; }); |
| third.addEventListener("focus", () => { count++; }); |
| |
| let postAssertsFunc = no_focus_test.step_func_done(() => { |
| assert_equals(count, 3); |
| assert_equals(document.activeElement, third); |
| }); |
| |
| snav.assertFocusMoves(resultMap, |
| true /* enableSpatnav */, |
| postAssertsFunc, |
| true /* focuslessSpatNav */ ); |
| </script> |