@percy/core 1.29.0-beta.0 → 1.29.0-beta.1

package/dist/discovery.js

@@ -64,10 +64,11 @@ function debugSnapshotOptions(snapshot) {
 function waitForDiscoveryNetworkIdle(page, options) {
   let {
     allowedHostnames,
-    networkIdleTimeout
+    networkIdleTimeout,
+    captureResponsiveAssetsEnabled
   } = options;
   let filter = r => hostnameMatches(allowedHostnames, r.url);
-  return page.network.idle(filter, networkIdleTimeout);
+  return page.network.idle(filter, networkIdleTimeout, captureResponsiveAssetsEnabled);
 }
 
 // Creates an initial resource map for a snapshot containing serialized DOM
@@ -174,18 +175,55 @@ async function* captureSnapshotResources(page, snapshot, options) {
     mobile,
     captureForDevices
   } = options;
+  let cookies;
+  if (process.env.PERCY_DO_NOT_USE_CAPTURED_COOKIES !== 'true') {
+    var _snapshot$domSnapshot;
+    cookies = snapshot === null || snapshot === void 0 ? void 0 : (_snapshot$domSnapshot = snapshot.domSnapshot) === null || _snapshot$domSnapshot === void 0 ? void 0 : _snapshot$domSnapshot.cookies;
+  }
+  if (typeof cookies === 'string' && cookies !== '') {
+    cookies = cookies.split('; ').map(c => c.split('='));
+    cookies = cookies.map(([key, value]) => {
+      return {
+        name: key,
+        value: value
+      };
+    });
+  }
+
+  // iterate over device to trigger reqeusts and capture other dpr width
+  async function* captureResponsiveAssets() {
+    for (const device of captureForDevices) {
+      discovery = {
+        ...discovery,
+        captureResponsiveAssetsEnabled: true
+      };
+
+      // We are not adding these widths and pixels ratios in loop below because we want to explicitly reload the page after resize which we dont do below
+      yield* captureSnapshotResources(page, {
+        ...snapshot,
+        discovery,
+        widths: [device.width]
+      }, {
+        deviceScaleFactor: device.deviceScaleFactor,
+        mobile: true
+      });
+      yield waitForDiscoveryNetworkIdle(page, discovery);
+    }
+  }
 
   // used to take snapshots and remove any discovered root resource
-  let takeSnapshot = async (options, width) => {
+  async function* takeSnapshot(options, width) {
     if (captureWidths) options = {
       ...options,
       width
     };
     let captured = await page.snapshot(options);
+    yield* captureResponsiveAssets();
     captured.resources.delete(normalizeURL(captured.url));
     capture(processSnapshotResources(captured));
     return captured;
-  };
+  }
+  ;
 
   // used to resize the using capture options
   let resizePage = width => page.resize({
@@ -197,7 +235,9 @@ async function* captureSnapshotResources(page, snapshot, options) {
 
   // navigate to the url
   yield resizePage(snapshot.widths[0]);
-  yield page.goto(snapshot.url);
+  yield page.goto(snapshot.url, {
+    cookies
+  });
   if (snapshot.execute) {
     // when any execute options are provided, inject snapshot options
     /* istanbul ignore next: cannot detect coverage of injected code */
@@ -226,25 +266,10 @@ async function* captureSnapshotResources(page, snapshot, options) {
     } = snap;
     let [width] = widths;
 
-    // iterate over device to trigger reqeusts and capture other dpr width
-    if (captureForDevices) {
-      for (const device of captureForDevices) {
-        yield waitForDiscoveryNetworkIdle(page, discovery);
-        // We are not adding these widths and pixels ratios in loop below because we want to explicitly reload the page after resize which we dont do below
-        yield* captureSnapshotResources(page, {
-          ...snapshot,
-          widths: [device.width]
-        }, {
-          deviceScaleFactor: device.deviceScaleFactor,
-          mobile: true
-        });
-      }
-    }
-
     // iterate over widths to trigger reqeusts and capture other widths
     if (isBaseSnapshot || captureWidths) {
       for (let i = 0; i < widths.length - 1; i++) {
-        if (captureWidths) yield takeSnapshot(snap, width);
+        if (captureWidths) yield* takeSnapshot(snap, width);
         yield page.evaluate(execute === null || execute === void 0 ? void 0 : execute.beforeResize);
         yield waitForDiscoveryNetworkIdle(page, discovery);
         yield resizePage(width = widths[i + 1]);
@@ -253,7 +278,7 @@ async function* captureSnapshotResources(page, snapshot, options) {
     }
     if (capture && !snapshot.domSnapshot) {
       // capture this snapshot and update the base snapshot after capture
-      let captured = yield takeSnapshot(snap, width);
+      let captured = yield* takeSnapshot(snap, width);
       if (isBaseSnapshot) baseSnapshot = captured;
 
       // resize back to the initial width when capturing additional snapshot widths
@@ -272,6 +297,7 @@ async function* captureSnapshotResources(page, snapshot, options) {
   // wait for final network idle when not capturing DOM
   if (capture && snapshot.domSnapshot) {
     yield waitForDiscoveryNetworkIdle(page, discovery);
+    yield* captureResponsiveAssets();
     capture(processSnapshotResources(snapshot));
   }
 }

package/dist/network.js

@@ -71,7 +71,7 @@ export class Network {
   }
 
   // Resolves after the timeout when there are no more in-flight requests.
-  async idle(filter = () => true, timeout = this.timeout) {
+  async idle(filter = () => true, timeout = this.timeout, captureResponsiveAssetsEnabled = false) {
     let requests = [];
     this.log.debug(`Wait for ${timeout}ms idle`, this.meta);
     await waitFor(() => {
@@ -91,11 +91,25 @@ export class Network {
       idle: timeout
     }).catch(error => {
       if (error.message.startsWith('Timeout')) {
-        this._throwTimeoutError('Timed out waiting for network requests to idle.', filter);
+        let message = 'Timed out waiting for network requests to idle.';
+        if (captureResponsiveAssetsEnabled) message += '\nWhile capturing responsive assets try setting PERCY_DO_NOT_CAPTURE_RESPONSIVE_ASSETS to true.';
+        this._throwTimeoutError(message, filter);
       } else {
         throw error;
       }
     });
+
+    // After waiting for network to idle check if there are still some request
+    const activeRequests = this.getActiveRequests(filter);
+    /* istanbul ignore if: race condition, very hard to mock this */
+    if (activeRequests.length > 0) {
+      this.log.debug(`There are ${activeRequests.length} active requests pending during asset discovery. Try increasing the networkIdleTimeout to resolve this issue. \n ${activeRequests}`);
+    }
+  }
+  getActiveRequests(filter) {
+    let requests = Array.from(this.#requests.values()).filter(filter);
+    requests = requests.filter(req => !this.#finishedUrls.has(req.url));
+    return requests;
   }
 
   // Validates that requestId is still valid as sometimes request gets cancelled and we have already executed

package/dist/page.js

@@ -41,19 +41,38 @@ export class Page {
       width
     });
   }
+  mergeCookies(userPassedCookie, autoCapturedCookie) {
+    if (!autoCapturedCookie) return userPassedCookie;
+    if (userPassedCookie.length === 0) return autoCapturedCookie;
+
+    // User passed cookie will be prioritized over auto captured cookie
+    const mergedCookies = [...userPassedCookie, ...autoCapturedCookie];
+    const uniqueCookies = [];
+    const names = new Set();
+    for (const cookie of mergedCookies) {
+      if (!names.has(cookie.name)) {
+        uniqueCookies.push(cookie);
+        names.add(cookie.name);
+      }
+    }
+    return uniqueCookies;
+  }
 
   // Go to a URL and wait for navigation to occur
   async goto(url, {
-    waitUntil = 'load'
+    waitUntil = 'load',
+    cookies
   } = {}) {
     this.log.debug(`Navigate to: ${url}`, this.meta);
     let navigate = async () => {
+      const userPassedCookie = this.session.browser.cookies;
       // set cookies before navigation so we can default the domain to this hostname
-      if (this.session.browser.cookies.length) {
+      if (userPassedCookie.length || cookies) {
         let defaultDomain = hostname(url);
+        cookies = this.mergeCookies(userPassedCookie, cookies);
         await this.session.send('Network.setCookies', {
           // spread is used to make a shallow copy of the cookie
-          cookies: this.session.browser.cookies.map(({
+          cookies: cookies.map(({
             ...cookie
           }) => {
             if (!cookie.url) cookie.domain || (cookie.domain = defaultDomain);

package/dist/timing.js

@@ -15,7 +15,7 @@ export default class TimeIt {
       return await callback();
     } finally {
       const duration = Date.now() - startTime;
-      this.log.info(`${name} - ${identifier} - ${duration / 1000}s`);
+      this.log.debug(`${name} - ${identifier} - ${duration / 1000}s`);
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@percy/core",
-  "version": "1.29.0-beta.0",
+  "version": "1.29.0-beta.1",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -43,11 +43,11 @@
     "test:types": "tsd"
   },
   "dependencies": {
-    "@percy/client": "1.29.0-beta.0",
-    "@percy/config": "1.29.0-beta.0",
-    "@percy/dom": "1.29.0-beta.0",
-    "@percy/logger": "1.29.0-beta.0",
-    "@percy/webdriver-utils": "1.29.0-beta.0",
+    "@percy/client": "1.29.0-beta.1",
+    "@percy/config": "1.29.0-beta.1",
+    "@percy/dom": "1.29.0-beta.1",
+    "@percy/logger": "1.29.0-beta.1",
+    "@percy/webdriver-utils": "1.29.0-beta.1",
     "content-disposition": "^0.5.4",
     "cross-spawn": "^7.0.3",
     "extract-zip": "^2.0.1",
@@ -60,5 +60,5 @@
     "ws": "^8.17.1",
     "yaml": "^2.4.1"
   },
-  "gitHead": "2d62f6ce1e9b7aa1430d186da00a2302884d92b2"
+  "gitHead": "719cb9b3c5e50cfe23b2e27ebfa2410f30443cd8"
 }