Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
function querySelectorAllDeep(root, selector) {
const [start, ...rest] = Array.isArray(selector) ? selector : selector.split(" /deep/ ");
if (rest.length === 0) return [...root.querySelectorAll(start)];
return [...root.querySelectorAll(start + " *")].map(x => x.shadowRoot).filter(Boolean).map(x => querySelectorAllDeep(x, rest)).flat();
}
function unshadowDOM(dom, tagnNameOverride) {
const root = document.createElement(tagnNameOverride || dom.tagName || "fragment");
for(const {name, value} of (dom.attributes || [])) {
try {
root.setAttribute(name, value);
} catch (e) { /* called with hidden$ attribute */ }
}
root.textContent = dom.textContent;
if (dom.shadowRoot) {
root.appendChild(unshadowDOM(dom.shadowRoot, "shadow"));
}
for(const kid of dom.children) {
root.appendChild(unshadowDOM(kid));
}
return root;
}
@benjamingr

This comment has been minimized.

Copy link
Owner Author

commented Jan 10, 2019

hackier :D

function querySelectorAllDeep(root, selector) {
  const dom = unshadowDOM(root);
  const sel = selector.replace(/\/deep\//g, "shadow");
  return dom.querySelectorAll(sel);
}

function unshadowDOM(dom, tagnNameOverride) {
  const root = document.createElement(tagnNameOverride || dom.tagName || "fragment");
  for(const {name, value} of (dom.attributes || [])) {
    try {
    root.setAttribute(name, value);
    } catch (e) { /* called with hidden$ attribute */ }
  }

  root.textContent = dom.textContent;
  if (dom.shadowRoot) {
    root.appendChild(unshadowDOM(dom.shadowRoot, "shadow"));
  }
  for(const kid of dom.children) {
    root.appendChild(unshadowDOM(kid));
  }
  return root;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.