puppeteer wait for element disappear or remove from DOM

Question

Is there any way or Puppeteer API we can wait element to disappear or remove from Dom and then continue the execution?

E.g I have a loading animation I want to wait until this loading animation remove from Dom.

score 35 · Answer 1 · answered Nov 13 '19 at 11:29

35

waitForSelector has a hidden option which also check if the element is in the DOM:

await page.waitForSelector('div', {hidden: true});

answered Nov 13 '19 at 11:29

hardkoded

score 12 · Answer 2 · edited Nov 26 '22 at 20:11

12

Try this

await page.waitForFunction(() => !document.querySelector(querySelector));

edited Nov 26 '22 at 20:11

Luke Taylor

answered Nov 13 '19 at 10:55

dev_Fares

1

`waitFor` is deprecated. You can use `waitForFunction` in its place in this case. – Raine Revere May 21 '21 at 15:57

score 3 · Answer 3 · answered Jan 15 '20 at 10:14

3

If you're waiting for API response, maybe it's better to rely on

await page.waitForResponse(response => response.url() === myUrl && response.status() === 200);

answered Jan 15 '20 at 10:14

Dima Dorogonov

score 1 · Answer 4 · answered Jan 12 '22 at 22:03

1

You can use page.waitForFunction with a conditional statement.

await page.waitForFunction('document.querySelector("#myElement") === null')

answered Jan 12 '22 at 22:03

keithfrazier98

4 Answers4