blob: dca44e9b8d8dd6ea8c508e5b163083991cb6e834 [file] [log] [blame]
<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="resources/snav-testharness.js"></script>
<style>
.box {
width: 100px;
height: 30px;
margin: 5px;
border: 1px solid black;
display: inline-block;
}
</style>
<div class="box" tabindex="0">Top-Left</div>
<div class="box" tabindex="0">Top</div>
<div class="container">
<div class="box" tabindex="0">Left</div>
<input class="box" id="input" type="text" value="center">
<div class="box" tabindex="0">Right</div>
</div>
<div class="box" tabindex="0">Bottom-Left</div>
<div class="box" tabindex="0">Bottom</div>
<script>
// This test ensures that when an editable has focus, arrow keys don't cause
// spatial-navigation movement.
let first = document.getElementById("first");
let second = document.getElementById("second");
let third = document.getElementById("third");
let input = document.getElementById("input");
snav.assertSnavEnabledAndTestable(true /* focuslessSpatNav */ );
function testDirection(direction, expectMove) {
// We move twice because the first move will be interpreted as an editor
// command while the second will be ignored by the editor. We shouldn't
// move interest in either case.
snav.triggerMove(direction);
snav.triggerMove(direction);
if (expectMove) {
assert_not_equals(
window.internals.interestedElement,
input,
direction + " key expected to move interest but didn't,");
} else {
assert_equals(
window.internals.interestedElement,
input,
direction + " key did not expect to move interest but did,");
}
// Reset focus so the focused input box starts in a consistent state (fully
// selected) for the next test.
eventSender.keyDown('Escape');
eventSender.keyDown('Enter');
}
test(() => {
// Move interest to editable 'input' box and focus it.
snav.triggerMove('Down');
snav.triggerMove('Down');
snav.triggerMove('Right');
eventSender.keyDown('Enter');
assert_equals(document.activeElement, input);
assert_equals(window.internals.interestedElement, input);
// Ensure directional keys don't cause spatial navigation to move interest.
// We move twice because the first move will be interpreted as an editor
// command while the second will be ignored by the editor. We shouldn't
// move interest in either case.
let expectMove = false;
testDirection('Down', expectMove);
testDirection('Left', expectMove);
testDirection('Right', expectMove);
testDirection('Up', expectMove);
// Ensure removing focus allows movement again.
eventSender.keyDown('Escape');
expectMove = true;
testDirection('Down', expectMove);
}, "Enter key moves focus into interested element");
</script>