Skip to content

Commit 570d512

Browse files
[WPT] Fix WPTs failing on chrome
Following WPTs were failing on chrome and passing on content_shell and headless_shell. third_party\blink\web_tests\external\wpt\editing\other\ merge-span-with-style-after-backspace-having-contenteditable.html third_party\blink\web_tests\external\wpt\editing\other\ merge-span-with-style-after-forwarddelete-having-contenteditable.html third_party\blink\web_tests\external\wpt\editing\other\ merge-span-with-style-after-pressing-enter-followed-by- backspace-in-contenteditable-div.html These WPTs were failing in chrome but passing in content_shell and headless_shell. The WPTs were failing because it was using editor-test utils where we are placing the caret at time of setting up editing host. Somehow the caret placed moves to the end of the text node when we call the backspace key in chrome but works fine in content_shell and headless_shell. This leads to deletion of the last character in the textnode instead of the desired output. Hence, I have modified the test to use selection and range to place the caret which works fine in all shells. Bug: 398413722 Change-Id: Iff6f8438c6982084601d846cac496000e1edf912 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6295383 Commit-Queue: Pranav Modi <[email protected]> Reviewed-by: Sanket Joshi <[email protected]> Reviewed-by: Sambamurthy Bandaru <[email protected]> Cr-Commit-Position: refs/heads/main@{#1424384}
1 parent 46e8857 commit 570d512

3 files changed

+78
-55
lines changed

editing/other/merge-span-with-style-after-backspace-having-contenteditable.html

Lines changed: 23 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -8,31 +8,36 @@
88
<script src="/resources/testdriver.js"></script>
99
<script src="/resources/testdriver-vendor.js"></script>
1010
<script src="/resources/testdriver-actions.js"></script>
11-
<script src="../include/editor-test-utils.js"></script>
1211
</head>
1312
<body>
14-
<div contenteditable></div>
13+
<div contenteditable><h1><span style="background-color:red;">Back</span></h1>
14+
<h1><span style="background-color: red;">space</span></h1></div>
1515
<script>
1616
"use strict";
1717

18-
const utils =
19-
new EditorTestUtils(document.querySelector("div[contenteditable]"));
18+
const kBackspaceKey = "\uE003";
19+
20+
function sendBackspaceKey() {
21+
return new test_driver.Actions()
22+
.keyDown(kBackspaceKey)
23+
.keyUp(kBackspaceKey)
24+
.send();
25+
}
2026

2127
promise_test(async () => {
22-
utils.setupEditingHost(
23-
`<div contenteditable="true">
24-
<h1><span style="background-color:red;">Back</span></h1>
25-
<h1><span style="background-color:red;">[]space</span></h1>
26-
</div>`
27-
);
28-
await utils.sendBackspaceKey();
29-
assert_in_array(
30-
utils.editingHost.innerHTML,
31-
[
32-
`<div contenteditable="true">
33-
<h1><span style="background-color:red;">Back</span><span style="background-color: red;">space</span></h1>
34-
</div>`
35-
],
28+
const editableDiv = document.querySelector("div[contenteditable]");
29+
const spaceSpan = editableDiv.querySelectorAll('span')[1];
30+
const range = document.createRange();
31+
const selection = window.getSelection();
32+
const textNode = spaceSpan.firstChild;
33+
range.setStart(textNode, 0);
34+
range.setEnd(textNode, 0);
35+
selection.removeAllRanges();
36+
selection.addRange(range);
37+
await sendBackspaceKey();
38+
assert_equals(
39+
editableDiv.innerHTML,
40+
"<h1><span style=\"background-color:red;\">Back</span><span style=\"background-color: red;\">space</span></h1>",
3641
"Style is not preserved for the span after pressing backspace in contenteditable"
3742
);
3843
}, "waiting for command to execute");

editing/other/merge-span-with-style-after-forwarddelete-having-contenteditable.html

Lines changed: 24 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -2,37 +2,42 @@
22
<html>
33
<head>
44
<meta charset="utf-8">
5-
<title>Merge Span with style after forward delete having contenteditable</title>
5+
<title>Merge Span with style after backspace having contenteditable</title>
66
<script src="/resources/testharness.js"></script>
77
<script src="/resources/testharnessreport.js"></script>
88
<script src="/resources/testdriver.js"></script>
99
<script src="/resources/testdriver-vendor.js"></script>
1010
<script src="/resources/testdriver-actions.js"></script>
11-
<script src="../include/editor-test-utils.js"></script>
1211
</head>
1312
<body>
14-
<div contenteditable></div>
13+
<div contenteditable><h1><span style="background-color:red;">Back</span></h1>
14+
<h1><span style="background-color: red;">space</span></h1></div>
1515
<script>
1616
"use strict";
1717

18-
const utils =
19-
new EditorTestUtils(document.querySelector("div[contenteditable]"));
18+
const kDeleteKey = "\uE017";
19+
20+
function sendDeleteKey() {
21+
return new test_driver.Actions()
22+
.keyDown(kDeleteKey)
23+
.keyUp(kDeleteKey)
24+
.send();
25+
}
2026

2127
promise_test(async () => {
22-
utils.setupEditingHost(
23-
`<div contenteditable="true">
24-
<h1><span style="background-color:red;">Back[]</span></h1>
25-
<h1><span style="background-color:red;">space</span></h1>
26-
</div>`
27-
);
28-
await utils.sendDeleteKey();
29-
assert_in_array(
30-
utils.editingHost.innerHTML,
31-
[
32-
`<div contenteditable="true">
33-
<h1><span style="background-color:red;">Back</span><span style="background-color: red;">space</span></h1>
34-
</div>`
35-
],
28+
const editableDiv = document.querySelector("div[contenteditable]");
29+
const spaceSpan = editableDiv.querySelectorAll('span')[0];
30+
const range = document.createRange();
31+
const selection = window.getSelection();
32+
const textNode = spaceSpan.firstChild;
33+
range.setStart(textNode, 4);
34+
range.setEnd(textNode, 4);
35+
selection.removeAllRanges();
36+
selection.addRange(range);
37+
await sendDeleteKey();
38+
assert_equals(
39+
editableDiv.innerHTML,
40+
"<h1><span style=\"background-color:red;\">Back</span><span style=\"background-color: red;\">space</span></h1>",
3641
"Style is not preserved for the span after pressing backspace in contenteditable"
3742
);
3843
}, "waiting for command to execute");

editing/other/merge-span-with-style-after-pressing-enter-followed-by-backspace-in-contenteditable-div.html

Lines changed: 31 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -8,31 +8,44 @@
88
<script src="/resources/testdriver.js"></script>
99
<script src="/resources/testdriver-vendor.js"></script>
1010
<script src="/resources/testdriver-actions.js"></script>
11-
<script src="../include/editor-test-utils.js"></script>
1211
</head>
1312
<body>
14-
<div contenteditable></div>
13+
<div contenteditable><h1><span style="background-color:red;">Backspace</span></h1></div>
1514
<script>
1615
"use strict";
1716

18-
const utils =
19-
new EditorTestUtils(document.querySelector("div[contenteditable]"));
17+
const kBackspaceKey = "\uE003";
18+
const kEnterKey = "\uE007";
19+
20+
function sendBackspaceKey() {
21+
return new test_driver.Actions()
22+
.keyDown(kBackspaceKey)
23+
.keyUp(kBackspaceKey)
24+
.send();
25+
}
26+
27+
function sendEnterKey() {
28+
return new test_driver.Actions()
29+
.keyDown(kEnterKey)
30+
.keyUp(kEnterKey)
31+
.send();
32+
}
2033

2134
promise_test(async () => {
22-
utils.setupEditingHost(
23-
`<div contenteditable="true">
24-
<h1><span style="background-color:red;">Back[]space</span></h1>
25-
</div>`
26-
);
27-
await utils.sendEnterKey();
28-
await utils.sendBackspaceKey();
29-
assert_in_array(
30-
utils.editingHost.innerHTML,
31-
[
32-
`<div contenteditable="true">
33-
<h1><span style="background-color:red;">Back</span><span style="background-color: red;">space</span></h1>
34-
</div>`
35-
],
35+
const editableDiv = document.querySelector("div[contenteditable]");
36+
const spaceSpan = editableDiv.querySelector('span');
37+
const range = document.createRange();
38+
const selection = window.getSelection();
39+
const textNode = spaceSpan.firstChild;
40+
range.setStart(textNode, 4);
41+
range.setEnd(textNode, 4);
42+
selection.removeAllRanges();
43+
selection.addRange(range);
44+
await sendEnterKey();
45+
await sendBackspaceKey();
46+
assert_equals(
47+
editableDiv.innerHTML,
48+
"<h1><span style=\"background-color:red;\">Back</span><span style=\"background-color: red;\">space</span></h1>",
3649
"Style is not preserved for the span after pressing backspace in contenteditable"
3750
);
3851
}, "waiting for command to execute");

0 commit comments

Comments
 (0)