André Amorim

Crafting Web Experiences

//

Use a promise with MutationObserver to wait for an element to appear in the DOM

function waitForElm(selector) {
    return new Promise(resolve => {
        if (document.querySelector(selector)) {
            return resolve(document.querySelector(selector));
        }

        const observer = new MutationObserver(mutations => {
            if (document.querySelector(selector)) {
                observer.disconnect();
                resolve(document.querySelector(selector));
            }
        });

        observer.observe(document.documentElement, {
            childList: true,
            subtree: true
        });
    });
}


// Call example:
waitForElm('#element').then((element) => {
  // Your code
});

Published date:

Modified date: