7

Is there something like document.ready() in Puppeteer?

There is:

page.waitForSelector(selector)

Since there are so many same-name selector on any HTML page, how can this function can be sure that the right page has been loaded? It is a simple function, but caused quite a few errors when I use it before page.content(). I'm not sure what is missed about this function.

Grant Miller
  • 27,532
  • 16
  • 147
  • 165
user938363
  • 9,990
  • 38
  • 137
  • 303

2 Answers2

21

You can use page.waitForNavigation() as an alternative to jQuery's document.ready() function:

await page.waitForNavigation({waitUntil: 'load'});             // consider navigation to be finished when the load event is fired.
await page.waitForNavigation({waitUntil: 'domcontentloaded'}); // consider navigation to be finished when the DOMContentLoaded event is fired.
await page.waitForNavigation({waitUntil: 'networkidle0'});     // consider navigation to be finished when there are no more than 0 network connections for at least 500 ms.
await page.waitForNavigation({waitUntil: 'networkidle2'});     // consider navigation to be finished when there are no more than 2 network connections for at least 500 ms.

Alternatively, you can use the waitUntil option in page.goto() to wait for the document to load:

await page.goto('https://example.com/', {waitUntil: 'load'});
await page.goto('https://example.com/', {waitUntil: 'domcontentloaded'});
await page.goto('https://example.com/', {waitUntil: 'networkidle0'});
await page.goto('https://example.com/', {waitUntil: 'networkidle2'});
Grant Miller
  • 27,532
  • 16
  • 147
  • 165
  • The `page.waitForNavigation({waitUntil: 'load'})` caused error 30 second after it has been executed . Very strange! `(node:12768) UnhandledPromiseRejectionWarning: TimeoutError: Navigation Timeout Exceeded: 30000ms exceeded at Promise.then (C:\d\code\js\wbot\node_modules\puppeteer\lib\FrameManager.js:1230:21) at ` – user938363 Oct 27 '18 at 03:15
  • @user938363 You can increase the timeout limit using `page.waitForNavigation({timeout: 60000, waitUntil: 'load'})` or [`page.setDefaultNavigationTimeout(60000)`](https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pagesetdefaultnavigationtimeouttimeout). – Grant Miller Oct 27 '18 at 03:49
  • 1
    Hi `Grant Miller`, the strange thing is that the line of the `page.waitForNavigation` has been executed and it is executing in a following `do loop` when the error pops up. In the `do loop`, there is a line of `page.reload({waitUntil: 'load'})`. But the error pointing to the line of `page.waitForNavigation`. Could be the problem is actually about `page.reload`? – user938363 Oct 27 '18 at 03:58
  • Use waitForFunction instead, `await page.waitForFunction(() => document.readyState === "complete");` – Yuri Olive Apr 02 '22 at 01:36
1

Sometimes waitForNavigation just timeout. I came up with other solution using the waitForFunction, checking if document is in ready state.

await page.waitForFunction(() => document.readyState === "complete");
Yuri Olive
  • 372
  • 5
  • 8