1371130.xhtml (836B)
1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head> 3 <script> 4 customElements.define("custom-div", class extends HTMLDivElement { 5 constructor() { 6 super(); 7 this.attachShadow({ mode: "open" }); 8 9 let p = document.createElement("p"); 10 p.append(document.createElement("slot")); 11 let span = document.createElement("span"); 12 span.textContent = "This should not be green."; 13 this.shadowRoot.append(p, span); 14 } 15 }, { 16 extends: "div", 17 }); 18 </script> 19 <style> 20 span { color: red; } 21 div.x > span { color: green; } 22 </style> 23 </head> 24 <body onload="document.body.offsetTop; document.querySelector('div').className = 'x'"> 25 <div is="custom-div"> 26 <span>This should be green.</span> 27 </div> 28 </body> 29 </html>