1

I am using a long await page delay(8000) just to ensure all the data in the dropdown box is loaded. I assume there must be a way to wait until all the data in dropdown box is loaded and then automation goes to the next step after that.

I tried using validation for the selectors but we can't get validation for dynamic data populated from the query also tried using await page.delay(n) but this is not a proper way to do because sometimes running a query could take some time.

page.click(selectors.xxx.nnn)
    await delay (1000)
    page.keyboard.type('abc')
    await delay(8000)
    page.keyboard.press('ArrowDown')
    page.keyboard.press('ArrowDown')
    page.keyboard.press('Enter')

await page.waitFor(selectors.xxx.nnn)
    page.click(selectors.xxx.nnn)
    await page.waitFor(selectors.xxx.abc)

So using delay can be a solution but is not a proper solution. If there was a way I could make browser automation in puppeteer wait, not for the selectors but the data from the backend. It would be nice to make sure all the expected list on a dropdown is populated and can be selected.

skyboyer
  • 22,209
  • 7
  • 57
  • 64
Denish
  • 73
  • 1
  • 8

2 Answers2

0

You can use page.waitForFunction to wait until a specific function returns true. In your case you could count the options of the dropdown box. I'm assuming the "dropdown box" is a simple <select>...</select> HTML element.

Code sample

await page.waitForFunction(() => document.querySelector('#id-of-selectbox').length > 0);

As the length attribute on a select box returns the number of options inside, this code will wait until there is at least one option inside the select box before continuing.

Thomas Dondorf
  • 23,416
  • 6
  • 84
  • 105
  • Looks like we can use ```await page.waitForNavigation({waitUntil:'networkidle0'})``` which waits till all the network call is complete but due to some reason it is not going to the next step. Next thing I tried was using ```response.ok()``` function but this only works for one request whereas in my case I have two requests and one is the pre-flight request. any ideas ??? – Denish Jun 10 '19 at 20:14
  • @DenishS. `waitForNavigation` will actually wait for page navigation (instead of a request). I just [answered a very similar question](https://stackoverflow.com/a/56531732/5627599) where I also outlined a way to use the `waitForResponse` method. Does that help you? – Thomas Dondorf Jun 10 '19 at 20:45
  • after hours and hours of trying out different things await page.waitForResponse(response => response.status() === 200) worked out for me. So, now my automation will continue to the next step if all the request is a success with response success status 200. – Denish Jun 10 '19 at 21:51
0

await page.waitForResponse(response => response.status() === 200)

or

await page.waitForResponse(response => response.ok())

This both allows the automation to wait till all the response is a success

Denish
  • 73
  • 1
  • 8