<!--
@AURALINUX-ALLOW:class:*
@AURALINUX-ALLOW:tag:*
@BLINK-ALLOW:htmlTag=*
@BLINK-ALLOW:className=*
-->
<template id="template">
<div class="div-inside-template">
<slot name="outer-slot" class="outer">
<slot name="inner-slot" class="inner"></slot>
</slot>
</div>
</template>
<my-element>
<p slot="inner-slot">Slot contents</p>
</my-element>
<script>
customElements.define(
'my-element',
class extends HTMLElement {
constructor() {
super();
let template = document.getElementById('template');
let templateContent = template.content;
const shadowRoot = this.attachShadow({mode: 'open'})
.appendChild(templateContent.cloneNode(true));
}
}
);
</script>