Wait until page is completely loaded in Puppeteer

await page.goto('https://testsite.com/', {
    waitUntil:'load'
});

For plain static or dynamically server-side generated web pages, waiting for the page to load can be easily handled by specifying the waitUntil as the second parameter of the goto function. Here you can use the load and domcontentloaded events familiar from JavaScript.

await page.goto('https://testsite.com/', {
    waitUntil:'load'
});

Unfortunately, in many cases this is not the case today. For example, in SPA applications (React, Next.js, Remix,...), events are triggered, but the page is not ready for testing.

If we know which element we are waiting for, we can use the waitForSelector() function, which waits until the element is available on the page. 

await page.waitForSelector('#login-btn');

You can of course also use a fixed delay. In the new Puppeteer versions, the waitForTimeout function is deprecated, but fortunately it can be replaced by a simple Promise code:

await new Promise(r => setTimeout(r, 2000));