diff options
Diffstat (limited to 'testing/web-platform/tests/selection/contenteditable/modifying-selection-with-middle-mouse-button.tentative.html')
| -rw-r--r-- | testing/web-platform/tests/selection/contenteditable/modifying-selection-with-middle-mouse-button.tentative.html | 213 |
1 files changed, 213 insertions, 0 deletions
diff --git a/testing/web-platform/tests/selection/contenteditable/modifying-selection-with-middle-mouse-button.tentative.html b/testing/web-platform/tests/selection/contenteditable/modifying-selection-with-middle-mouse-button.tentative.html new file mode 100644 index 0000000000..a8287d9002 --- /dev/null +++ b/testing/web-platform/tests/selection/contenteditable/modifying-selection-with-middle-mouse-button.tentative.html @@ -0,0 +1,213 @@ +<!doctype html> +<html> +<head> +<meta charset="utf-8"> +<title>Testing default action of `mousedown` of middle button and `mouseup` of middle button</title> +<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> +<script src="/resources/testdriver-actions.js"></script> +<style> +span { + white-space: nowrap; +} +</style> +</head> +<body> +<div contenteditable></div> +<script> +"use strict"; + +var editor = document.querySelector("div[contenteditable]"); +var span1, span2, link; +var selection = getSelection(); + +function preventDefault(event) { + event.preventDefault(); +} +editor.addEventListener("paste", preventDefault, {capture: true}); + +function resetEditor() { + editor.innerHTML = + '<span id="span1">first span.</span><br><span id="span2">second span.</span><br><a id="link" href="#top">link.</a>'; + span1 = document.getElementById("span1"); + span2 = document.getElementById("span2"); + link = document.getElementById("link"); +} + +promise_test(async () => { + resetEditor(); + editor.blur(); + let actions = new test_driver.Actions(); + await actions + .pointerMove(0, 0) + .pointerMove(0, 0, {origin: span1}) + .pointerDown({button: actions.ButtonType.MIDDLE}) + .pointerUp({button: actions.ButtonType.MIDDLE}) + .send(); + + assert_equals(document.activeElement, editor, + "The clicked editor should get focus"); + assert_true(selection.isCollapsed, + "Selection should be collapsed after middle button click"); + assert_equals(selection.focusNode, span1.firstChild, + "Selection should be collapsed in the first <span> element which was clicked by middle button"); +}, "Middle click should set focus to clicked editable element and collapse selection around the clicked point"); + +promise_test(async () => { + resetEditor(); + editor.focus(); + selection.collapse(span1.firstChild, 2); + let actions = new test_driver.Actions(); + await actions + .pointerMove(0, 0) + .pointerMove(0, 0, {origin: span2}) + .pointerDown({button: actions.ButtonType.MIDDLE}) + .pointerUp({button: actions.ButtonType.MIDDLE}) + .send(); + + assert_equals(document.activeElement, editor, + "The clicked editor should keep having focus"); + assert_true(selection.isCollapsed, + "Selection should be collapsed after middle button click"); + assert_equals(selection.focusNode, span2.firstChild, + "Selection should be collapsed in the second <span> element which was clicked by middle button"); +}, "Middle click should move caret in an editable element"); + +promise_test(async () => { + resetEditor(); + editor.focus(); + selection.collapse(span1.firstChild, 2); + addEventListener("mousedown", preventDefault); + let actions = new test_driver.Actions(); + await actions + .pointerMove(0, 0) + .pointerMove(0, 0, {origin: span2}) + .pointerDown({button: actions.ButtonType.MIDDLE}) + .pointerUp({button: actions.ButtonType.MIDDLE}) + .send(); + removeEventListener("mousedown", preventDefault); + + assert_equals(selection.focusNode, span1.firstChild, + "Selection should keep collapsed selection in the first <span> element"); + assert_equals(selection.focusOffset, 2, + "Selection should keep collapsed selection at 2 of the first <span> element"); +}, "Middle click shouldn't move caret in an editable element if the default of mousedown event is prevented"); + +promise_test(async () => { + resetEditor(); + editor.focus(); + selection.collapse(span1.firstChild, 2); + addEventListener("pointerdown", preventDefault); + let actions = new test_driver.Actions(); + await actions + .pointerMove(0, 0) + .pointerMove(0, 0, {origin: span2}) + .pointerDown({button: actions.ButtonType.MIDDLE}) + .pointerUp({button: actions.ButtonType.MIDDLE}) + .send(); + removeEventListener("pointerdown", preventDefault); + + assert_equals(selection.focusNode, span1.firstChild, + "Selection should keep collapsed selection in the first <span> element"); + assert_equals(selection.focusOffset, 2, + "Selection should keep collapsed selection at 2 of the first <span> element"); +}, "Middle click shouldn't move caret in an editable element if the default of pointerdown event is prevented"); + +promise_test(async () => { + resetEditor(); + editor.focus(); + selection.collapse(span1.firstChild, 2); + let actions = new test_driver.Actions(); + await actions + .pointerMove(0, 0) + .pointerMove(0, 0, {origin: span2}) + .keyDown("\uE008") + .pointerDown({button: actions.ButtonType.MIDDLE}) + .pointerUp({button: actions.ButtonType.MIDDLE}) + .keyUp("\uE008") + .send(); + + assert_equals(selection.anchorNode, span1.firstChild, + "Selection#anchorNode should keep in the first <span> element"); + assert_equals(selection.anchorOffset, 2, + "Selection#anchorNode should keep at 2 of the first <span> element"); + assert_equals(selection.focusNode, span2.firstChild, + "Selection#focusNode should be in the second <span> element which was clicked by middle button"); +}, "Shift + Middle click should extend the selection"); + +promise_test(async () => { + resetEditor(); + editor.focus(); + selection.collapse(span1.firstChild, 2); + let actions = new test_driver.Actions(); + await actions + .pointerMove(0, 0) + .pointerMove(0, 0, {origin: link}) + .keyDown("\uE008") + .pointerDown({button: actions.ButtonType.MIDDLE}) + .pointerUp({button: actions.ButtonType.MIDDLE}) + .keyUp("\uE008") + .send(); + + assert_equals(selection.focusNode, link.firstChild, + "Selection#focusNode should be in the <a href> element which was clicked by middle button"); + assert_true(selection.isCollapsed, + "Selection#isCollapsed should be true"); +}, "Shift + Middle click in a link shouldn't extend the selection"); + +promise_test(async () => { + resetEditor(); + editor.focus(); + selection.collapse(span1.firstChild, 2); + editor.addEventListener("pointerdown", () => { + assert_true(selection.isCollapsed, + "Selection shouldn't be modified before pointerdown event"); + assert_equals(selection.focusNode, span1.firstChild, + "Selection should stay in the first <span> element when pointerdown event is fired (focusNode)"); + assert_equals(selection.focusOffset, 2, + "Selection should stay in the first <span> element when pointerdown event is fired (focusOffset)"); + }, {once: true}); + editor.addEventListener("mousedown", () => { + assert_true(selection.isCollapsed, + "Selection shouldn't be modified before mousedown event"); + assert_equals(selection.focusNode, span1.firstChild, + "Selection should stay in the first <span> element when mousedown event is fired (focusNode)"); + assert_equals(selection.focusOffset, 2, + "Selection should stay in the first <span> element when mousedown event is fired (focusOffset)"); + }, {once: true}); + editor.addEventListener("pointerup", () => { + assert_true(selection.isCollapsed, + "Selection should be collapsed before pointerup event"); + assert_equals(selection.focusNode, span2.firstChild, + "Selection should be collapsed in the second <span> element which was clicked by middle button before pointerup event "); + }, {once: true}); + let focusOffsetAtMouseUp; + editor.addEventListener("mouseup", () => { + assert_true(selection.isCollapsed, + "Selection should be collapsed before mouseup event"); + assert_equals(selection.focusNode, span2.firstChild, + "Selection should be collapsed in the second <span> element which was clicked by middle button before mouseup event "); + focusOffsetAtMouseUp = selection.focusOffset; + }, {once: true}); + let actions = new test_driver.Actions(); + await actions + .pointerMove(0, 0) + .pointerMove(0, 0, {origin: span2}) + .pointerDown({button: actions.ButtonType.MIDDLE}) + .pointerMove(0, 0, {origin: span1}) + .pointerUp({button: actions.ButtonType.MIDDLE}) + .send(); + + assert_true(selection.isCollapsed, + "Selection shouldn't be extended by pointer moves during pressing middle button"); + assert_equals(selection.focusNode, span2.firstChild, + "Selection#focusNode should stay in the second <span> element"); + assert_equals(selection.focusOffset, focusOffsetAtMouseUp, + "Selection#focusOffset should stay in the second <span> element"); +}, "Middle mouse button down should move caret, but middle mouse button up shouldn't move caret"); + +</script> +</body> +</html> |