| <!DOCTYPE html> |
| <script src='resources/shadow-dom.js'></script> |
| <div id='d1'> |
| <template data-mode='open'> |
| <div id='d1-1'> |
| <template data-mode='open'> |
| <div id='d1-1-1'>d1-1-1</div> |
| <slot name='d1-1-s1'></slot> |
| <slot name='d1-1-s2'></slot> |
| <div id='d1-1-2'>d1-1-2</div> |
| </template> |
| <div id='d1-2'>d1-2</div> |
| <slot id='d1-s0'></slot> |
| <slot name='d1-s1' slot='d1-1-s1'></slot> |
| <slot name='d1-s2'></slot> |
| <div id='d1-3'>d1-3</div> |
| <div id='d1-4' slot='d1-1-s1'>d1-4</div> |
| </div> |
| </template> |
| <div id='d2' slot='d1-s1'>d2</div> |
| <div id='d3' slot='d1-s2'>d3</div> |
| <div id='d4' slot='non-existent'>d4</div> |
| <div id='d5'>d5</div> |
| </div> |
| <script> |
| convertTemplatesToShadowRootsWithin(d1); |
| </script> |
