How to take screenshots of multiple sites with puppeteer?

  • 0
    Hello, there is a puppeteer function to take a screenshot of a webpage.

    const puppeteer = require('puppeteer');
    const siteURL = 'http://example.com'
    
    async function getPic() {
      const browser = await puppeteer.launch(); 
      const page = await browser.newPage();
      await page.setViewport({width: 1600, height: 1200});
      await page.goto(siteURL,{ waitUntil: 'networkidle2' });
      await page.screenshot({path: '__PNG.png', fullPage: true});
      await browser.close();
    }


    How to make it possible to pass an array of sites (for example 5) to the function and the function sequentially took a screenshot of each site?
    JavaScript Eliot Berg, Oct 22, 2020

  • 1 Answers
  • 0
    const puppeteer = require('puppeteer');
    const siteURLs = ['http://example0.com', 'http://example1.com', 'http://example2.com'];

    function makeScreenshotFromSite(url, page) {
    return page.setViewport({width: 1600, height: 1200})
    .then(() => {
    return page.goto(siteURL,{ waitUntil: 'networkidle2' });
    })
    .then(() => {
    return page.screenshot({path: '__PNG.png', fullPage: true});
    });
    };

    async function start(sites) {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    const someRes = await Promise.all(
    sites.map(makeScreenshotFromSite)
    );
    await browser.close();
    }
    Nathan Cooley

Your Answer
To place the code, please use CodePen or similar tool. Thanks you!