| <!DOCTYPE HTML> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| |
| <script> |
| /* doc > span */ |
| const spanElem = document.createElement('span'); |
| document.documentElement.appendChild(spanElem); |
| |
| // span > #shadowRoot |
| const shadowRoot = spanElem.createShadowRoot(); |
| shadowRoot.appendChild(document.createElement('content')); |
| |
| // "Hello" |
| const textNode1 = document.createTextNode('Hello'); |
| spanElem.appendChild(textNode1); |
| |
| // div > select > option |
| const divElem = document.createElement('div'); |
| divElem.innerHTML = "<select><option></select>"; |
| spanElem.appendChild(divElem); |
| |
| // Perform a layout. |
| divElem.offsetWidth; |
| |
| // "World" |
| const textNode2 = document.createTextNode('World'); |
| spanElem.appendChild(textNode2); |
| |
| // Now we have: |
| /* doc |
| * span |
| * #shadowRoot |
| * "Hello" <-- REMOVE FIRST |
| * div > select > option <-- REMOVE OPTION NEXT |
| * "World" |
| */ |
| textNode1.remove(); |
| |
| test(function(t) { |
| document.querySelector("option").remove(); |
| }, "Removing an option inside a shadow dom shouldn't crash"); |
| |
| </script> |