Skip to content

Instantly share code, notes, and snippets.

@knowler
Last active January 12, 2024 20:06
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save knowler/ab3bcc7aa7ffd5584f22480db53e7b6b to your computer and use it in GitHub Desktop.
Save knowler/ab3bcc7aa7ffd5584f22480db53e7b6b to your computer and use it in GitHub Desktop.
Pug mixin for an open Declarative Shadow DOM that polyfills itself.
mixin shadow
template(shadowrootmode="open")
block
script.
{
const element = document.currentScript.parentElement;
if (!element.shadowRoot) {
element.attachShadow({ mode: "open"})
const template = element.querySelector(":scope > template[shadowrootmode=open]");
if (template) element.shadowRoot.appendChild(template.content.cloneNode(true));
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment