Puppeteer waitForSelector on multiple selectors

Making any of the elements exists

You can use querySelectorAll and waitForFunction together to solve this problem. Using all selectors with comma will return all nodes that matches any of the selector.

await page.waitForFunction(() => 
  document.querySelectorAll('Selector1, Selector2, Selector3').length
);

Now this will only return true if there is some element, it won't return which selector matched which elements.


how about using Promise.race() like something I did in the below code snippet, and don't forget the { visible: true } option in page.waitForSelector() method.

public async enterUsername(username:string) : Promise<void> {
    const un = await Promise.race([
        this.page.waitForSelector(selector_1, { timeout: 4000, visible: true })
        .catch(),
        this.page.waitForSelector(selector_2, { timeout: 4000, visible: true })
        .catch(),
    ]);

    await un.focus();
    await un.type(username);
}