| <!DOCTYPE html> |
| <!-- TODO(crbug.com/1015307): should adopt title value. --> |
| <title>SpatNav isn't performed if the webpage directly handles the arrow keys for moving focus.</title> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script src="resources/snav-testharness.js"></script> |
| |
| <button id="a">A</button> |
| <button id="b">B</button> |
| <button id="c">C</button> |
| <button id="d">D</button> |
| <button id="e">E</button> |
| <button id="f">F</button> |
| <button id="g">G</button> |
| |
| <script> |
| const buttons = document.getElementsByTagName("button"); |
| |
| // Keydown on D button. |
| buttons[3].addEventListener('keydown', (e) => { |
| // Custom SpatNav on web page. |
| if (e.key == 'ArrowLeft') { |
| // Move focus to B button. |
| buttons[1].focus(); |
| } else if (e.key == 'ArrowRight') { |
| // Move focus to F button. |
| buttons[5].focus(); |
| } |
| }); |
| </script> |
| <script> |
| var resultMap = [ |
| ["Right", "a"], |
| ["Right", "b"], |
| ["Right", "c"], |
| ["Right", "d"], |
| ["Right", "f"], |
| ["Right", "g"], |
| ["Left", "f"], |
| ["Left", "e"], |
| ["Left", "d"], |
| ["Left", "b"], |
| ["Left", "a"] |
| ]; |
| |
| snav.assertFocusMoves(resultMap); |
| </script> |
