cross-shadow-boundary-slot-in-nested-shadow-dom.html (671B)
1 <!doctype html> 2 <head> 3 <link rel="match" href="cross-shadow-boundary-slot-in-nested-shadow-dom-ref.html"/> 4 </head> 5 <span id="outer">Outer</span> 6 <div id="host"> 7 <template shadowrootmode="open"> 8 <span id="inner">Inner</span> 9 <div id="innerHost"> 10 <template shadowrootmode="open"> 11 <span id="inner">Inner2</span> 12 <slot></slot> 13 </template> 14 <span id="slotted">Slotted</span> 15 </div> 16 </template> 17 </div> 18 <script> 19 // This selects: 20 21 // er 22 // Inner 23 // Inner2 Slott 24 const slotted = host.shadowRoot.getElementById("slotted"); 25 window.getSelection() 26 .setBaseAndExtent(outer.firstChild, 3, slotted.firstChild, 5); 27 </script>