How to Wait for Page to Load in Puppeteer?

Waiting for a page to fully load is crucial when working with dynamic websites in Puppeteer. The waitForSelector method is highly effective for this purpose. It pauses the execution until a specific element appears on the page, indicating that the page has fully loaded.

Here is an example that opens the Bright Data homepage and waits for the main content section to load:

      const puppeteer = require('puppeteer');

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

    // Navigate to the Bright Data homepage
    await page.goto("https://brightdata.com");

    // Wait for the main content section to appear
    await page.waitForSelector('main', { timeout: 5000 });

    // Perform actions on the fully loaded page
    console.log("Page loaded successfully");
    
    await browser.close();
}

waitForPageLoad();

In this code:

The browser is launched in headless mode for efficiency.
The page navigates to Bright Data’s homepage.
The script waits for the main element, which indicates the page has fully loaded.
After the element appears, further actions can be performed on the page.

For more advanced use cases and examples, check out Bright Data’s guide on web scraping with Puppeteer.

Using Puppeteer effectively can save time and effort, especially when combined with Bright Data’s Puppeteer browser. This specialized browser automatically handles CAPTCHA solving, IP rotation, and other complexities, making web scraping more reliable and efficient. Start your free trial today and experience the ease of scraping with Bright Data’s advanced tools.

Start free trial Start with Google