Skip to content

Instantly share code, notes, and snippets.

@shreeve
Last active November 23, 2022 08:20
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 shreeve/990a87721f819b453c76182cc3c7dc8a to your computer and use it in GitHub Desktop.
Save shreeve/990a87721f819b453c76182cc3c7dc8a to your computer and use it in GitHub Desktop.
Helpful waitForSelector() javascript method

waitForSelector(want, opts={})

coffeescript

waitForSelector(want, opts={}) =>
  new Promise (resolve, reject) =>
    return resolve node if node = document.querySelector want

    find = new MutationObserver (changes) =>
      for change in changes
        for node in Array.from(change.addedNodes)
          if node.matches and node.matches want
            find.disconnect()
            return resolve node

    find.observe document.documentElement, childList:true, subtree: true

    setTimeout () =>
      find.disconnect()
      if opts.optional then resolve null else reject new Error "Timeout on #{want}"
    , opts.timeout if opts.timeout

javascript

var waitForSelector;

waitForSelector = (want, opts = {}) => {
  return new Promise((resolve, reject) => {
    var find, node;
    if (node = document.querySelector(want)) {
      return resolve(node);
    }
    find = new MutationObserver((changes) => {
      var change, i, j, len, len1, ref;
      for (i = 0, len = changes.length; i < len; i++) {
        change = changes[i];
        ref = Array.from(change.addedNodes);
        for (j = 0, len1 = ref.length; j < len1; j++) {
          node = ref[j];
          if (node.matches && node.matches(want)) {
            find.disconnect();
            return resolve(node);
          }
        }
      }
    });
    find.observe(document.documentElement, {
      childList: true,
      subtree: true
    });
    if (opts.timeout) {
      return setTimeout(() => {
        find.disconnect();
        if (opts.optional) {
          return resolve(null);
        } else {
          return reject(new Error(`Timeout on ${want}`));
        }
      }, opts.timeout);
    }
  });
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment