Function snapshotWebpages

build-system/tasks/visual-diff/index.js:349–553

* Generates Percy snapshots for a set of given webpages. * * @param {!puppeteer.Browser} browser a Puppeteer controlled browser. * @param {!Array<!WebpageDef>} webpages an array of JSON objects containing * details about the webpages to snapshot. * @return {Promise } true if all tes

(browser, webpages)

 *     indicate whether the tests passed on Percy).
 */
async function snapshotWebpages(browser, webpages) {
  const availablePages = [];
  const allPages = [];

  log('verbose', 'Preallocating', cyan(MAX_PARALLEL_TABS), 'tabs...');
  for (let i = 0; i < MAX_PARALLEL_TABS; i++) {
    const page = await newPage(browser);
    availablePages.push(page);
    allPages.push(page);
  }

  const pagePromises = [];
  const testErrors = [];
  let testNumber = 0;
  for (const webpage of webpages) {
    const {name: pageName, viewport} = webpage;
    let hasWarnings = false;
    for (const [testName, testFunction] of Object.entries(webpage.tests_)) {
      // Chrome supports redirecting <anything>.localhost to localhost, while
      // respecting domain name boundaries. This allows each test to be
      // sandboxed from other tests, with respect to things like cookies and
      // localStorage. Since Puppeteer only ever executes on Chrome, this is
      // fine.
      const fullUrl = `http://${testNumber++}.${HOST}:${PORT}/${webpage.url}`;
      while (availablePages.length == 0) {
        await sleep(WAIT_FOR_TABS_MS);
      }
      const [page] = availablePages;
      availablePages.shift();

      const name = testName ? `${pageName} (${testName})` : pageName;
      log(
        'info',
        drawBoxes(allPages, availablePages, page, yellow('▄')),
        'Starting test',
        yellow(name)
      );

      await resetPage(page, viewport);

      const consoleMessages = [];
      const consoleLogger = (consoleMessage) => {
        consoleMessages.push(consoleMessage);
      };
      page.on('console', consoleLogger);

      const pagePromise = (async () => {
        try {
          log('verbose', 'Navigating to page', yellow(webpage.url));
          await page.goto(fullUrl, {waitUntil: 'networkidle0'});

          log(
            'verbose',
            'Page navigation of test',
            yellow(name),
            'is done, verifying page'
          );
        } catch (navigationError) {