renaming

Author: mschile

packages/proxy/lib/http/util/service-worker-rewriter.ts

@@ -6,7 +6,7 @@
  * @returns the rewritten service worker
  */
 export const rewriteServiceWorker = (body: Buffer) => {
-  function __cypressCreateListenerFunction (listener) {
+  function __cypressWrapListener (listener: Function) {
     return (event) => {
       // we want to override the respondWith method so we can track if it was called
       // to determine if the service worker handled the request
@@ -28,50 +28,60 @@ export const rewriteServiceWorker = (body: Buffer) => {
     }
   }
 
-  function __cypressOverwriteAddRemoveEventListener () {
-    const _listeners = new WeakMap()
-    const _capturedListeners = new WeakMap()
-    const _handleEvents = new WeakMap()
+  function __cypressOverwriteAddRemoveEventListeners () {
+    const _nonCaptureListenersMap = new WeakMap<EventListenerOrEventListenerObject, EventListenerOrEventListenerObject>()
+    const _captureListenersMap = new WeakMap<EventListenerOrEventListenerObject, EventListenerOrEventListenerObject>()
+    const _handleEventsMap = new WeakMap<Object, EventListenerOrEventListenerObject>()
 
-    const canWrapListener = (listener) => {
+    // A listener is considered valid if it is a function, an object with a handleEvent method, or an object (the handleEvent function could be added later)
+    const isValidListener = (listener: EventListenerOrEventListenerObject) => {
       return typeof listener === 'function' || listener?.handleEvent || typeof listener === 'object'
     }
 
+    // Get the capture value from the options
+    const getCaptureValue = (options?: boolean | AddEventListenerOptions) => {
+      return typeof options === 'boolean' ? options : options?.capture
+    }
+
     const oldAddEventListener = self.addEventListener
 
-    // Overwrite the addEventListener method so we can
-    // determine if the service worker handled the request
+    // Overwrite the addEventListener method so we can determine if the service worker handled the request
+    // https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener
     self.addEventListener = (type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => {
-      if (type === 'fetch' && canWrapListener(listener)) {
+      if (type === 'fetch' && isValidListener(listener)) {
         let newListener
 
         // If the listener is a function, we can just wrap it
         // If the listener is an object with a handleEvent method, we can wrap that method
         // Otherwise, we need to wrap the listener in a proxy so we can track and wrap the handleEvent function
         if (typeof listener === 'function') {
-          newListener = __cypressCreateListenerFunction(listener)
+          newListener = __cypressWrapListener(listener)
         } else if (listener?.handleEvent) {
-          newListener = __cypressCreateListenerFunction(listener.handleEvent)
+          newListener = __cypressWrapListener(listener.handleEvent)
           listener.handleEvent = newListener
         } else {
+          // since the handleEvent function is being lazily created, we need to use a proxy to wrap it
           newListener = new Proxy(listener, {
             get (target, key) {
               if (key === 'handleEvent') {
-                if (!_handleEvents.has(target)) {
-                  _handleEvents.set(target, __cypressCreateListenerFunction(target.handleEvent))
+                const values = _handleEventsMap.get(target)
+
+                if (!values) {
+                  // TODO: also check if the handleEvent function has changed
+                  _handleEventsMap.set(target, __cypressWrapListener(target.handleEvent))
                 }
 
-                return _handleEvents.get(target)
+                return _handleEventsMap.get(target)
               }
 
               return Reflect.get(target, key)
             },
           })
         }
 
-        const capture = typeof options === 'boolean' ? options : options?.capture
-
-        capture ? _capturedListeners.set(listener, newListener) : _listeners.set(listener, newListener)
+        // get the capture value so we know which map to add the listener to
+        // so we can then remove the listener later if requested
+        getCaptureValue(options) ? _captureListenersMap.set(listener, newListener) : _nonCaptureListenersMap.set(listener, newListener)
 
         return oldAddEventListener(type, newListener, options)
       }
@@ -81,20 +91,22 @@ export const rewriteServiceWorker = (body: Buffer) => {
 
     const oldRemoveEventListener = self.removeEventListener
 
-    // Overwrite the removeEventListener method so we can
-    // remove the listener from the map
+    // Overwrite the removeEventListener method so we can remove the listener from the map
+    // https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/removeEventListener
     self.removeEventListener = (type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions) => {
-      if (type === 'fetch' && canWrapListener(listener)) {
-        const capture = typeof options === 'boolean' ? options : options?.capture
-        const newListener = capture ? _capturedListeners.get(listener) : _listeners.get(listener)
+      if (type === 'fetch' && isValidListener(listener)) {
+        // get the capture value so we know which map to remove the listener from
+        const capture = getCaptureValue(options)
+        const newListener = capture ? _captureListenersMap.get(listener) : _nonCaptureListenersMap.get(listener)
 
-        capture ? _capturedListeners.delete(listener) : _listeners.delete(listener)
+        capture ? _captureListenersMap.delete(listener) : _nonCaptureListenersMap.delete(listener)
 
+        // If the listener is an object with a handleEvent method, we need to remove the wrapped function
         if (typeof listener === 'object' && typeof listener.handleEvent === 'function') {
-          _handleEvents.delete(listener)
+          _handleEventsMap.delete(listener)
         }
 
-        return oldRemoveEventListener(type, newListener, options)
+        return oldRemoveEventListener(type, newListener!, options)
       }
 
       return oldRemoveEventListener(type, listener, options)
@@ -126,7 +138,7 @@ export const rewriteServiceWorker = (body: Buffer) => {
           let newHandler
 
           if (value) {
-            newHandler = __cypressCreateListenerFunction(value)
+            newHandler = __cypressWrapListener(value)
           }
 
           originalPropertyDescriptor.set?.call(this, newHandler)
@@ -136,8 +148,8 @@ export const rewriteServiceWorker = (body: Buffer) => {
   }
 
   const updatedBody = `
-${__cypressCreateListenerFunction};
-(${__cypressOverwriteAddRemoveEventListener})();
+${__cypressWrapListener};
+(${__cypressOverwriteAddRemoveEventListeners})();
 (${__cypressOverwriteOnfetch})();
 ${body}`