[Question] wait until all of elements appear

[Whooolia]

I create element1 and element2 to reorder.

As soon as element2 created, it redirects to dashboard and should click the reorder button.

However, the button clicks happened even before the element2 appears on the dashboard.

Although, I added this line before clicking the button it still fails.

await page.waitForSelector(`[data-for="${subsectionTwo}"]`, {
      state: 'visible',
    })

what else I could try to make it wait until all the element is ready and then click the button.

Thanks

[yury-s]

You could try something like this

await Promise.all([
  page.waitForSelector('#element1'),
  page.waitForSelector('#element2')
]);

to wait for both elements to become visible and the do the click. Or does one of the elements flicker?

[Whooolia]

Thanks for the comment @yury-s

Unfortunately, that fails as well, as the same reason. there are not waiting till the element2 appears.
Once they submit, It needs a few more seconds till each element created on the dashboard successfully.
The waitForSelector even with option {state:'visible'} doesn't wait till it appears.

Any other ways you would like to suggest? thanks

[Whooolia]

another update is that it passed at checking two subsections created, however now I am getting this error.

I've found on a document saying

To fix this behaviour simply call

jest.setTimeout(35 * 1000)
in your tests at the top. (30 seconds is the default Playwright timeout for waiting for a specific element.)

So I've put jest.setTimeout(35 * 1000) in beforeAll but it doesn't really help. anything else I can try?

Many thanks

[DJ-Glock]

Hey @Whooolia
What is the reason of setting timeout: 1000 for your second waitForSelector? Does it always appear in less than 1 second?
And by the way you do not need to set state: 'visible' all the time, it's the default value.

It will be helpful if you set DEBUG="pw:api" variable and share verbose log.
What error do you get? Timeout waiting for selector?

[yury-s]

Unfortunately, that fails as well, as the same reason. there are not waiting till the element2 appears.
Once they submit, It needs a few more seconds till each element created on the dashboard successfully.

Do I understand correctly that element2 does appear but its content or some other elements take extra time to show up? If so you may need to wait for a selector that matches one of those elements that take longer to be created in your dashboard.

Would you be able to share the page along with the test you are trying to run so that we could look at it?

[pavelfeldman]

Closing as a part of triaging, please feel free to open a new issue with additional details!