Bug 1924905 [wpt PR 48634] - [Editing] Double-click selects wrong range for any element styled as float., a=testonly

Automatic update from web-platform-tests
[Editing] Double-click selects wrong range for any element styled
as float.

The CL addresses the bug where double click on any list item
selects multiple list items when list item has floating style.
When there are multiple list items and anyone is selected using
double click, it selects all the list items along with the one
on which double click was performed. This happens because in
|ComputeInlineContentsAsBlockFlow|, float style is not considered
as text segment boundary and the selection is expanded for all.

Also, for other cases involving floating style on element, the
selection is not as expected as selecting a float element by
double click selects everything. This is fixed by removing the
condition which expands the selection when the element has a
floating style.

Firefox has the behavior similar to what we get after the fix
i.e it doesn't expand the selection for floating elements. Webkit
however, seems to have the same bug as chromium expanding the
selection for floating elements.

Bug: 40711666
Change-Id: I408b388cfd0cb5a8213ef2c433b547376ff83367
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5842631
Reviewed-by: Kent Tamura <tkent@chromium.org>
Commit-Queue: Pranav Modi <pranavmodi@microsoft.com>
Reviewed-by: Sanket Joshi <sajos@microsoft.com>
Reviewed-by: Siye Liu <siliu@microsoft.com>
Cr-Commit-Position: refs/heads/main@{#1369172}

--

wpt-commits: 721205f92ea832a0197975112a48f5355c8bfcbf
wpt-pr: 48634
This commit is contained in:
Pranav Modi 2024-10-16 22:18:31 +00:00 committed by moz-wptsync-bot
parent f323da2904
commit 0149807b85
2 changed files with 143 additions and 0 deletions

View File

@ -0,0 +1,71 @@
<!DOCTYPE html>
<meta charset="utf-8" />
<title>
This test is for testing the range selection of floating list item on
double click.
</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/testdriver.js"></script>
<script src="/resources/testdriver-actions.js"></script>
<script src="/resources/testdriver-vendor.js"></script>
<style>
.fl,
li {
float: left;
margin-right: 40px;
}
</style>
<div>
<ul>
<li id="first">First</li>
<li>Second</li>
</ul>
</div>
<div>
<strong id="sfirst" class="fl">first</strong
><strong class="fl">second</strong>
</div>
<script>
function runTests() {
promise_test(async () => {
const first = document.getElementById("first");
first.focus();
let actions = new test_driver.Actions()
.pointerMove(0, 0, { origin: first })
.pointerDown()
.pointerUp()
.pointerDown()
.pointerUp();
await actions.send();
const selection = window.getSelection();
let selectedText = selection.toString();
assert_equals(
selectedText,
"First",
"Selected Text Should be equal to first list item"
);
}, "Double click on one floating list item should not select more than one list item");
promise_test(async () => {
const sfirst = document.getElementById("sfirst");
sfirst.focus();
let actions = new test_driver.Actions()
.pointerMove(0, 0, { origin: sfirst })
.pointerDown()
.pointerUp()
.pointerDown()
.pointerUp();
await actions.send();
const selection = window.getSelection();
let selectedText = selection.toString();
assert_equals(
selectedText,
"first",
"Selected Text Should be equal to first list item"
);
}, "Double click on one floating strong text should not select more than one item");
}
window.addEventListener("load", runTests, { once: true });
</script>

View File

@ -0,0 +1,72 @@
<!DOCTYPE html>
<meta charset="utf-8" />
<title>
This test is for testing the range selection of list item on double
click.
</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/testdriver.js"></script>
<script src="/resources/testdriver-actions.js"></script>
<script src="/resources/testdriver-vendor.js"></script>
<style>
.inline-block {
display: inline-block;
width: 50px;
height: 20px;
background-color: lightblue;
}
</style>
<div>
<ul>
<li id="first">First</li>
<li>Second</li>
</ul>
</div>
<div>
This is some
<span id="atomicinline" class="inline-block">atomicinline</span> text.
</div>
<script>
function runTests() {
promise_test(async () => {
const first = document.getElementById("first");
first.focus();
let actions = new test_driver.Actions()
.pointerMove(0, 0, { origin: "viewport" })
.pointerDown()
.pointerUp()
.pointerDown()
.pointerUp();
await actions.send();
const selection = window.getSelection();
let selectedText = selection.toString();
assert_equals(
selectedText,
"First",
"Selected Text Should be equal to first list item"
);
}, "Double click on one list item should not select more than one list item");
promise_test(async () => {
const atomic_inline = document.getElementById("atomicinline");
atomic_inline.focus();
let actions = new test_driver.Actions()
.pointerMove(0, 0, { origin: atomic_inline })
.pointerDown()
.pointerUp()
.pointerDown()
.pointerUp();
await actions.send();
const selection = window.getSelection();
let selectedText = selection.toString();
assert_equals(
selectedText,
"atomicinline",
"Selected Text Should be equal to atomicinline"
);
}, "Double click on one text item should select only one text item");
}
window.addEventListener("load", runTests, { once: true });
</script>