Need a generic wait for network idle after click

Steps to reproduce

Tell us about your environment:

• Puppeteer version: puppeteer@2.0.0
• Platform / OS version: Ubuntu 18.04.2 LTS
• Node.js version: v12.9.1

What steps will reproduce the problem?

The following simple example almost works, but need to wait for network idle after click, to be perfect:

const puppeteer = require('puppeteer');

(async() => {
  const browser = await puppeteer.launch({headless: true});
  try {
    const page = await browser.newPage();

    await page.setViewport({width: 800,height: 800});
    const response = await page.goto(`https://stock.finance.sina.com.cn/usstock/quotes/TSLA.html`, {
        waitUntil: 'networkidle0'
      });
    //console.log(await page.content());

    let selector = `div.kke_menus_tab_edage > div:nth-child(6) > a`
    await page.waitForSelector(selector)
    await page.click(selector)

    const inputElement = await page.$('div.sec.clearfix div.block.block_hq')
    await inputElement.screenshot({path: 'sina-finance.png'})

  } catch (err) {console.log(err.message);}
  finally {
    await browser.close();
  }
})()

So, in summary,

• The click does not trigger any navigation
• The inputElement already exist, even before clicking so can’t wait on that.

What is expected

Any simple solution like page.waitForNavigation, e.g., page.waitForNetwork({waitUntil: 'networkidle0'})?

What happens instead?

No such simple solution.

Therefore, I’m raising a bug for the puppeteer project to provide one.

I know there are two alternatives, one is wait for a fixed time, and for the other, people might suggests await page.waitForResponse, e.g., #3649, & #5228. However, here are the reasons that they are not ideal.

• To wait for a fixed time, I normally need to only wait for 3 seconds, however do to network traffic, server load, etc, etc, that fixed time is now 24 seconds – eight times more than necessary.
• To use await page.waitForResponse, the response.url() has to be very specific, right? Unfortunately, if that’s the case, it won’t work for my case, as the sub request is firing up to /e.gif?UATrack||170.1xx.1xx.6_1579617169.47||170.1xx.1xx.6_1579617169.48||||chart_detail||k_re0||||||||&gUid_1579617220029 which is changing all the times.

All in all, I need a generic solution, not a specific one.
Just like page.waitForNavigation, I hope we can have a

page.waitForNetwork({waitUntil: 'networkidle0'})

for both navigation and clicking.

Please consider. Thx.

[Jany-M]

You can use

function delay(time) {
  return new Promise(function(resolve) { 
	 setTimeout(resolve, time)
  });
}

And then just

await delay(3000);

---

UPDATE

await page.waitFor(3000);

Provided by Puppetteer itself.

[royryando]

If the case is like a login form and you need to wait for next page after submitting form, try use this

await Promise.all([
  page.click('#login_button'),
  page.waitForNavigation({ waitUntil: 'networkidle0' })
]);

But if you need to wait an ajax request to finish after clicking the button, maybe this can help. in my case it works fine

await Promise.all([
  page.click('#refresh_table'),
  page.waitForResponse(response => response.status() === 200)
]);

There is some method for response for checking: response.url() response.status() response.headers(), etc