Using Puppeteer to wait for multiple selectors

Other Questions Puppeteer
1

I am working with Puppeteer to automate a website that includes a search form which can return either a valid result or a message indicating that no records were found. What’s the best approach to identify what has been returned? It appears that waitForSelector can only handle one selector at a time, and waitForNavigation doesn’t function as expected since the response is delivered via Ajax. I’ve tried using a try-catch structure, but it complicates the process and slows down execution significantly.

try {
    await page.waitForSelector(SELECTOR_A, {timeout: 1000});
} catch(error) { 
    await page.waitForSelector(SELECTOR_B);
}
2

You can use Promise.all with page.waitForFunction to wait for multiple selectors efficiently. This approach will listen for both selectors and proceed when one appears.

await page.waitForFunction(() => {
    return document.querySelector(SELECTOR_A) || document.querySelector(SELECTOR_B);
});

This avoids the try-catch overhead and leverages async operations to streamline the process.