Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(408)

Side by Side Diff: third_party/WebKit/LayoutTests/shadow-dom/event-composed-path.html

Issue 2056213002: Add tests for retargeted event.target in LayoutTests/shadow-dom/ (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@events-1
Patch Set: rebased Created 4 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <script src="../resources/testharness.js"></script> 2 <script src="../resources/testharness.js"></script>
3 <script src="../resources/testharnessreport.js"></script> 3 <script src="../resources/testharnessreport.js"></script>
4 <script src="resources/shadow-dom.js"></script> 4 <script src="resources/shadow-dom.js"></script>
5 5
6 <div id="test1"> 6 <div id="test1">
7 <div id="d1"> 7 <div id="d1">
8 <div id="target"></div> 8 <div id="target"></div>
9 </div> 9 </div>
10 </div> 10 </div>
11 11
12 <script> 12 <script>
13 test(() => { 13 test(() => {
14 let n = createTestTree(test1); 14 let n = createTestTree(test1);
15 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true })); 15 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true }));
16 assert_event_path_equals(log, makeExpectedEventPathLog(['target', 'd1', 'test1 '])); 16 let path = ['target', 'd1', 'test1'];
17 assert_event_path_equals(log,
18 [['target', 'target', null, path],
19 ['d1', 'target', null, path],
20 ['test1', 'target', null, path]]);
17 }, 'Event Path without ShadowRoots.'); 21 }, 'Event Path without ShadowRoots.');
18 </script> 22 </script>
19 23
20 <div id="test2"> 24 <div id="test2">
21 <div id="host"> 25 <div id="host">
22 <template id="sr" data-mode="open"> 26 <template id="sr" data-mode="open">
23 <div id="target"></div> 27 <div id="target"></div>
24 </template> 28 </template>
25 </div> 29 </div>
26 </div> 30 </div>
27 31
28 <script> 32 <script>
29 test(() => { 33 test(() => {
30 let n = createTestTree(test2); 34 let n = createTestTree(test2);
31 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true })); 35 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true }));
32 assert_event_path_equals(log, makeExpectedEventPathLog(['target', 'sr', 'host' , 'test2'])); 36 let path = ['target', 'sr', 'host', 'test2'];
37 assert_event_path_equals(log,
38 [['target', 'target', null, path],
39 ['sr', 'target', null, path],
40 ['host', 'host', null, path],
41 ['test2', 'host', null, path]]);
33 }, 'Event Path with an open ShadowRoot.'); 42 }, 'Event Path with an open ShadowRoot.');
34 </script> 43 </script>
35 44
36 <div id="test3"> 45 <div id="test3">
37 <div id="host"> 46 <div id="host">
38 <template id="sr" data-mode="closed"> 47 <template id="sr" data-mode="closed">
39 <div id="target"></div> 48 <div id="target"></div>
40 </template> 49 </template>
41 </div> 50 </div>
42 </div> 51 </div>
43 52
44 <script> 53 <script>
45 test(() => { 54 test(() => {
46 let n = createTestTree(test3); 55 let n = createTestTree(test3);
47 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true })); 56 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true }));
48 let path = ['target','sr', 'host', 'test3']; 57 let path = ['target','sr', 'host', 'test3'];
49 let path1 = ['host', 'test3']; 58 let path1 = ['host', 'test3'];
50 assert_event_path_equals(log, [['target', null, path], 59 assert_event_path_equals(log, [['target', 'target', null, path],
51 ['sr', null, path], 60 ['sr', 'target', null, path],
52 ['host', null, path1], 61 ['host', 'host', null, path1],
53 ['test3', null, path1]]); 62 ['test3', 'host', null, path1]]);
54 }, 'Event Path with a closed ShadowRoot.'); 63 }, 'Event Path with a closed ShadowRoot.');
55 </script> 64 </script>
56 65
57 <div id="test4"> 66 <div id="test4">
58 <div id="host1"> 67 <div id="host1">
59 <template id="sr1" data-mode="open"> 68 <template id="sr1" data-mode="open">
60 <div id="host2"> 69 <div id="host2">
61 <template id="sr2" data-mode="open"> 70 <template id="sr2" data-mode="open">
62 <div id="target"></div> 71 <div id="target"></div>
63 </template> 72 </template>
64 </div> 73 </div>
65 </template> 74 </template>
66 </div> 75 </div>
67 </div> 76 </div>
68 77
69 <script> 78 <script>
70 test(() => { 79 test(() => {
71 let n = createTestTree(test4); 80 let n = createTestTree(test4);
72 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true })); 81 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true }));
73 assert_event_path_equals(log, makeExpectedEventPathLog(['target', 'sr2', 'host 2', 'sr1', 'host1', 'test4'])); 82 let path = ['target', 'sr2', 'host2', 'sr1', 'host1', 'test4'];
83 assert_event_path_equals(log, [['target', 'target', null, path],
84 ['sr2', 'target', null, path],
85 ['host2', 'host2', null, path],
86 ['sr1', 'host2', null, path],
87 ['host1', 'host1', null, path],
88 ['test4', 'host1', null, path]]);
74 }, 'Event Path with nested ShadowRoots: open > open.'); 89 }, 'Event Path with nested ShadowRoots: open > open.');
75 </script> 90 </script>
76 91
77 <div id="test5"> 92 <div id="test5">
78 <div id="host1"> 93 <div id="host1">
79 <template id="sr1" data-mode="open"> 94 <template id="sr1" data-mode="open">
80 <div id="host2"> 95 <div id="host2">
81 <template id="sr2" data-mode="closed"> 96 <template id="sr2" data-mode="closed">
82 <div id="target"></div> 97 <div id="target"></div>
83 </template> 98 </template>
84 </div> 99 </div>
85 </template> 100 </template>
86 </div> 101 </div>
87 </div> 102 </div>
88 103
89 <script> 104 <script>
90 test(() => { 105 test(() => {
91 let n = createTestTree(test5); 106 let n = createTestTree(test5);
92 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true })); 107 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true }));
93 let path = ['target', 'sr2', 'host2', 'sr1', 'host1', 'test5']; 108 let path = ['target', 'sr2', 'host2', 'sr1', 'host1', 'test5'];
94 let path1 = ['host2', 'sr1', 'host1', 'test5']; 109 let path1 = ['host2', 'sr1', 'host1', 'test5'];
95 assert_event_path_equals(log, [['target', null, path], 110 assert_event_path_equals(log, [['target', 'target', null, path],
96 ['sr2', null, path], 111 ['sr2', 'target', null, path],
97 ['host2', null, path1], 112 ['host2', 'host2', null, path1],
98 ['sr1', null, path1], 113 ['sr1', 'host2', null, path1],
99 ['host1', null, path1], 114 ['host1', 'host1', null, path1],
100 ['test5', null, path1]]); 115 ['test5', 'host1', null, path1]]);
101 }, 'Event Path with nested ShadowRoots: open > closed.'); 116 }, 'Event Path with nested ShadowRoots: open > closed.');
102 </script> 117 </script>
103 118
104 <div id="test6"> 119 <div id="test6">
105 <div id="host1"> 120 <div id="host1">
106 <template id="sr1" data-mode="closed"> 121 <template id="sr1" data-mode="closed">
107 <div id="host2"> 122 <div id="host2">
108 <template id="sr2" data-mode="open"> 123 <template id="sr2" data-mode="open">
109 <div id="target"></div> 124 <div id="target"></div>
110 </template> 125 </template>
111 </div> 126 </div>
112 </template> 127 </template>
113 </div> 128 </div>
114 </div> 129 </div>
115 130
116 <script> 131 <script>
117 test(() => { 132 test(() => {
118 let n = createTestTree(test6); 133 let n = createTestTree(test6);
119 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true })); 134 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true }));
120 let path = ['target', 'sr2', 'host2', 'sr1', 'host1', 'test6']; 135 let path = ['target', 'sr2', 'host2', 'sr1', 'host1', 'test6'];
121 let path1 = ['host1', 'test6']; 136 let path1 = ['host1', 'test6'];
122 assert_event_path_equals(log, [['target', null, path], 137 assert_event_path_equals(log, [['target', 'target', null, path],
123 ['sr2', null, path], 138 ['sr2', 'target', null, path],
124 ['host2', null, path], 139 ['host2', 'host2', null, path],
125 ['sr1', null, path], 140 ['sr1', 'host2', null, path],
126 ['host1', null, path1], 141 ['host1', 'host1', null, path1],
127 ['test6', null, path1]]); 142 ['test6', 'host1', null, path1]]);
128 }, 'Event Path with nested ShadowRoots: closed > open.'); 143 }, 'Event Path with nested ShadowRoots: closed > open.');
129 </script> 144 </script>
130 145
131 <div id="test7"> 146 <div id="test7">
132 <div id="host1"> 147 <div id="host1">
133 <template id="sr1" data-mode="closed"> 148 <template id="sr1" data-mode="closed">
134 <div id="host2"> 149 <div id="host2">
135 <template id="sr2" data-mode="closed"> 150 <template id="sr2" data-mode="closed">
136 <div id="target"></div> 151 <div id="target"></div>
137 </template> 152 </template>
138 </div> 153 </div>
139 </template> 154 </template>
140 </div> 155 </div>
141 </div> 156 </div>
142 157
143 <script> 158 <script>
144 test(() => { 159 test(() => {
145 let n = createTestTree(test7); 160 let n = createTestTree(test7);
146 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true })); 161 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true }));
147 let path = ['target', 'sr2', 'host2', 'sr1', 'host1', 'test7']; 162 let path = ['target', 'sr2', 'host2', 'sr1', 'host1', 'test7'];
148 let path1 = ['host2', 'sr1', 'host1', 'test7']; 163 let path1 = ['host2', 'sr1', 'host1', 'test7'];
149 let path2 = ['host1', 'test7']; 164 let path2 = ['host1', 'test7'];
150 assert_event_path_equals(log, [['target', null, path], 165 assert_event_path_equals(log, [['target', 'target', null, path],
151 ['sr2', null, path], 166 ['sr2', 'target', null, path],
152 ['host2', null, path1], 167 ['host2', 'host2', null, path1],
153 ['sr1', null, path1], 168 ['sr1', 'host2', null, path1],
154 ['host1', null, path2], 169 ['host1', 'host1', null, path2],
155 ['test7', null, path2]]); 170 ['test7', 'host1', null, path2]]);
156 }, 'Event Path with nested ShadowRoots: closed > closed.'); 171 }, 'Event Path with nested ShadowRoots: closed > closed.');
157 </script> 172 </script>
158 173
159 <div id="test8"> 174 <div id="test8">
160 <div id="host1"> 175 <div id="host1">
161 <template id="sr1" data-mode="open"> 176 <template id="sr1" data-mode="open">
162 <slot id="slot"></slot> 177 <slot id="slot"></slot>
163 </template> 178 </template>
164 <div id="target"></div> 179 <div id="target"></div>
165 </div> 180 </div>
166 </div> 181 </div>
167 182
168 <script> 183 <script>
169 test(() => { 184 test(() => {
170 let n = createTestTree(test8); 185 let n = createTestTree(test8);
171 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true })); 186 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true }));
172 let path = ['target', 'slot', 'sr1', 'host1', 'test8']; 187 let path = ['target','slot', 'sr1', 'host1', 'test8'];
173 assert_event_path_equals(log, makeExpectedEventPathLog(path)); 188 assert_event_path_equals(log, [['target', 'target', null, path],
189 ['slot', 'target', null, path],
190 ['sr1', 'target', null, path],
191 ['host1', 'target', null, path],
192 ['test8', 'target', null, path]]);
174 }, 'Event Path with a slot in an open Shadow Root.'); 193 }, 'Event Path with a slot in an open Shadow Root.');
175 </script> 194 </script>
176 195
177 <div id="test9"> 196 <div id="test9">
178 <div id="host1"> 197 <div id="host1">
179 <template id="sr1" data-mode="closed"> 198 <template id="sr1" data-mode="closed">
180 <slot id="slot"></slot> 199 <slot id="slot"></slot>
181 </template> 200 </template>
182 <div id="target"></div> 201 <div id="target"></div>
183 </div> 202 </div>
184 </div> 203 </div>
185 204
186 <script> 205 <script>
187 test(() => { 206 test(() => {
188 let n = createTestTree(test9); 207 let n = createTestTree(test9);
189 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true })); 208 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true }));
190 let path = ['target', 'slot', 'sr1', 'host1', 'test9']; 209 let path = ['target', 'slot', 'sr1', 'host1', 'test9'];
191 let path1 = ['target', 'host1', 'test9']; 210 let path1 = ['target', 'host1', 'test9'];
192 assert_event_path_equals(log, [['target', null, path1], 211 assert_event_path_equals(log, [['target', 'target', null, path1],
193 ['slot', null, path], 212 ['slot', 'target', null, path],
194 ['sr1', null, path], 213 ['sr1', 'target', null, path],
195 ['host1', null, path1], 214 ['host1', 'target', null, path1],
196 ['test9', null, path1]]); 215 ['test9', 'target', null, path1]]);
197 }, 'Event Path with a slot in a closed Shadow Root.'); 216 }, 'Event Path with a slot in a closed Shadow Root.');
198 </script> 217 </script>
199 218
200 <div id="test10"> 219 <div id="test10">
201 <div id="host1"> 220 <div id="host1">
202 <template id="sr1" data-mode="open"> 221 <template id="sr1" data-mode="open">
203 <div id="host2"> 222 <div id="host2">
204 <template id="sr2" data-mode="open"> 223 <template id="sr2" data-mode="open">
205 <slot id="slot2"></slot> 224 <slot id="slot2"></slot>
206 </template> 225 </template>
207 <slot id="slot1"></slot> 226 <slot id="slot1"></slot>
208 </div> 227 </div>
209 </template> 228 </template>
210 <div id="target"></div> 229 <div id="target"></div>
211 </div> 230 </div>
212 </div> 231 </div>
213 232
214 <script> 233 <script>
215 test(() => { 234 test(() => {
216 let n = createTestTree(test10); 235 let n = createTestTree(test10);
217 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true })); 236 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true }));
218 let path = ['target', 'slot1', 'slot2', 'sr2', 'host2', 'sr1', 'host1', 'test1 0']; 237 let path = ['target','slot1', 'slot2', 'sr2', 'host2', 'sr1', 'host1', 'test10 '];
219 assert_event_path_equals(log, makeExpectedEventPathLog(path)); 238 assert_event_path_equals(log, [['target', 'target', null, path],
239 ['slot1', 'target', null, path],
240 ['slot2', 'target', null, path],
241 ['sr2', 'target', null, path],
242 ['host2', 'target', null, path],
243 ['sr1', 'target', null, path],
244 ['host1', 'target', null, path],
245 ['test10', 'target', null, path]]);
220 }, 'Event Path with slots in nested ShadowRoots: open > open.'); 246 }, 'Event Path with slots in nested ShadowRoots: open > open.');
221 </script> 247 </script>
222 248
223 <div id="test11"> 249 <div id="test11">
224 <div id="host1"> 250 <div id="host1">
225 <template id="sr1" data-mode="closed"> 251 <template id="sr1" data-mode="closed">
226 <div id="host2"> 252 <div id="host2">
227 <template id="sr2" data-mode="closed"> 253 <template id="sr2" data-mode="closed">
228 <slot id="slot2"></slot> 254 <slot id="slot2"></slot>
229 </template> 255 </template>
230 <slot id="slot1"></slot> 256 <slot id="slot1"></slot>
231 </div> 257 </div>
232 </template> 258 </template>
233 <div id="target"></div> 259 <div id="target"></div>
234 </div> 260 </div>
235 </div> 261 </div>
236 262
237 <script> 263 <script>
238 test(() => { 264 test(() => {
239 let n = createTestTree(test11); 265 let n = createTestTree(test11);
240 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true })); 266 let log = dispatchEventWithLog(n, n.target, new Event('my-event', { bubbles: t rue, composed: true }));
241 let path = ['target', 'slot1', 'slot2', 'sr2', 'host2', 'sr1', 'host1', 'test1 1']; 267 let path = ['target', 'slot1', 'slot2', 'sr2', 'host2', 'sr1', 'host1', 'test1 1'];
242 let path1 = ['target', 'slot1', 'host2', 'sr1', 'host1', 'test11']; 268 let path1 = ['target', 'slot1', 'host2', 'sr1', 'host1', 'test11'];
243 let path2 = ['target', 'host1', 'test11']; 269 let path2 = ['target', 'host1', 'test11'];
244 assert_event_path_equals(log, [['target', null, path2], 270 assert_event_path_equals(log, [['target', 'target', null, path2],
245 ['slot1', null, path1], 271 ['slot1', 'target', null, path1],
246 ['slot2', null, path], 272 ['slot2', 'target', null, path],
247 ['sr2', null, path], 273 ['sr2', 'target', null, path],
248 ['host2', null, path1], 274 ['host2', 'target', null, path1],
249 ['sr1', null, path1], 275 ['sr1', 'target', null, path1],
250 ['host1', null, path2], 276 ['host1', 'target', null, path2],
251 ['test11', null, path2]]); 277 ['test11', 'target', null, path2]]);
252 }, 'Event Path with slots in nested ShadowRoots: closed > closed.'); 278 }, 'Event Path with slots in nested ShadowRoots: closed > closed.');
253 </script> 279 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698