Merge pull request #71 from simpleanalytics/codex/implement-fix-for-sendbeacon-error

Handle sendBeacon edge cases

Author: adriaandotcom

dist/latest/latest.dev.js

@@ -1,4 +1,4 @@
-/* Simple Analytics - Privacy-first analytics (docs.simpleanalytics.com/script; 2025-05-30; 1686; v12) */
+/* Simple Analytics - Privacy-first analytics (docs.simpleanalytics.com/script; 2025-05-30; bf05; v12) */
 /* eslint-env browser */
 
 (function (
@@ -559,7 +559,13 @@
         // sendData will assign payload to request
         sendData(append, undefinedVar, trueVar);
       } else {
-        nav.sendBeacon(fullApiUrl + "/append", stringify(append));
+        try {
+          nav.sendBeacon
+            .bind(nav)(fullApiUrl + "/append", stringify(append));
+        } catch (e) {
+          // Fallback for browsers throwing "Illegal invocation" when the URL is invalid
+          sendData(append, undefinedVar, trueVar);
+        }
       }
     };
 

package-lock.json

@@ -638,7 +638,12 @@
         // sendData will assign payload to request
         sendData(append, undefinedVar, trueVar);
       } else {
-        nav.sendBeacon(fullApiUrl + "/append", stringify(append));
+        try {
+          nav.sendBeacon.bind(nav)(fullApiUrl + "/append", stringify(append));
+        } catch (e) {
+          // Fallback for browsers throwing "Illegal invocation" when the URL is invalid
+          sendData(append, undefinedVar, trueVar);
+        }
       }
     };
 

src/default.js

@@ -34,4 +34,34 @@ describe("pageview", function () {
       done();
     }, 10);
   });
+
+  it("falls back to pixel when sendBeacon fails", function (done) {
+    const dom = createDOM({ navigationType: "reload" });
+
+    dom.window.navigator.sendBeacon = function () {
+      throw new TypeError("Illegal invocation");
+    };
+
+    dom.window.sa_event("unit_test");
+
+    if (!("onpagehide" in dom.window)) {
+      dom.window.document.hidden = true;
+      dom.window.document.dispatchEvent(
+        new dom.window.Event("visibilitychange")
+      );
+    } else {
+      dom.window.dispatchEvent(new dom.window.Event("pagehide"));
+    }
+
+    setTimeout(() => {
+      const beacon = dom.sent.find((r) => r.type === "beacon");
+      const appendGif = dom.sent.find(
+        (r) => r.type === "image" && /type=append/.test(r.url)
+      );
+
+      expect(beacon, "append beacon request").to.not.exist;
+      expect(appendGif, "append gif request").to.exist;
+      done();
+    }, 10);
+  });
 });