fix: prevent service worker errors for first time users

Author: xbubbo

static/assets/js/search.js

@@ -1,9 +1,54 @@
-window.addEventListener("load", () => {
-  navigator.serviceWorker.register("../sw.js", {
-    scope: "/uv/",
-  });
+
+let swReady = false;
+let swReadyResolve;
+const swReadyPromise = new Promise(resolve => { swReadyResolve = resolve; });
+
+window.addEventListener("load", async () => {
+  if (!("serviceWorker" in navigator)) {
+    swReady = true;
+    swReadyResolve();
+    return;
+  }
+
+  try {
+    const registration = await navigator.serviceWorker.register("../sw.js", {
+      scope: "/uv/",
+    });
+
+    if (registration.active) {
+      swReady = true;
+      swReadyResolve();
+      return;
+    }
+
+    const worker = registration.installing || registration.waiting;
+    if (worker) {
+      worker.addEventListener("statechange", function onStateChange() {
+        if (this.state === "activated") {
+          swReady = true;
+          swReadyResolve();
+          worker.removeEventListener("statechange", onStateChange);
+        }
+      });
+    } else {
+      swReady = true;
+      swReadyResolve();
+    }
+  } catch (err) {
+    console.error("[SW] registration failed:", err);
+    swReady = true;
+    swReadyResolve();
+  }
 });
 
+async function waitForServiceWorker() {
+  if (swReady) return;
+  await Promise.race([
+    swReadyPromise,
+    new Promise(resolve => setTimeout(resolve, 4000)),
+  ]);
+}
+
 const form = document.getElementById("fv");
 const input = document.getElementById("input");
 
@@ -39,6 +84,8 @@ async function encodeUrl(url, proxyOverride) {
 }
 
 async function navigate(value, path, proxyOverride) {
+  await waitForServiceWorker();
+
   let url = value.trim();
   const engine = localStorage.getItem("engine");
   const searchUrl = engine ? engine : "https://search.brave.com/search?q=";
@@ -78,4 +125,4 @@ function useDynamic(value) {
 
 function isValidUrl(val = "") {
   return /^http(s?):\/\//.test(val) || (val.includes(".") && val[0] !== " ");
-}
+}

static/sw.js

@@ -13,6 +13,20 @@ const sj = new ScramjetServiceWorker();
 const userKey = new URL(location).searchParams.get("userkey");
 self.dynamic = dynamic;
 
+self.addEventListener("install", event => {
+  event.waitUntil(self.skipWaiting());
+});
+
+self.addEventListener("activate", event => {
+  event.waitUntil(self.clients.claim());
+});
+
+self.addEventListener("message", event => {
+  if (event.data?.type === "SKIP_WAITING") {
+    self.skipWaiting();
+  }
+});
+
 self.addEventListener("fetch", event => {
   event.respondWith(
     (async () => {
@@ -33,4 +47,4 @@ self.addEventListener("fetch", event => {
       return await fetch(event.request);
     })(),
   );
-});
+});