| OLD | NEW |
|---|
| (Empty) |
| 1 <!DOCTYPE html> | |
| 2 <script src="../resources/testharness.js"></script> | |
| 3 <script src="../resources/testharnessreport.js"></script> | |
| 4 <script src="resources/shadow-dom.js"></script> | |
| 5 | |
| 6 <div id="test1"> | |
| 7 <div id="target"></div> | |
| 8 <div id="related"></div> | |
| 9 </div> | |
| 10 | |
| 11 <script> | |
| 12 test(() => { | |
| 13 let n = createTestTree(test1); | |
| 14 let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbl
es: true, composed: true, relatedTarget: n.related })); | |
| 15 let path = ['target', 'test1']; | |
| 16 assert_event_path_equals(log, [['target', 'target', 'related', path], | |
| 17 ['test1', 'target', 'related', path]]); | |
| 18 }, 'Event path for an event with a relatedTarget. relatedTarget != target.'); | |
| 19 </script> | |
| 20 | |
| 21 <script> | |
| 22 test(() => { | |
| 23 let n = createTestTree(test1); | |
| 24 let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbl
es: true, composed: true, relatedTarget: n.target })); | |
| 25 let path = ['target', 'test1']; | |
| 26 assert_event_path_equals(log, [['target', 'target', 'target', path], | |
| 27 ['test1', 'target', 'target', path]]); | |
| 28 }, 'Event path for an event with a relatedTarget. Event shoul be dispatched if 1
) target and relatedTarget are same, and 2) they are not in a shadow tree.'); | |
| 29 </script> | |
| 30 | |
| 31 <div id="test2"> | |
| 32 <div id="host"> | |
| 33 <template id="sr" data-mode="open"> | |
| 34 <div id="target"></div> | |
| 35 <div id="related"></div> | |
| 36 </template> | |
| 37 </div> | |
| 38 </div> | |
| 39 | |
| 40 <script> | |
| 41 test(() => { | |
| 42 let n = createTestTree(test2); | |
| 43 let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbl
es: true, composed: true, relatedTarget: n.related })); | |
| 44 let path = ['target', 'sr']; | |
| 45 assert_event_path_equals(log, [['target', 'target', 'related', path], | |
| 46 ['sr', 'target', 'related', path]]); | |
| 47 }, 'Event path for an event with a relatedTarget. Event should stop at the shado
w root'); | |
| 48 | |
| 49 test(() => { | |
| 50 let n = createTestTree(test2); | |
| 51 let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbl
es: true, composed: true, relatedTarget: n.target })); | |
| 52 assert_event_path_equals(log, []); | |
| 53 }, 'Event path for an event with a relatedTarget. Event should not be dispatched
if 1) target and relatedTarget are same, and 2) both are in a shadow tree.'); | |
| 54 </script> | |
| 55 | |
| 56 <div id="test3_1"> | |
| 57 <div id="host1"> | |
| 58 <template id="sr1" data-mode="open"> | |
| 59 <div id="target1"></div> | |
| 60 </template> | |
| 61 </div> | |
| 62 </div> | |
| 63 | |
| 64 <div id="test3_2"> | |
| 65 <div id="host2"> | |
| 66 <template id="sr2" data-mode="open"> | |
| 67 <div id="target2"></div> | |
| 68 </template> | |
| 69 </div> | |
| 70 </div> | |
| 71 | |
| 72 <script> | |
| 73 test(() => { | |
| 74 let n1 = createTestTree(test3_1); | |
| 75 let n2 = createTestTree(test3_2); | |
| 76 let log = dispatchEventWithLog(n1, n1.target1, new FocusEvent('my-focus', { bu
bbles: true, composed: true, relatedTarget: n2.target2 })); | |
| 77 let path = ['target1', 'sr1', 'host1', 'test3_1']; | |
| 78 assert_event_path_equals(log, [['target1', 'target1', 'host2', path], | |
| 79 ['sr1', 'target1', 'host2', path], | |
| 80 ['host1', 'host1', 'host2', path], | |
| 81 ['test3_1', 'host1', 'host2', path]]); | |
| 82 }, 'Event path for an event with a relatedTarget. target and relaterTarget do no
t share any shadow-including ancestor. target is in a shadow tree.'); | |
| 83 | |
| 84 test(() => { | |
| 85 let n1 = createTestTree(test3_1); | |
| 86 let n2 = createTestTree(test3_2); | |
| 87 let log = dispatchEventWithLog(n1, n1.host1, new FocusEvent('my-focus', { bubb
les: true, composed: true, relatedTarget: n2.target2 })); | |
| 88 let path = ['host1', 'test3_1']; | |
| 89 assert_event_path_equals(log, [['host1', 'host1', 'host2', path], | |
| 90 ['test3_1', 'host1', 'host2', path]]); | |
| 91 }, 'Event path for an event with a relatedTarget. target and relaterTarget do no
t share any shadow-including ancestor. target is not in a shadow tree'); | |
| 92 </script> | |
| 93 | |
| 94 <div id="test4"> | |
| 95 <div id="host1"> | |
| 96 <template id="sr1" data-mode="open"> | |
| 97 <div id="host2"> | |
| 98 <template id="sr2" data-mode="open"> | |
| 99 <div id="target"></div> | |
| 100 </template> | |
| 101 </div> | |
| 102 <div id="host3"> | |
| 103 <template id="sr3" data-mode="open"> | |
| 104 <div id="related"></div> | |
| 105 </template> | |
| 106 </div> | |
| 107 </template> | |
| 108 </div> | |
| 109 </div> | |
| 110 | |
| 111 <script> | |
| 112 test(() => { | |
| 113 let n = createTestTree(test4); | |
| 114 let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbl
es: true, composed: true, relatedTarget: n.related })); | |
| 115 let path = ['target', 'sr2', 'host2', 'sr1']; | |
| 116 assert_event_path_equals(log, [['target', 'target', 'host3', path], | |
| 117 ['sr2', 'target', 'host3', path], | |
| 118 ['host2', 'host2', 'host3', path], | |
| 119 ['sr1', 'host2', 'host3', path]]); | |
| 120 }, 'Event path for an event with a relatedTarget. target and relaterTarget share
the same shadow-including ancestor. Both are in shadow trees.'); | |
| 121 | |
| 122 test(() => { | |
| 123 let n = createTestTree(test4); | |
| 124 let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbl
es: true, composed: true, relatedTarget: n.host1 })); | |
| 125 let path = ['target', 'sr2', 'host2', 'sr1']; | |
| 126 assert_event_path_equals(log, [['target', 'target', 'host1', path], | |
| 127 ['sr2', 'target', 'host1', path], | |
| 128 ['host2', 'host2', 'host1', path], | |
| 129 ['sr1', 'host2', 'host1', path]]); | |
| 130 }, 'Event path for an event with a relatedTarget. relaterTarget is a shadow-incl
uding ancestor of target.'); | |
| 131 | |
| 132 test(() => { | |
| 133 let n = createTestTree(test4); | |
| 134 let log = dispatchEventWithLog(n, n.host1, new FocusEvent('my-focus', { bubble
s: true, composed: true, relatedTarget: n.target })); | |
| 135 assert_event_path_equals(log, []); | |
| 136 }, 'Event path for an event with a relatedTarget. target is a shadow-including a
ncestor of relatedTarget.'); | |
| 137 </script> | |
| 138 | |
| 139 <div id="test5"> | |
| 140 <div id="host"> | |
| 141 <template id="sr" data-mode="open"> | |
| 142 <slot id="slot"></slot> | |
| 143 <div id="related"></div> | |
| 144 </template> | |
| 145 <div id="target"></div> | |
| 146 </div> | |
| 147 </div> | |
| 148 | |
| 149 <script> | |
| 150 test(() => { | |
| 151 let n = createTestTree(test5); | |
| 152 let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbl
es: true, composed: true, relatedTarget: n.related })); | |
| 153 let path = ['target', 'slot', 'sr', 'host', 'test5']; | |
| 154 assert_event_path_equals(log, [['target', 'target', 'host', path], | |
| 155 ['slot', 'target', 'related', path], | |
| 156 ['sr', 'target', 'related', path], | |
| 157 ['host', 'target', 'host', path], | |
| 158 ['test5', 'target', 'host', path]]); | |
| 159 }, 'Event path for an event with a relatedTarget. target is assigned to a slot.'
); | |
| 160 | |
| 161 test(() => { | |
| 162 let n = createTestTree(test5); | |
| 163 let log = dispatchEventWithLog(n, n.related, new FocusEvent('my-focus', { bubb
les: true, composed: true, relatedTarget: n.target })); | |
| 164 let path = ['related', 'sr', 'host', 'test5']; | |
| 165 assert_event_path_equals(log, [['related', 'related', 'target', path], | |
| 166 ['sr', 'related', 'target', path], | |
| 167 ['host', 'host', 'target', path], | |
| 168 ['test5', 'host', 'target', path]]); | |
| 169 }, 'Event path for an event with a relatedTarget. relatedTarget is assigned to a
slot.'); | |
| 170 </script> | |
| 171 | |
| 172 <div id="test6"> | |
| 173 <div id="host0"> | |
| 174 <template id="sr0" data-mode="open"> | |
| 175 <div id="host1"> | |
| 176 <template id="sr1" data-mode="open"> | |
| 177 <div id="host2"> | |
| 178 <template id="sr2" data-mode="open"> | |
| 179 <slot id="slot2"></slot> | |
| 180 <div id="related2"></div> | |
| 181 </template> | |
| 182 <div id="related1"></div> | |
| 183 <div id="d1"> | |
| 184 <slot id="slot1"></slot> | |
| 185 </div> | |
| 186 </div> | |
| 187 </template> | |
| 188 <div id="host3"> | |
| 189 <template id="sr3" data-mode="open"> | |
| 190 <div id="host4"> | |
| 191 <template id="sr4" data-mode="open"> | |
| 192 <div id="host5"> | |
| 193 <template id="sr5" data-mode="open"> | |
| 194 <slot id="slot5"></slot> | |
| 195 </template> | |
| 196 <slot id="slot4"></slot> | |
| 197 </div> | |
| 198 </template> | |
| 199 <div id="target"></div> | |
| 200 </div> | |
| 201 </template> | |
| 202 </div> | |
| 203 </div> | |
| 204 </template> | |
| 205 </div> | |
| 206 </div> | |
| 207 | |
| 208 <script> | |
| 209 test(() => { | |
| 210 let n = createTestTree(test6); | |
| 211 let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbl
es: true, composed: true, relatedTarget: n.related1 })); | |
| 212 let path = ['target', 'slot4', 'slot5', 'sr5', 'host5', 'sr4', 'host4', 'sr3',
'host3', 'slot1', 'd1', 'slot2', 'sr2', 'host2', 'sr1', 'host1', 'sr0']; | |
| 213 assert_event_path_equals(log, [['target', 'target', 'host1', path], | |
| 214 ['slot4', 'target', 'host1', path], | |
| 215 ['slot5', 'target', 'host1', path], | |
| 216 ['sr5', 'target', 'host1', path], | |
| 217 ['host5', 'target', 'host1', path], | |
| 218 ['sr4', 'target', 'host1', path], | |
| 219 ['host4', 'target', 'host1', path], | |
| 220 ['sr3', 'target', 'host1', path], | |
| 221 ['host3', 'host3', 'host1', path], | |
| 222 ['slot1', 'host3', 'related1', path], | |
| 223 ['d1' , 'host3', 'related1', path], | |
| 224 ['slot2', 'host3', 'related1', path], | |
| 225 ['sr2', 'host3', 'related1', path], | |
| 226 ['host2', 'host3', 'related1', path], | |
| 227 ['sr1', 'host3', 'related1', path], | |
| 228 ['host1', 'host3', 'host1', path], | |
| 229 ['sr0', 'host3', 'host1' , path]]); | |
| 230 }, 'Event path for an event with a relatedTarget. Event should be dispatched at
every slots.'); | |
| 231 | |
| 232 test(() => { | |
| 233 let n = createTestTree(test6); | |
| 234 let log = dispatchEventWithLog(n, n.target, new FocusEvent('my-focus', { bubbl
es: true, composed: true, relatedTarget: n.related2 })); | |
| 235 let path = ['target', 'slot4', 'slot5', 'sr5', 'host5', 'sr4', 'host4', 'sr3',
'host3', 'slot1', 'd1', 'slot2', 'sr2', 'host2', 'sr1', 'host1', 'sr0']; | |
| 236 assert_event_path_equals(log, [['target', 'target', 'host1', path], | |
| 237 ['slot4', 'target', 'host1', path], | |
| 238 ['slot5', 'target', 'host1', path], | |
| 239 ['sr5', 'target', 'host1', path], | |
| 240 ['host5', 'target', 'host1', path], | |
| 241 ['sr4', 'target', 'host1', path], | |
| 242 ['host4', 'target', 'host1', path], | |
| 243 ['sr3', 'target', 'host1', path], | |
| 244 ['host3', 'host3', 'host1', path], | |
| 245 ['slot1', 'host3', 'host2', path], | |
| 246 ['d1' , 'host3', 'host2', path], | |
| 247 ['slot2', 'host3', 'related2', path], | |
| 248 ['sr2', 'host3', 'related2', path], | |
| 249 ['host2', 'host3', 'host2', path], | |
| 250 ['sr1', 'host3', 'host2', path], | |
| 251 ['host1', 'host3', 'host1', path], | |
| 252 ['sr0', 'host3', 'host1' , path]]); | |
| 253 }, 'Event path for an event with a relatedTarget. Event should be dispatched at
every slots. relatedTarget should be correctly retargeted.'); | |
| 254 </script> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2384403002:
Dispatch synthetic events even when target and relatedTarget are identical (Closed)
