Timeouts


Timeouts can be an important part in making sure your automation scripts work as expected.

Puppeteer and Playwright Timeouts

Puppeteer and Playwright offer several timeout options.

You can configure timeouts related to waiting for elements to be available, timeouts related to navigation or global timeouts.


page.waitForSelector

This allows your script to wait until a selector is available in the DOM.
By default this will wait up to 30 seconds. If you want to change this option, you can pass in a timeout option:


await page.waitForSelector('h1', { timeout: 5000 })

In a test, this might for example be useful when you want to submit a form and wait until a new DOM element is found:

it('should submit a form and wait for the element', async () => {
  await page.type('input[name=q]', 'HeadlessTesting')
  await page.click('input[type="submit"]')
  await page.waitForSelector('h1', { timeout: 5000 })
})

page.waitForNavigation

Allows your script to wait until a navigation event is triggered.
For example: click a link, and wait until the navigation event has completed before proceeding with the script.


await page.waitForNavigation()

In a test, this might for example be useful when you want to submit a form and wait until a new DOM element is found:

const waitForNavigationPromise =  page.waitForNavigation()
await page.click('a.my-link')
await waitForNavigationPromise

With page.waitForNavigation you can specify several waitUntil options:


Dom Event Based Options

You can choose to wait for a DOM event to occur, such as:

  • load - wait until the entire page, including assets, has loaded.
  • domcontentloaded - when your HTML has loaded.

Heuristic Based Options

This will wait until the network connections in your browser are no longer active.

  • networkidle0 - triggered when there are no more than 0 network connections for at least 500 ms.
  • networkidle2 - triggered when there are no more than 2 network connections for at least 500 ms.

Depending on your use-case, you should pick either DOM based or Heuristic based. For server-side websites, we recommend networkidle2.

HeadlessTesting Custom Timeouts

HeadlessTesting provides its own timeouts as well. We offer timeout and maxDuration options.


Timeout

This setting allows you to forcefully stop a session if we have not received any new requests from your test script.
This is useful if you for example forgot to close your session (browser.close()) at the end of your automation.


const browser = await puppeteer.connect({
  browserWSEndpoint: 'wss://chrome.headlesstesting.com?token=[YOUR-TOKEN]&timeout=120'
})

const page = await browser.newPage()
await page.goto('https://headlesstesting.com')
browser.close()

This example will forcefully close your session if we haven't received any new commands from your script after 90 seconds.
If you do not specify this setting, the default value will be 90 seconds.


MaxDuration

This setting will forcefully close a session if its maximum duration exceeds the value you specified.
This is useful when your script is for example in an (endless) loop and is kept running longer than you expect it to.


const browser = await puppeteer.connect({
  browserWSEndpoint: 'wss://chrome.headlesstesting.com?token=[YOUR-TOKEN]&maxDuration=600'
})

const page = await browser.newPage()
await page.goto('https://headlesstesting.com')
browser.close()

This example will forcefully close your session if the total test duration exceeds 600 seconds.
If you do not specify this setting, the default value will be 300 seconds.