| OLD | NEW |
|---|
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <title>Shadow DOM: Firing an event with relatedTarget inside a shadow tree</
title> | 4 <title>Shadow DOM: Firing an event with relatedTarget inside a shadow tree</
title> |
| 5 <meta name="author" title="Ryosuke Niwa" href="mailto:rniwa@webkit.org"> | 5 <meta name="author" title="Ryosuke Niwa" href="mailto:rniwa@webkit.org"> |
| 6 <meta name="assert" content="The retargeting algorithm is used to determine
relative targets"> | 6 <meta name="assert" content="The retargeting algorithm is used to determine
relative targets"> |
| 7 <link rel="help" href="https://w3c.github.io/webcomponents/spec/shadow/#reta
rgeting-relatedtarget"> | 7 <link rel="help" href="https://w3c.github.io/webcomponents/spec/shadow/#reta
rgeting-relatedtarget"> |
| 8 <script src="/resources/testharness.js"></script> | 8 <script src="/resources/testharness.js"></script> |
| 9 <script src="/resources/testharnessreport.js"></script> | 9 <script src="/resources/testharnessreport.js"></script> |
| 10 <script src="resources/event-path-test-helpers.js"></script> | 10 <script src="resources/event-path-test-helpers.js"></script> |
| (...skipping 171 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 182 test(function () { | 182 test(function () { |
| 183 var nodes = createTestTree(mode); | 183 var nodes = createTestTree(mode); |
| 184 | 184 |
| 185 log = dispatchEventWithLog(nodes, nodes.A1a, new MouseEvent('foo
', {bubbles: true, composed: true, relatedTarget: nodes.B1a})); | 185 log = dispatchEventWithLog(nodes, nodes.A1a, new MouseEvent('foo
', {bubbles: true, composed: true, relatedTarget: nodes.B1a})); |
| 186 | 186 |
| 187 assert_array_equals(log.eventPath, | 187 assert_array_equals(log.eventPath, |
| 188 ['A1a', 'A1-SR', 'A1', 'A-SR', 'A'], 'The event path must be
correct.'); | 188 ['A1a', 'A1-SR', 'A1', 'A-SR', 'A'], 'The event path must be
correct.'); |
| 189 assert_array_equals(log.relatedTargets, | 189 assert_array_equals(log.relatedTargets, |
| 190 ['B', 'B', 'B', 'B', 'B'], 'The related targets must be corr
ect.'); | 190 ['B', 'B', 'B', 'B', 'B'], 'The related targets must be corr
ect.'); |
| 191 | 191 |
| 192 }, 'Firing an event at B1a with relatedNode at A1a with ' + mode + '
mode shadow trees'); | 192 }, 'Firing an event at A1a with relatedNode at B1a with ' + mode + '
mode shadow trees'); |
| 193 } | 193 } |
| 194 | 194 |
| 195 testEventAtA1aWithB1a('open'); | 195 testEventAtA1aWithB1a('open'); |
| 196 testEventAtA1aWithB1a('closed'); | 196 testEventAtA1aWithB1a('closed'); |
| 197 | 197 |
| 198 /* | 198 /* |
| 199 -SR: ShadowRoot -S: Slot target: (~) relatedTarget: [~] *: indicates
start digit: event path order | 199 -SR: ShadowRoot -S: Slot target: (~) relatedTarget: [~] *: indicates
start digit: event path order |
| 200 A (8) ----------------------------------- A-SR (7) | 200 A (8) ----------------------------------- A-SR (7) |
| 201 + B (5) ----- B-SR (4) + A2-S (6) | 201 + B (5) ----- B-SR (4) + A2-S (6) |
| 202 + C + B1 (3) ----- B1-SR (2) | 202 + C + B1 (3) ----- B1-SR (2) |
| 203 + D --- D-SR + B1a (*; 0) + B1b ------- B1b-SR | 203 + D --- D-SR + B1a (*; 0) + B1b ------- B1b-SR |
| 204 + D1 + B1c-S (1) + B1b1 | 204 + D1 + B1c-S (1) + B1b1 |
| 205 + B1b2 | 205 + B1b2 |
| 206 A1 [0-6] --- A1-SR | 206 A1 [0-6] --- A1-SR |
| 207 + A1a [*] | 207 + A1a [*] |
| 208 */ | 208 */ |
| 209 function testEventAtB1aWithDetachedA1a(mode) { | 209 function testEventAtB1aWithDetachedA1a(mode) { |
| 210 test(function () { | 210 test(function () { |
| 211 var nodes = createTestTree(mode); | 211 var nodes = createTestTree(mode); |
| 212 | 212 |
| 213 nodes['A-SR'].removeChild(nodes.A1); | 213 nodes['A-SR'].removeChild(nodes.A1); |
| 214 log = dispatchEventWithLog(nodes, nodes.B1a, new MouseEvent('foo
', {bubbles: true, composed: true, relatedTarget: nodes.A1a})); | 214 log = dispatchEventWithLog(nodes, nodes.B1a, new MouseEvent('foo
', {bubbles: true, composed: true, relatedTarget: nodes.A1a})); |
| 215 | 215 |
| 216 assert_array_equals(log.eventPath, | 216 assert_array_equals(log.eventPath, |
| 217 ['B1a', 'B1c-S', 'B1-SR', 'B1', 'B-SR', 'B', 'A2-S', 'A-SR',
'A'], 'The event path must be correct.'); | 217 ['B1a', 'B1c-S', 'B1-SR', 'B1', 'B-SR', 'B', 'A2-S', 'A-SR',
'A'], 'The event path must be correct.'); |
| 218 assert_array_equals(log.relatedTargets, | 218 assert_array_equals(log.relatedTargets, |
| 219 ['A1', 'A1', 'A1', 'A1', 'A1', 'A1', 'A1', 'A1', 'A1'], 'The
related targets must be correct.'); | 219 ['A1', 'A1', 'A1', 'A1', 'A1', 'A1', 'A1', 'A1', 'A1'], 'The
related targets must be correct.'); |
| 220 | 220 |
| 221 }, 'Firing an event at B1a with relatedNode at A1a with ' + mode + '
mode shadow trees'); | 221 }, 'Firing an event at B1a with relatedNode at A1a (detached) with '
+ mode + ' mode shadow trees'); |
| 222 } | 222 } |
| 223 | 223 |
| 224 testEventAtB1aWithDetachedA1a('open'); | 224 testEventAtB1aWithDetachedA1a('open'); |
| 225 testEventAtB1aWithDetachedA1a('closed'); | 225 testEventAtB1aWithDetachedA1a('closed'); |
| 226 | 226 |
| 227 /* | 227 /* |
| 228 -SR: ShadowRoot -S: Slot target: (~) relatedTarget: [~] *: indicates
start digit: event path order | 228 -SR: ShadowRoot -S: Slot target: (~) relatedTarget: [~] *: indicates
start digit: event path order |
| 229 A ----------------------------------- A-SR | 229 A ----------------------------------- A-SR |
| 230 + B [0-3] ----- B-SR + A2-S | 230 + B [0-3] ----- B-SR + A2-S |
| 231 + C + B1 -------- B1-SR | 231 + C + B1 -------- B1-SR |
| 232 + D --- D-SR + B1a [*] + B1b --- B1b-SR | 232 + D --- D-SR + B1a [*] + B1b --- B1b-SR |
| 233 + D1 + B1c-S + B1b1 | 233 + D1 + B1c-S + B1b1 |
| 234 + B1b2 | 234 + B1b2 |
| 235 A1 (2) --- A1-SR (1) | 235 A1 (2) --- A1-SR (1) |
| 236 + A1a (*; 0) | 236 + A1a (*; 0) |
| 237 */ | 237 */ |
| 238 function testEventAtA1aWithDetachedB1a(mode) { | 238 function testEventAtA1aWithDetachedB1a(mode) { |
| 239 test(function () { | 239 test(function () { |
| 240 var nodes = createTestTree(mode); | 240 var nodes = createTestTree(mode); |
| 241 | 241 |
| 242 nodes['A-SR'].removeChild(nodes.A1); | 242 nodes['A-SR'].removeChild(nodes.A1); |
| 243 log = dispatchEventWithLog(nodes, nodes.A1a, new MouseEvent('foo
', {bubbles: true, composed: true, relatedTarget: nodes.B1a})); | 243 log = dispatchEventWithLog(nodes, nodes.A1a, new MouseEvent('foo
', {bubbles: true, composed: true, relatedTarget: nodes.B1a})); |
| 244 | 244 |
| 245 assert_array_equals(log.eventPath, ['A1a', 'A1-SR', 'A1'],
'The event path must be correct.'); | 245 assert_array_equals(log.eventPath, ['A1a', 'A1-SR', 'A1'],
'The event path must be correct.'); |
| 246 assert_array_equals(log.relatedTargets, ['B', 'B', 'B' ],
'The related targets must be correct.'); | 246 assert_array_equals(log.relatedTargets, ['B', 'B', 'B' ],
'The related targets must be correct.'); |
| 247 | 247 |
| 248 }, 'Firing an event at B1a with relatedNode at A1a with ' + mode + '
mode shadow trees'); | 248 }, 'Firing an event at A1a with relatedNode at B1a (detached) with '
+ mode + ' mode shadow trees'); |
| 249 } | 249 } |
| 250 | 250 |
| 251 testEventAtA1aWithDetachedB1a('open'); | 251 testEventAtA1aWithDetachedB1a('open'); |
| 252 testEventAtA1aWithDetachedB1a('closed'); | 252 testEventAtA1aWithDetachedB1a('closed'); |
| 253 | 253 |
| 254 </script> | 254 </script> |
| 255 </body> | 255 </body> |
| 256 </html> | 256 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2697453005:
Import wpt@758b3b4cfa805067f36121333ba031e583d3a62c (Closed)
