diff options
Diffstat (limited to 'layout/base/tests/test_caret_browsing_around_form_controls.html')
-rw-r--r-- | layout/base/tests/test_caret_browsing_around_form_controls.html | 379 |
1 files changed, 379 insertions, 0 deletions
diff --git a/layout/base/tests/test_caret_browsing_around_form_controls.html b/layout/base/tests/test_caret_browsing_around_form_controls.html new file mode 100644 index 0000000000..8b4fb480cd --- /dev/null +++ b/layout/base/tests/test_caret_browsing_around_form_controls.html @@ -0,0 +1,379 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"> +<script src="/tests/SimpleTest/SimpleTest.js"></script> +<script src="/tests/SimpleTest/EventUtils.js"></script> +<link rel="stylesheet" href="/tests/SimpleTest/test.css"> +<script> +"use strict"; + +SimpleTest.waitForExplicitFinish(); +SimpleTest.waitForFocus(async () => { + await SpecialPowers.pushPrefEnv({ + set:[ + ["accessibility.browsewithcaret", true], + ], + }); + (function test_move_caret_from_before_input_text() { + info("Starting test_move_caret_from_before_input_text..."); + document.body.innerHTML = '<div>abc<input value="def">ghi</div>'; + const input = document.querySelector("input"); + const textBefore = input.previousSibling; + getSelection().collapse(textBefore, textBefore.length); + synthesizeKey("KEY_ArrowRight"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_before_input_text: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + input.nextSibling, + "test_move_caret_from_before_input_text: caret should be moved to text node after the <input>" + ); + is( + getSelection().focusOffset, + 0, + "test_move_caret_from_before_input_text: caret should be moved to start of the text node" + ); + })(); + (function test_move_caret_from_after_input_text() { + info("Starting test_move_caret_from_after_input_text..."); + document.body.innerHTML = '<div>abc<input value="def">ghi</div>'; + const input = document.querySelector("input"); + getSelection().collapse(input.nextSibling, 0); + synthesizeKey("KEY_ArrowLeft"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_after_input_text: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + input.previousSibling, + "test_move_caret_from_after_input_text: caret should be moved to text node before the <input>" + ); + is( + getSelection().focusOffset, + input.previousSibling.length, + "test_move_caret_from_after_input_text: caret should be moved to end of the text node" + ); + })(); + (function test_move_caret_from_before_double_input_text() { + info("Starting test_move_caret_from_before_double_input_text..."); + document.body.innerHTML = '<div>abc<input value="def"><input value="ghi">jkl</div>'; + const firstInput = document.querySelector("input"); + const secondInput = firstInput.nextSibling; + const textBefore = firstInput.previousSibling; + getSelection().collapse(textBefore, textBefore.length); + synthesizeKey("KEY_ArrowRight"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_before_double_input_text: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + secondInput.nextSibling, + "test_move_caret_from_before_double_input_text: caret should be moved to text node after the second <input> (container)" + ); + is( + getSelection().focusOffset, + 0, + "test_move_caret_from_before_double_input_text: caret should be moved to text node after the second <input> (offset)" + ); + })(); + (function test_move_caret_from_after_double_input_text() { + info("Starting test_move_caret_from_after_double_input_text..."); + document.body.innerHTML = '<div>abc<input value="def"><input value="ghi">jkl</div>'; + const firstInput = document.querySelector("input"); + const secondInput = firstInput.nextSibling; + getSelection().collapse(secondInput.nextSibling, 0); + synthesizeKey("KEY_ArrowLeft"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_after_double_input_text: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + firstInput.previousSibling, + "test_move_caret_from_after_double_input_text: caret should be moved to text node before the first <input> (container)" + ); + is( + getSelection().focusOffset, + firstInput.previousSibling.length, + "test_move_caret_from_after_double_input_text: caret should be moved to text node before the first <input> (offset)" + ); + })(); + + (function test_move_caret_from_before_input_button() { + info("Starting test_move_caret_from_before_input_button..."); + document.body.innerHTML = '<div>abc<input type="button" value="def">ghi</div>'; + const input = document.querySelector("input"); + const textBefore = input.previousSibling; + getSelection().collapse(textBefore, textBefore.length); + synthesizeKey("KEY_ArrowRight"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_before_input_button: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + input.nextSibling, + "test_move_caret_from_before_input_button: caret should be moved to text node after the <input>" + ); + is( + getSelection().focusOffset, + 0, + "test_move_caret_from_before_input_button: caret should be moved to start of the text node" + ); + })(); + (function test_move_caret_from_after_input_button() { + info("Starting test_move_caret_from_after_input_button..."); + document.body.innerHTML = '<div>abc<input type="button" value="def">ghi</div>'; + const input = document.querySelector("input"); + getSelection().collapse(input.nextSibling, 0); + synthesizeKey("KEY_ArrowLeft"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_after_input_button: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + input.previousSibling, + "test_move_caret_from_after_input_button: caret should be moved to text node before the <input>" + ); + is( + getSelection().focusOffset, + input.previousSibling.length, + "test_move_caret_from_after_input_button: caret should be moved to end of the text node" + ); + })(); + (function test_move_caret_from_before_double_input_button() { + info("Starting test_move_caret_from_before_double_input_button..."); + document.body.innerHTML = '<div>abc<input type="button" value="def"><input type="button" value="ghi">jkl</div>'; + const firstInput = document.querySelector("input"); + const secondInput = firstInput.nextSibling; + const textBefore = firstInput.previousSibling; + getSelection().collapse(textBefore, textBefore.length); + synthesizeKey("KEY_ArrowRight"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_before_double_input_button: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + secondInput.nextSibling, + "test_move_caret_from_before_double_input_button: caret should be moved to text node after the second <input> (container)" + ); + is( + getSelection().focusOffset, + 0, + "test_move_caret_from_before_double_input_button: caret should be moved to text node after the second <input> (offset)" + ); + })(); + (function test_move_caret_from_after_double_input_button() { + info("Starting test_move_caret_from_after_double_input_button..."); + document.body.innerHTML = '<div>abc<input type="button" value="def"><input type="button" value="ghi">jkl</div>'; + const firstInput = document.querySelector("input"); + const secondInput = firstInput.nextSibling; + getSelection().collapse(secondInput.nextSibling, 0); + synthesizeKey("KEY_ArrowLeft"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_after_double_input_button: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + firstInput.previousSibling, + "test_move_caret_from_after_double_input_button: caret should be moved to text node before the first <input> (container)" + ); + is( + getSelection().focusOffset, + firstInput.previousSibling.length, + "test_move_caret_from_after_double_input_button: caret should be moved to text node before the first <input> (offset)" + ); + })(); + + (function test_move_caret_from_before_button() { + info("Starting test_move_caret_from_before_button..."); + document.body.innerHTML = '<div>abc<button>def</button>ghi</div>'; + const button = document.querySelector("button"); + const textBefore = button.previousSibling; + getSelection().collapse(textBefore, textBefore.length); + synthesizeKey("KEY_ArrowRight"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_before_button: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + button.nextSibling, + "test_move_caret_from_before_button: caret should be moved to text node after the <button>" + ); + is( + getSelection().focusOffset, + 0, + "test_move_caret_from_before_button: caret should be moved to start of the text node" + ); + })(); + (function test_move_caret_from_after_button() { + info("Starting test_move_caret_from_after_button..."); + document.body.innerHTML = '<div>abc<button>def</button>ghi</div>'; + const button = document.querySelector("button"); + getSelection().collapse(button.nextSibling, 0); + synthesizeKey("KEY_ArrowLeft"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_after_button: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + button.previousSibling, + "test_move_caret_from_after_button: caret should be moved to text node before the <button>" + ); + is( + getSelection().focusOffset, + button.previousSibling.length, + "test_move_caret_from_after_button: caret should be moved to end of the text node" + ); + })(); + (function test_move_caret_from_before_double_button() { + info("Starting test_move_caret_from_before_double_button..."); + document.body.innerHTML = '<div>abc<button>def</button><button>ghi</button>jkl</div>'; + const firstButton = document.querySelector("button"); + const secondButton = firstButton.nextSibling; + const textBefore = firstButton.previousSibling; + getSelection().collapse(textBefore, textBefore.length); + synthesizeKey("KEY_ArrowRight"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_before_double_button: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + secondButton.nextSibling, + "test_move_caret_from_before_double_button: caret should be moved to text node after the second <button> (container)" + ); + is( + getSelection().focusOffset, + 0, + "test_move_caret_from_before_double_button: caret should be moved to text node after the second <button> (offset)" + ); + })(); + (function test_move_caret_from_after_double_button() { + info("Starting test_move_caret_from_after_double_button..."); + document.body.innerHTML = '<div>abc<button>def</button><button>ghi</button>jkl</div>'; + const firstButton = document.querySelector("button"); + const secondButton = firstButton.nextSibling; + getSelection().collapse(secondButton.nextSibling, 0); + synthesizeKey("KEY_ArrowLeft"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_after_double_button: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + firstButton.previousSibling, + "test_move_caret_from_after_double_button: caret should be moved to text node before the first <button> (container)" + ); + is( + getSelection().focusOffset, + firstButton.previousSibling.length, + "test_move_caret_from_after_double_button: caret should be moved to text node before the first <button> (offset)" + ); + })(); + + (function test_move_caret_from_before_textarea() { + info("Starting test_move_caret_from_before_textarea..."); + document.body.innerHTML = '<div>abc<textarea>def</textarea>ghi</div>'; + const textarea = document.querySelector("textarea"); + const textBefore = textarea.previousSibling; + getSelection().collapse(textBefore, textBefore.length); + synthesizeKey("KEY_ArrowRight"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_before_textarea: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + textarea.nextSibling, + "test_move_caret_from_before_textarea: caret should be moved to text node after the <textarea>" + ); + is( + getSelection().focusOffset, + 0, + "test_move_caret_from_before_textarea: caret should be moved to start of the text node" + ); + })(); + (function test_move_caret_from_after_textarea() { + info("Starting test_move_caret_from_after_textarea..."); + document.body.innerHTML = '<div>abc<textarea>def</textarea>ghi</div>'; + const textarea = document.querySelector("textarea"); + getSelection().collapse(textarea.nextSibling, 0); + synthesizeKey("KEY_ArrowLeft"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_after_textarea: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + textarea.previousSibling, + "test_move_caret_from_after_textarea: caret should be moved to text node before the <textarea>" + ); + is( + getSelection().focusOffset, + textarea.previousSibling.length, + "test_move_caret_from_after_textarea: caret should be moved to end of the text node" + ); + })(); + (function test_move_caret_from_before_double_textarea() { + info("Starting test_move_caret_from_before_double_textarea..."); + document.body.innerHTML = '<div>abc<textarea>def</textarea><textarea>ghi</textarea>jkl</div>'; + const firstTextarea = document.querySelector("textarea"); + const secondTextarea = firstTextarea.nextSibling; + const textBefore = firstTextarea.previousSibling; + getSelection().collapse(textBefore, textBefore.length); + synthesizeKey("KEY_ArrowRight"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_before_double_textarea: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + secondTextarea.nextSibling, + "test_move_caret_from_before_double_textarea: caret should be moved to text node after the second <textarea> (container)" + ); + is( + getSelection().focusOffset, + 0, + "test_move_caret_from_before_double_textarea: caret should be moved to text node after the second <textarea> (offset)" + ); + })(); + (function test_move_caret_from_after_double_textarea() { + info("Starting test_move_caret_from_after_double_textarea..."); + document.body.innerHTML = '<div>abc<textarea>def</textarea><textarea>ghi</textarea>jkl</div>'; + const firstTextarea = document.querySelector("textarea"); + const secondTextarea = firstTextarea.nextSibling; + getSelection().collapse(secondTextarea.nextSibling, 0); + synthesizeKey("KEY_ArrowLeft"); + ok( + getSelection().isCollapsed, + "test_move_caret_from_after_double_textarea: selection should be collapsed after moving caret" + ); + is( + getSelection().focusNode, + firstTextarea.previousSibling, + "test_move_caret_from_after_double_textarea: caret should be moved to text node before the first <textarea> (container)" + ); + is( + getSelection().focusOffset, + firstTextarea.previousSibling.length, + "test_move_caret_from_after_double_textarea: caret should be moved to text node before the first <textarea> (offset)" + ); + })(); + + SimpleTest.finish(); +}); +</script> +</head> +<body></body> +</html> |