Google Git
Sign in
chromium / external / w3c / web-platform-tests / 57e5278fd9fa7a958fd6b1b69ea8139732e08923 / . / inert / inert-inlines-around-selection-range-in-contenteditable.html
blob: c22c798084dcdb5123f5bf88a3bbe93f831cee46 [file] [log] [blame]
Masayuki Nakano3b7244a2023-02-15 22:14:27[diff] [blame]1<!doctype html>
2<html>
3<head>
4<meta charset="utf-8">
5<title>Delete editable range around elements having inert attribute</title>
6<script src="/resources/testharness.js"></script>
7<script src="/resources/testharnessreport.js"></script>
8<script src="../editing/include/editor-test-utils.js"></script>
9<script>
10document.addEventListener("DOMContentLoaded", () => {
11 const editingHost = document.querySelector("div[contenteditable]");
12 const utils = new EditorTestUtils(editingHost);
13
14 test(t => {
15 utils.setupEditingHost(t.name, { selection: "setBaseAndExtent" });
16 const initialInnerHTML = editingHost.innerHTML;
17 document.execCommand("delete");
18 const desc = `execCommand("delete") at ${t.name}`
19 assert_equals(
20 editingHost.innerHTML,
21 initialInnerHTML,
22 `${desc}: <span> content should not be deleted because anchor node of Selection is in the <span inert>`
23 );
24 }, "<span inert>a[bc</span><span>de]f</span>");
25
26 test(t => {
27 utils.setupEditingHost(t.name, { selection: "setBaseAndExtent" });
28 const initialInnerHTML = editingHost.innerHTML;
29 document.execCommand("delete");
30 const desc = `execCommand("delete") at ${t.name}`
31 assert_equals(
32 !!editingHost.querySelector("span[inert]"),
33 true,
34 `${desc}: <span inert> should not be deleted`
35 );
36 assert_equals(
37 editingHost.querySelector("span[inert]").textContent,
38 "def",
39 `${desc}: <span inert> content should not be deleted`
40 );
41 assert_not_equals(
42 editingHost.innerHTML,
43 initialInnerHTML,
44 `${desc}: <span> content should be deleted (but how to handle it is not tested here)`
45 );
46 }, "<span>a[bc</span><span inert>de]f</span>");
47
48 test(t => {
49 utils.setupEditingHost(t.name, { selection: "setBaseAndExtent-reverse" });
50 const initialInnerHTML = editingHost.innerHTML;
51 document.execCommand("delete");
52 const desc = `execCommand("delete") at ${t.name} (selection range direction is inverted)`
53 assert_equals(
54 !!editingHost.querySelector("span[inert]"),
55 true,
56 `${desc}: <span inert> should not be deleted`
57 );
58 assert_equals(
59 editingHost.querySelector("span[inert]").textContent,
60 "def",
61 `${desc}: <span inert> content should not be deleted`
62 );
63 assert_not_equals(
64 editingHost.innerHTML,
65 initialInnerHTML,
66 `${desc}: <span> content should be deleted (but how to handle it is not tested here)`
67 );
68 }, "<span inert>d[ef</span><span>ab]c</span>");
69
70 test(t => {
71 utils.setupEditingHost(t.name, { selection: "setBaseAndExtent-reverse" });
72 const initialInnerHTML = editingHost.innerHTML;
73 document.execCommand("delete");
74 const desc = `execCommand("delete") at ${t.name} (selection range direction is inverted)`
75 assert_equals(
76 editingHost.innerHTML,
77 initialInnerHTML,
78 `${desc}: <span> content should not be deleted because anchor node of Selection is in the <span inert>`
79 );
80 }, "<span>d[ef</span><span inert>ab]c</span>");
81
82 test(t => {
83 utils.setupEditingHost(t.name, { selection: "setBaseAndExtent" });
84 document.execCommand("delete");
85 const desc = `execCommand("delete") at ${t.name}`
86 assert_equals(editingHost.innerHTML, "af", `${desc}: <span inert> should be deleted`);
87 }, "a[bc<span inert>XYZ</span>de]f");
Masayuki Nakano50b9b462023-02-23 15:16:47[diff] [blame]88
89 test(t => {
90 utils.setupEditingHost(t.name, { selection: "setBaseAndExtent" });
91 const initialInnerHTML = editingHost.innerHTML;
92 document.execCommand("delete");
93 const desc = `execCommand("delete") at ${t.name}`
94 assert_equals(
95 editingHost.innerHTML,
96 initialInnerHTML,
97 `${desc}: <span> content should not be deleted because anchor node of Selection is in the <span inert>`
98 );
99 }, `<span inert style="display:contents">a[bc</span><span>de]f</span>`);
100
101 test(t => {
102 utils.setupEditingHost(t.name, { selection: "setBaseAndExtent" });
103 const initialInnerHTML = editingHost.innerHTML;
104 document.execCommand("delete");
105 const desc = `execCommand("delete") at ${t.name}`
106 assert_equals(
107 editingHost.innerHTML,
108 initialInnerHTML,
109 `${desc}: <span> content should not be deleted because anchor node of Selection is in the <span inert>`
110 );
111 }, `<span inert style="display:contents">{abc</span><span>de]f</span>`);
112
113 test(t => {
114 utils.setupEditingHost(t.name, { selection: "setBaseAndExtent" });
115 const initialInnerHTML = editingHost.innerHTML;
116 document.execCommand("delete");
117 const desc = `execCommand("delete") at ${t.name}`
118 assert_equals(
119 editingHost.innerHTML,
120 initialInnerHTML,
121 `${desc}: <span> content should not be deleted because anchor node of Selection is in the <span inert>`
122 );
123 }, `<span inert><span style="display:contents">a[bc</span></span><span>de]f</span>`);
124
125 test(t => {
126 utils.setupEditingHost(t.name, { selection: "setBaseAndExtent" });
127 const initialInnerHTML = editingHost.innerHTML;
128 document.execCommand("delete");
129 const desc = `execCommand("delete") at ${t.name}`
130 assert_equals(
131 editingHost.innerHTML,
132 initialInnerHTML,
133 `${desc}: <span> content should not be deleted because anchor node of Selection is in the <span inert>`
134 );
135 }, `<span inert><span style="display:contents">{abc</span></span><span>de]f</span>`);
136
137 test(t => {
138 utils.setupEditingHost(t.name, { selection: "setBaseAndExtent" });
139 const initialInnerHTML = editingHost.innerHTML;
140 document.execCommand("delete");
141 const desc = `execCommand("delete") at ${t.name}`
142 assert_equals(
143 editingHost.innerHTML,
144 initialInnerHTML,
145 `${desc}: <span> content should not be deleted because anchor node of Selection is in the <span inert>`
146 );
147 }, `<span inert style="display:none">a[bc</span><span>de]f</span>`);
148
149 test(t => {
150 utils.setupEditingHost(t.name, { selection: "setBaseAndExtent" });
151 const initialInnerHTML = editingHost.innerHTML;
152 document.execCommand("delete");
153 const desc = `execCommand("delete") at ${t.name}`
154 assert_equals(
155 editingHost.innerHTML,
156 initialInnerHTML,
157 `${desc}: <span> content should not be deleted because anchor node of Selection is in the <span inert>`
158 );
159 }, `<span inert style="display:none">{abc</span><span>de]f</span>`);
160
161 test(t => {
162 utils.setupEditingHost(t.name, { selection: "setBaseAndExtent" });
163 const initialInnerHTML = editingHost.innerHTML;
164 document.execCommand("delete");
165 const desc = `execCommand("delete") at ${t.name}`
166 assert_equals(
167 editingHost.innerHTML,
168 initialInnerHTML,
169 `${desc}: <span> content should not be deleted because anchor node of Selection is in the <span inert>`
170 );
171 }, `<span inert><span style="display:none">a[bc</span></span><span>de]f</span>`);
172
173 test(t => {
174 utils.setupEditingHost(t.name, { selection: "setBaseAndExtent" });
175 const initialInnerHTML = editingHost.innerHTML;
176 document.execCommand("delete");
177 const desc = `execCommand("delete") at ${t.name}`
178 assert_equals(
179 editingHost.innerHTML,
180 initialInnerHTML,
181 `${desc}: <span> content should not be deleted because anchor node of Selection is in the <span inert>`
182 );
183 }, `<span inert><span style="display:none">{abc</span></span><span>de]f</span>`);
Masayuki Nakano3b7244a2023-02-15 22:14:27[diff] [blame]184});
185</script>
186</head>
187<body>
188<div contenteditable></div>
189</body>
190</html>