@3cr/viewer-browser 0.0.150 → 0.0.152

package/index.html

@@ -23,12 +23,15 @@
         { userID: undefined },
         {environment: {tier: 'production'}}
     );
+
+    const replayer = new SessionReplay(client);
+    console.log(replayer)
+
     runStatsigAutoCapture(client);
     window.playgroundStatsigClient = client
     runStatsigSessionReplay(client);
 
-    const replayer = new SessionReplay(client);
-    console.log(replayer)
+
 
     const dynamicConfig = window.playgroundStatsigClient.getDynamicConfig("3cr_viewer_version");
     const version = dynamicConfig.value["sdkVersion"] ?? "1.0.0";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@3cr/viewer-browser",
-  "version": "0.0.150",
+  "version": "0.0.152",
   "main": "./dist/Viewer3CR.umd.js",
   "module": "dist/Viewer3CR.umd.js",
   "homepage": "https://docs.3cr.singular.health",

package/playground/index.html

@@ -7,6 +7,12 @@
   <link rel="preconnect" href="https://fonts.googleapis.com" />
   <script src="https://cdn.jsdelivr.net/npm/@3cr/viewer-browser@{{version}}/dist/Viewer3CR.umd.js"> </script>
   <script type="module">
+    function invokeServiceWorkerUpdateFlow(registration) {
+      if (registration.waiting) {
+        // let waiting Service Worker know it should became active
+        registration.waiting.postMessage('SKIP_WAITING')
+      }
+    }
     function initServiceWorker() {
       // Only enable service worker in production
       if ("serviceWorker" in navigator) {
@@ -17,10 +23,44 @@
                   "[CHECK]: Service_Worker_Registered_With_Scope",
                   registration.scope
               );
+              // ensure the case when the updatefound event was missed is also handled
+              // by re-invoking the prompt when there's a waiting Service Worker
+              if (registration.waiting) {
+                invokeServiceWorkerUpdateFlow(registration)
+              }
+
+              // detect Service Worker update available and wait for it to become installed
+              registration.addEventListener('updatefound', () => {
+                if (registration.installing) {
+                  // wait until the new Service worker is actually installed (ready to take over)
+                  registration.installing.addEventListener('statechange', () => {
+                    if (registration.waiting) {
+                      // if there's an existing controller (previous Service Worker), show the prompt
+                      if (navigator.serviceWorker.controller) {
+                        invokeServiceWorkerUpdateFlow(registration)
+                      } else {
+                        // otherwise it's the first install, nothing to do
+                        console.log('Service Worker initialized for the first time')
+                      }
+                    }
+                  })
+                }
+              })
+
+              let refreshing = false;
+
+              // detect controller change and refresh the page
+              navigator.serviceWorker.addEventListener('controllerchange', () => {
+                if (!refreshing) {
+                  window.location.reload()
+                  refreshing = true
+                }
+              })
             })
             .catch((error) => {
               console.error("[ERR]: Service_Worker_Registration_Failed:", error);
             });
+
       }
     }
 
@@ -47,6 +87,8 @@
         { userID: undefined },
         {environment: {tier: 'production'}}
     );
+    const replayer = new SessionReplay(client);
+    console.log(replayer)
     runStatsigAutoCapture(client);
     window.playgroundStatsigClient = client
     runStatsigSessionReplay(client);
@@ -54,8 +96,7 @@
     const dynamicConfig = window.playgroundStatsigClient.getDynamicConfig("3cr_viewer_version");
     const version = dynamicConfig.value["sdkVersion"] ?? "1.0.0";
 
-    const replayer = new SessionReplay(client);
-    console.log(replayer)
+
 
 
     client.initializeAsync().then(() => {

package/playground/sw.js

@@ -1,3 +1,18 @@
+// Service Worker-based solution
+self.addEventListener("activate", async () => {
+  // after we've taken over, iterate over all the current clients (windows)
+  const tabs = await self.clients.matchAll({ type: "window" });
+  tabs.forEach((tab) => {
+    // ...and refresh each one of them
+    tab.navigate(tab.url);
+  });
+});
+
+self.addEventListener("message", (event) => {
+  if (event.data === "SKIP_WAITING") {
+    self.skipWaiting().then((r) => {});
+  }
+});
 self.addEventListener("fetch", (event) => {
   event.respondWith(handleServerRequest(event.request));
 });