| OLD | NEW |
| (Empty) | |
| 1 Tests that elements panel updates dom tree structure upon distribution in shadow
dom. |
| 2 |
| 3 |
| 4 Running: createHost1 |
| 5 - <div id="host1"> |
| 6 - #shadow-root (open) |
| 7 - <slot id="slot1" name="slot1"> |
| 8 </slot> |
| 9 - <slot id="slot2" name="slot2"> |
| 10 </slot> |
| 11 - <slot id="slot3"> |
| 12 </slot> |
| 13 </div> |
| 14 |
| 15 Running: createChild1 |
| 16 - <div id="host1"> |
| 17 - #shadow-root (open) |
| 18 - <slot id="slot1" name="slot1"> |
| 19 </slot> |
| 20 - <slot id="slot2" name="slot2"> |
| 21 ↪ <span> |
| 22 </slot> |
| 23 - <slot id="slot3"> |
| 24 </slot> |
| 25 <span id="child1" slot="slot2"></span> |
| 26 </div> |
| 27 |
| 28 Running: createChild2 |
| 29 - <div id="host1"> |
| 30 - #shadow-root (open) |
| 31 - <slot id="slot1" name="slot1"> |
| 32 </slot> |
| 33 - <slot id="slot2" name="slot2"> |
| 34 ↪ <span> |
| 35 </slot> |
| 36 - <slot id="slot3"> |
| 37 ↪ <div> |
| 38 </slot> |
| 39 <span id="child1" slot="slot2"></span> |
| 40 <div id="child2"></div> |
| 41 </div> |
| 42 |
| 43 Running: createChild3 |
| 44 - <div id="host1"> |
| 45 - #shadow-root (open) |
| 46 - <slot id="slot1" name="slot1"> |
| 47 </slot> |
| 48 - <slot id="slot2" name="slot2"> |
| 49 ↪ <span> |
| 50 ↪ <h1> |
| 51 </slot> |
| 52 - <slot id="slot3"> |
| 53 ↪ <div> |
| 54 </slot> |
| 55 <span id="child1" slot="slot2"></span> |
| 56 <div id="child2"></div> |
| 57 <h1 id="child3" slot="slot2"></h1> |
| 58 </div> |
| 59 |
| 60 Running: createChild4 |
| 61 - <div id="host1"> |
| 62 - #shadow-root (open) |
| 63 - <slot id="slot1" name="slot1"> |
| 64 ↪ <h2> |
| 65 </slot> |
| 66 - <slot id="slot2" name="slot2"> |
| 67 ↪ <span> |
| 68 ↪ <h1> |
| 69 </slot> |
| 70 - <slot id="slot3"> |
| 71 ↪ <div> |
| 72 </slot> |
| 73 <span id="child1" slot="slot2"></span> |
| 74 <div id="child2"></div> |
| 75 <h1 id="child3" slot="slot2"></h1> |
| 76 <h2 id="child4" slot="slot1"></h2> |
| 77 </div> |
| 78 |
| 79 Running: createChild5 |
| 80 - <div id="host1"> |
| 81 - #shadow-root (open) |
| 82 - <slot id="slot1" name="slot1"> |
| 83 ↪ <h2> |
| 84 </slot> |
| 85 - <slot id="slot2" name="slot2"> |
| 86 ↪ <span> |
| 87 ↪ <h1> |
| 88 </slot> |
| 89 - <slot id="slot3"> |
| 90 ↪ <div> |
| 91 </slot> |
| 92 <span id="child1" slot="slot2"></span> |
| 93 <div id="child2"></div> |
| 94 <h1 id="child3" slot="slot2"></h1> |
| 95 <h2 id="child4" slot="slot1"></h2> |
| 96 <h3 id="child5" slot="slot3"></h3> |
| 97 </div> |
| 98 |
| 99 Running: modifyChild1 |
| 100 - <div id="host1"> |
| 101 - #shadow-root (open) |
| 102 - <slot id="slot1" name="slot1"> |
| 103 ↪ <span> |
| 104 ↪ <h2> |
| 105 </slot> |
| 106 - <slot id="slot2" name="slot2"> |
| 107 ↪ <h1> |
| 108 </slot> |
| 109 - <slot id="slot3"> |
| 110 ↪ <div> |
| 111 </slot> |
| 112 <span id="child1" slot="slot1"></span> |
| 113 <div id="child2"></div> |
| 114 <h1 id="child3" slot="slot2"></h1> |
| 115 <h2 id="child4" slot="slot1"></h2> |
| 116 <h3 id="child5" slot="slot3"></h3> |
| 117 </div> |
| 118 |
| 119 Running: modifyChild4 |
| 120 - <div id="host1"> |
| 121 - #shadow-root (open) |
| 122 - <slot id="slot1" name="slot1"> |
| 123 ↪ <span> |
| 124 </slot> |
| 125 - <slot id="slot2" name="slot2"> |
| 126 ↪ <h1> |
| 127 </slot> |
| 128 - <slot id="slot3"> |
| 129 ↪ <div> |
| 130 ↪ <h2> |
| 131 </slot> |
| 132 <span id="child1" slot="slot1"></span> |
| 133 <div id="child2"></div> |
| 134 <h1 id="child3" slot="slot2"></h1> |
| 135 <h2 id="child4"></h2> |
| 136 <h3 id="child5" slot="slot3"></h3> |
| 137 </div> |
| 138 |
| 139 Running: modifySlot1 |
| 140 - <div id="host1"> |
| 141 - #shadow-root (open) |
| 142 - <slot id="slot1" name="slot3"> |
| 143 ↪ <h3> |
| 144 </slot> |
| 145 - <slot id="slot2" name="slot2"> |
| 146 ↪ <h1> |
| 147 </slot> |
| 148 - <slot id="slot3"> |
| 149 ↪ <div> |
| 150 ↪ <h2> |
| 151 </slot> |
| 152 <span id="child1" slot="slot1"></span> |
| 153 <div id="child2"></div> |
| 154 <h1 id="child3" slot="slot2"></h1> |
| 155 <h2 id="child4"></h2> |
| 156 <h3 id="child5" slot="slot3"></h3> |
| 157 </div> |
| 158 |
| 159 Running: modifySlot2 |
| 160 - <div id="host1"> |
| 161 - #shadow-root (open) |
| 162 - <slot id="slot1" name="slot3"> |
| 163 ↪ <h3> |
| 164 </slot> |
| 165 - <slot id="slot2" name="slot1"> |
| 166 ↪ <span> |
| 167 </slot> |
| 168 - <slot id="slot3"> |
| 169 ↪ <div> |
| 170 ↪ <h2> |
| 171 </slot> |
| 172 <span id="child1" slot="slot1"></span> |
| 173 <div id="child2"></div> |
| 174 <h1 id="child3" slot="slot2"></h1> |
| 175 <h2 id="child4"></h2> |
| 176 <h3 id="child5" slot="slot3"></h3> |
| 177 </div> |
| 178 |
| 179 Running: removeChild3 |
| 180 - <div id="host1"> |
| 181 - #shadow-root (open) |
| 182 - <slot id="slot1" name="slot3"> |
| 183 ↪ <h3> |
| 184 </slot> |
| 185 - <slot id="slot2" name="slot1"> |
| 186 ↪ <span> |
| 187 </slot> |
| 188 - <slot id="slot3"> |
| 189 ↪ <div> |
| 190 ↪ <h2> |
| 191 </slot> |
| 192 <span id="child1" slot="slot1"></span> |
| 193 <div id="child2"></div> |
| 194 <h2 id="child4"></h2> |
| 195 <h3 id="child5" slot="slot3"></h3> |
| 196 </div> |
| 197 |
| 198 Running: removeChild1 |
| 199 - <div id="host1"> |
| 200 - #shadow-root (open) |
| 201 - <slot id="slot1" name="slot3"> |
| 202 ↪ <h3> |
| 203 </slot> |
| 204 - <slot id="slot2" name="slot1"> |
| 205 </slot> |
| 206 - <slot id="slot3"> |
| 207 ↪ <div> |
| 208 ↪ <h2> |
| 209 </slot> |
| 210 <div id="child2"></div> |
| 211 <h2 id="child4"></h2> |
| 212 <h3 id="child5" slot="slot3"></h3> |
| 213 </div> |
| 214 |
| 215 Running: removeSlot1 |
| 216 - <div id="host1"> |
| 217 - #shadow-root (open) |
| 218 - <slot id="slot2" name="slot1"> |
| 219 </slot> |
| 220 - <slot id="slot3"> |
| 221 ↪ <div> |
| 222 ↪ <h2> |
| 223 </slot> |
| 224 <div id="child2"></div> |
| 225 <h2 id="child4"></h2> |
| 226 <h3 id="child5" slot="slot3"></h3> |
| 227 </div> |
| 228 |
| 229 Running: createHost2 |
| 230 - <div id="host2"> |
| 231 - #shadow-root (open) |
| 232 - <slot id="slot1" name="slot3"> |
| 233 </slot> |
| 234 </div> |
| 235 |
| 236 Running: moveChild5FromHost1ToHost2 |
| 237 - <div id="host2"> |
| 238 - #shadow-root (open) |
| 239 - <slot id="slot1" name="slot3"> |
| 240 ↪ <h3> |
| 241 </slot> |
| 242 <h3 id="child5" slot="slot3"></h3> |
| 243 </div> |
| 244 |
| 245 Running: modifyChild4 |
| 246 - <div id="host1"> |
| 247 - #shadow-root (open) |
| 248 - <slot id="slot2" name="slot1"> |
| 249 ↪ <h2> |
| 250 </slot> |
| 251 - <slot id="slot3"> |
| 252 ↪ <div> |
| 253 </slot> |
| 254 <div id="child2"></div> |
| 255 <h2 id="child4" slot="slot1"></h2> |
| 256 </div> |
| 257 |
| OLD | NEW |