Puppeteer wait page load after form submit

Asked
Active3 hr before
Viewed126 times

6 Answers

90%

You can wait for navigation asynchronously to avoid getting null on redirection,,You can use page.waitForNavigation() to wait for a page to navigate:,Sometimes even using await page.waitForNavigation() will still result in a Error: Execution context was destroyed, most likely because of a navigation.,In my case, it was because the page was redirecting multiple times. The API says the default waitUntil option is Load—this required me to wait for navigation each redirect (3 times).

You can wait for navigation asynchronously to avoid getting null on redirection,

await Promise.all([
   page.click("button[type=submit]"),
   page.waitForNavigation({
      waitUntil: 'networkidle0'
   }),
]);
load more v
88%

I submit a form using the following code and i want Puppeteer to wait page load after form submit.,How to wait for page load with puppeteer?,i suggest to wrap page.to in a wrapper and wait for everything loaded,But since page.waitForNavigation() is a shortcut for page.mainFrame().waitForNavigation(), we can use the following for a minor performance enhancement:

I submit a form using the following code and i want Puppeteer to wait page load after form submit.

await page.click("button[type=submit]");

//how to wait until the new page loads before taking screenshot?
// i don't want this:
// await page.waitFor(1*1000);  //← unwanted workaround
await page.screenshot({
   path: 'example.png'
});
load more v
72%

Page.evaluateEvaluates a function in the browser context.,launchThe method launches a browser instance with given arguments. The browser will be closed when the par,Browser.closeCloses browser with all the pages (if any were opened).,asyncHigher-order functions and common patterns for asynchronous code

(async () => {
   const browser = await puppeteer.launch({
      headless: true
   })
   const page = await browser.newPage()
   await page.goto('https://github.com/login')
   await page.type('#login_field', process.env.GITHUB_USER)
   await page.type('#password', process.env.GITHUB_PWD)
   await page.click('[name="commit"]')
   await page.waitForNavigation()
   await page.screenshot({
      path: screenshot
   })
   browser.close()
   console.log('See screenshot: ' + screenshot)
})()
load more v
65%

Puppeteer on Google Developers,StackOverflow: wait for text to appear with Puppeteer,For this example we will load up espn.com (which is a relatively large site) and check for the text “NBA”. You can use this example to load up any site and wait for any text. However, please be aware of Puppeteer’s default timeout of 30 seconds when doing so and extend it accordingly if your situation requires.,When using Puppeteer there are times when you may need to wait for text to display on a page - perhaps to ensure that the page has fully loaded or before executing another step in your automation pipeline.

const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('http://ajahne.github.io/blog/');
await page.waitForFunction(
   'document.querySelector("body").innerText.includes("Hello Ajahne")'
);
load more v
75%

Tell us about your environment:,Puppeteer version: 0.13.0,What steps will reproduce the problem?,By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

const puppeteer = require('puppeteer');

(async () => {
   try {
      const browser = await puppeteer.launch({
         headless: false,
         executablePath: 'D:/path/to/chromium/chrome.exe',
         userDataDir: 'D:/path/to/userdir',
         args: ['about:blank']
      });

      const pages = await browser.pages();
      const page = pages[0];

      page.on('load', () => console.log('Loaded: ' + page.url()));

      // goto: page1.html
      await page.goto('https://leo020588.bitbucket.io/page1.html', {
         waitUntil: 'load'
      });

      // workaround-fix
      /*await page.evaluate(() => {
      	let link = document.querySelector('a');
      	link.addEventListener('click', (event) => {
      		event.preventDefault();
      		event.stopPropagation();
      		window.location = link.href;
      	});
      });*/

      // click: link (page2.html)
      await page.click('a');

      //
      await page.waitForNavigation({
         waitUntil: 'load'
      });
      console.log('page2.html has arrived ... the wait is over');

      //
      await browser.close();

   } catch (e) {
      console.log(e);
   }
})();
load more v
40%

test("fruit dropdown becomes enabled when food type fruit is selected", async () => {
   await page.select('[data-testid="food"]', "fruit"); // this makes a selection in the drop down and fires a request

   // I should wait for request to finish before doing this
   const isFruitDropdownDisabled = await page.$eval(
      '[data-testid="fruit"]',
      element => element.disabled
   );

   expect(isFruitDropdownDisabled).toBe(false);
}, 16000);

Other "undefined-undefined" queries related to "Puppeteer wait page load after form submit"