Endless loop?

[stevenvachon]

The while() loop within this library never ends when I run this code:

if (document.readyState === 'loading') {
  for await (const element of observeReadyElements('[data-text-effect]')) {
    console.log(element);
    break;
  }
}

[stevenvachon]

I wrote this in the meantime:

const watchForReadyElements = (selector, callback) => {
  const seen = new Set();
  let cancelled = document.readyState !== 'loading';

  if (!cancelled) {
    document.addEventListener('DOMContentLoaded', () => (cancelled = true));
  }

  const check = () => {
    for (const el of document.querySelectorAll(selector)) {
      if (!seen.has(el)) {
        seen.add(el);
        callback(el);
      }
    }
    if (!cancelled) {
      requestAnimationFrame(check);
    }
  };

  check();
};

[sindresorhus]

observeReadyElements(selector, options?)
Returns an async iterable which yields with each new matching element. Useful for user-scripts that modify elements when they are added.

It only matches new elements.

---

I think we need to improve the docs for that though. And maybe also support your use-case.

[stevenvachon]

Shouldn't it have matched my elements, though; as DOMContentLoaded hadn't yet been dispatched?