Capture service worker intercepted requests

packages/core/src/config.js

@@ -167,6 +167,10 @@ export const configSchema = {
       disableCache: {
         type: 'boolean'
       },
+      captureServiceWorker: {
+        type: 'boolean',
+        default: false
+      },
       requestHeaders: {
         type: 'object',
         normalize: false,
@@ -249,6 +253,7 @@ export const snapshotSchema = {
             requestHeaders: { $ref: '/config/discovery#/properties/requestHeaders' },
             authorization: { $ref: '/config/discovery#/properties/authorization' },
             disableCache: { $ref: '/config/discovery#/properties/disableCache' },
+            captureServiceWorker: { $ref: '/config/discovery#/properties/captureServiceWorker' },
             userAgent: { $ref: '/config/discovery#/properties/userAgent' },
             devicePixelRatio: { $ref: '/config/discovery#/properties/devicePixelRatio' }
           }

packages/core/src/discovery.js

@@ -52,6 +52,7 @@ function debugSnapshotOptions(snapshot) {
   debugProp(snapshot, 'discovery.requestHeaders', JSON.stringify);
   debugProp(snapshot, 'discovery.authorization', JSON.stringify);
   debugProp(snapshot, 'discovery.disableCache');
+  debugProp(snapshot, 'discovery.captureServiceWorker');
   debugProp(snapshot, 'discovery.userAgent');
   debugProp(snapshot, 'clientInfo');
   debugProp(snapshot, 'environmentInfo');
@@ -288,6 +289,7 @@ export function createDiscoveryQueue(percy) {
         requestHeaders: snapshot.discovery.requestHeaders,
         authorization: snapshot.discovery.authorization,
         userAgent: snapshot.discovery.userAgent,
+        captureServiceWorker: snapshot.discovery.captureServiceWorker,
         meta: snapshot.meta,
 
         // enable network inteception

packages/core/src/network.js

@@ -37,6 +37,7 @@
     this.timeout = options.networkIdleTimeout ?? 100;
     this.authorization = options.authorization;
     this.requestHeaders = options.requestHeaders ?? {};
+    this.captureServiceWorker = options.captureServiceWorker ?? false;
     this.userAgent = options.userAgent ??
       // by default, emulate a non-headless browser
       page.session.browser.version.userAgent.replace('Headless', '');
@@ -54,7 +55,7 @@
 
     let commands = [
       session.send('Network.enable'),
-      session.send('Network.setBypassServiceWorker', { bypass: true }),
+      session.send('Network.setBypassServiceWorker', { bypass: !this.captureServiceWorker }),
       session.send('Network.setCacheDisabled', { cacheDisabled: true }),
       session.send('Network.setUserAgentOverride', { userAgent: this.userAgent }),
       session.send('Network.setExtraHTTPHeaders', { headers: this.requestHeaders })
@@ -170,7 +171,7 @@
     this.#pending.delete(requestId);
 
     // guard against redirects with the same requestId
     pending?.request.url === event.request.url &&
     pending.request.method === event.request.method &&
     await this._handleRequest(session, { ...pending, resourceType, interceptId });
   }
@@ -178,13 +179,16 @@
   // Called when a request will be sent. If the request has already been intercepted, handle it;
   // otherwise set it to be pending until it is paused.
   _handleRequestWillBeSent = async event => {
-    let { requestId, request } = event;
+    let { requestId, request, type } = event;
 
     // do not handle data urls
     if (request.url.startsWith('data:')) return;
 
     if (this.intercept) {
       this.#pending.set(requestId, event);
+      if (this.captureServiceWorker) {
+        await this._handleRequest(undefined, { ...event, resourceType: type, interceptId: requestId }, true);
+      }
     }
     // release request
     // note: we are releasing this, even if intercept is not set for network.js
@@ -195,7 +199,7 @@
   // Called when a pending request is paused. Handles associating redirected requests with
   // responses and calls this.onrequest with request info and callbacks to continue, respond,
   // or abort a request. One of the callbacks is required to be called and only one.
-  _handleRequest = async (session, event) => {
+  _handleRequest = async (session, event, serviceWorker = false) => {
     let { request, requestId, interceptId, resourceType } = event;
     let redirectChain = [];
 
@@ -213,7 +217,9 @@
     request.redirectChain = redirectChain;
     this.#requests.set(requestId, request);
 
-    await sendResponseResource(this, request, session);
+    if (!serviceWorker) {
+      await sendResponseResource(this, request, session);
+    }
   }
 
   // Called when a response has been received for a specific request. Associates the response with

packages/core/src/snapshot.js

@@ -114,6 +114,7 @@ function getSnapshotOptions(options, { config, meta }) {
       requestHeaders: config.discovery.requestHeaders,
       authorization: config.discovery.authorization,
       disableCache: config.discovery.disableCache,
+      captureServiceWorker: config.discovery.captureServiceWorker,
       userAgent: config.discovery.userAgent
     }
   }, options], (path, prev, next) => {

packages/core/types/index.d.ts

@@ -18,6 +18,7 @@ interface DiscoveryOptions {
   authorization?: AuthCredentials;
   allowedHostnames?: string[];
   disableCache?: boolean;
+  captureServiceWorker?: boolean;
 }
 
 interface DiscoveryLaunchOptions {