Actualizar 'app.js'

app.js

@@ -1,64 +1,38 @@
 class Setup {
-    async run() {
-        await this.register()
-        const p = document.createElement("p")
-        p.innerText = this.serviceWorkerStatus
-        document.body.appendChild(p)
-        this.statusEl = p
-        const btn = document.createElement('button')
-        btn.addEventListener('click', () => this.unregister())
-        btn.innerText = 'unregister'
-        const p2 = document.createElement('p')
-        document.body.appendChild(p2)
-        p2.appendChild(btn)
-    }
+  async run() {
+    this.statusEl = document.createElement("p")
+    document.body.appendChild(this.statusEl)
+    this.updateStatus()
+    this.addEventListener('controllerchange', () => {
+      this.updateStatus()
+    })
+    await this.register()
+    this.updateStatus()
+  }
 
-    async register() {
-        this.serviceWorkerStatus = "unavailable"
-        if ("serviceWorker" in navigator) {
-            try {
-                this.registration = await navigator.serviceWorker.register(
-                    "/sw.js",
-                    {scope: "/"}
-                )
-                if (this.registration.installing) {
-                    this.serviceWorkerStatus = "installing"
-                } else if (this.registration.waiting) {
-                    this.serviceWorkerStatus = "waiting"
-                } else if (this.registration.active) {
-                    this.serviceWorkerStatus = "active"
-                } else {
-                    this.serviceWorkerStatus = "unknown"
-                }
-            } catch (err) {
-                console.error("error registering service worker", err)
-                this.serviceWorkerStatus = "error"
-            }
-        } else {
-            console.error("serviceWorker not available")
-        }
+  async register() {
+    try {
+      this.registration = await navigator.serviceWorker.register(
+        "/sw.js",
+        {scope: "/"}
+      )
+    } catch (err) {
+      console.error("error registering service worker", err)
     }
+  }
 
-    async unregister() {
-        if ('serviceWorker' in navigator) {
-            try {
-                const regs = await navigator.serviceWorker.getRegistrations()
-                const res = await Promise.allSettled(
-                    regs.map(reg => reg.unregister())
-                )
-                this.serviceWorkerStatus = (
-                    res.every(pr => pr.status === 'fulfilled') ?
-                    'unregistered' :
-                    'error'
-                )
-            } catch (err) {
-                console.error("error in unregister", err)
-            }
-        } else {
-            this.serviceWorkerStatus = 'unavailable'
-        }
-        this.statusEl.innerText = this.serviceWorkerStatus
+  updateStatus() {
+    if (this.registration?.installing) {
+      this.serviceWorkerStatus = "installing"
+    } else if (this.registration?.waiting) {
+      this.serviceWorkerStatus = "waiting"
+    } else if (this.registration?.active) {
+      this.serviceWorkerStatus = "active"
+    } else {
+      this.serviceWorkerStatus = "not installed"
     }
+    this.statusEl.innerText = this.serviceWorkerStatus
+  }
 }
 
 new Setup().run()