32 lines
705 B
HTML
32 lines
705 B
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<body>
|
|
<p>Test passes if you see a single 100px by 100px green box below.</p>
|
|
<div id="host"></div>
|
|
<style>
|
|
#host > div { width: 100px; background: green; }
|
|
#host > div:first-of-type { height: 70px; }
|
|
#host > div:last-of-type { height: 30px; }
|
|
</style>
|
|
<script>
|
|
|
|
const shadowRoot = host.attachShadow({mode: 'closed'});
|
|
|
|
const child1 = document.createElement('div');
|
|
child1.slot = 'slot1';
|
|
host.appendChild(child1);
|
|
|
|
const slot1 = document.createElement("slot");
|
|
slot1.name = 'slot1';
|
|
shadowRoot.append(slot1);
|
|
|
|
const child2 = document.createElement('div')
|
|
host.appendChild(child2);
|
|
|
|
const slot2 = document.createElement("slot");
|
|
shadowRoot.append(slot2);
|
|
|
|
</script>
|
|
</body>
|
|
</html>
|