Skip to content

Instantly share code, notes, and snippets.

@surma

surma/findall_elements_deep.js

Forked from ebidel/findall_elements_deep.js
Last active October 25, 2020 16:41
Show Gist options
  • Star 14 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save surma/af49fc6384a1161486667b27790f9e4c to your computer and use it in GitHub Desktop.
Save surma/af49fc6384a1161486667b27790f9e4c to your computer and use it in GitHub Desktop.
Download ZIP
Finds all elements on the page, including those within shadow dom — iterator version
Raw
findall_elements_deep.js
/**
* Inspired by ebidel@ (https://gist.github.com/ebidel/1b418134837a7dde7d76ed36288c1d16)
* @author surma@
* License Apache-2.0
*/
function* collectAllElementsDeep(selector = '*', root = document.all) {
for (const el of root) {
if (!el.matches(selector))
continue;
yield el;
// If the element has a shadow root, dig deeper.
if (el.shadowRoot)
yield* collectAllElementsDeep(selector, el.shadowRoot.querySelectorAll('*'));
}
}
@valdrinkoshi
Copy link

valdrinkoshi commented Apr 18, 2018 •
edited

Shouldn't it keep digging deeper even if the element doesn't match the selector? Basically change the if condition to

  if (el.matches(selector))
    yield el;

@surma
Copy link
Author

surma commented Apr 18, 2018

That’s just as valid. The current behavior is an intended choice by me, but as you say, can easily be changed :D

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment