Resolve sendOnClose bug to use fetch(), mocked fetch in tests, fixed …

…issues
apache · Jun 4, 2024 · 8fcbf85 · 8fcbf85
1 parent f98917c
commit 8fcbf85
Show file tree

Hide file tree

Showing 11 changed files with 111 additions and 28 deletions.
diff --git a/build/UserALEWebExtension/background.js b/build/UserALEWebExtension/background.js
diff --git a/build/UserALEWebExtension/background.js.map b/build/UserALEWebExtension/background.js.map
diff --git a/build/UserALEWebExtension/content.js b/build/UserALEWebExtension/content.js
diff --git a/build/UserALEWebExtension/content.js.map b/build/UserALEWebExtension/content.js.map
diff --git a/build/UserALEWebExtension/options.js b/build/UserALEWebExtension/options.js
diff --git a/build/UserALEWebExtension/options.js.map b/build/UserALEWebExtension/options.js.map
diff --git a/build/userale-2.4.0.js b/build/userale-2.4.0.js
diff --git a/build/userale-2.4.0.js.map b/build/userale-2.4.0.js.map
diff --git a/build/userale-2.4.0.min.js b/build/userale-2.4.0.min.js
diff --git a/src/sendLogs.ts b/src/sendLogs.ts
@@ -68,8 +68,27 @@ export function sendOnClose(
   config: Configuration,
 ): void {
   window.addEventListener("pagehide", function () {
-    if (config.on && logs.length > 0) {
-      navigator.sendBeacon(config.url, JSON.stringify(logs));
+    if (!config.on) {
+      return;
+    }
+
+    if (logs.length > 0) {
+      const headers: HeadersInit = new Headers();
+      headers.set("Content-Type", "applicaiton/json;charset=UTF-8");
+
+      if (config.authHeader) {
+        headers.set("Authorization", config.authHeader.toString());
+      }
+
+      fetch(config.url, {
+        keepalive: true,
+        method: "POST",
+        headers: headers,
+        body: JSON.stringify(logs),
+      }).catch((error) => {
+        console.error(error);
+      });
+
       logs.splice(0); // clear log queue
     }
   });

diff --git a/test/sendLogs.spec.ts b/test/sendLogs.spec.ts
@@ -100,34 +100,38 @@ describe("sendLogs", () => {
     done();
   });
 
-  it("sends logs on page exit with navigator", () => {
-    const sendBeaconSpy = jest.fn();
-    Object.defineProperty(global, "navigator", {
-      value: { sendBeacon: sendBeaconSpy },
-      writable: true,
-    });
+  it("sends logs on page exit with fetch", () => {
+    const fetchSpy = jest.fn().mockImplementation(() =>
+      Promise.resolve({
+        ok: true,
+        foo: "bar",
+      }),
+    );
+    global.fetch = fetchSpy;
 
     config.update({ on: true, url: "test" });
     sendOnClose([], config);
     config.update({ on: true, url: "test" });
     sendOnClose([{ foo: "bar" }], config);
     global.window.dispatchEvent(new window.CustomEvent("pagehide"));
 
-    expect(sendBeaconSpy).toHaveBeenCalledTimes(1);
+    expect(fetchSpy).toHaveBeenCalledTimes(1);
   });
 
   it("does not send logs on page exit when config is off", () => {
-    const sendBeaconSpy = jest.fn();
-    Object.defineProperty(global, "navigator", {
-      value: { sendBeacon: sendBeaconSpy },
-      writable: true,
-    });
+    const fetchSpy = jest.fn().mockImplementation(() =>
+      Promise.resolve({
+        ok: true,
+        foo: "bar",
+      }),
+    );
+    global.fetch = fetchSpy;
 
     config.update({ on: false, url: "test" });
     sendOnClose([{ foo: "bar" }], config);
     global.window.dispatchEvent(new window.CustomEvent("pagehide"));
 
-    expect(sendBeaconSpy).not.toHaveBeenCalled();
+    expect(fetchSpy).not.toHaveBeenCalled();
   });
 
   it("sends logs with proper auth header when using registerAuthCallback", (done) => {