Actualizar 'app.js'

app.js

@@ -1,61 +1,35 @@
 class Setup {
   async run() {
+    this.statusEl = document.createElement("p")
+    document.body.appendChild(this.statusEl)
+    this.updateStatus()
+    this.addEventListener('controllerchange', () => {
+      this.updateStatus()
+    })
     await this.register()
-        const p = document.createElement("p")
+    this.updateStatus()
-        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 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 unregister() {
+  updateStatus() {
-        if ('serviceWorker' in navigator) {
+    if (this.registration?.installing) {
-            try {
+      this.serviceWorkerStatus = "installing"
-                const regs = await navigator.serviceWorker.getRegistrations()
+    } else if (this.registration?.waiting) {
-                const res = await Promise.allSettled(
+      this.serviceWorkerStatus = "waiting"
-                    regs.map(reg => reg.unregister())
+    } else if (this.registration?.active) {
-                )
+      this.serviceWorkerStatus = "active"
-                this.serviceWorkerStatus = (
-                    res.every(pr => pr.status === 'fulfilled') ?
-                    'unregistered' :
-                    'error'
-                )
-            } catch (err) {
-                console.error("error in unregister", err)
-            }
     } else {
-            this.serviceWorkerStatus = 'unavailable'
+      this.serviceWorkerStatus = "not installed"
     }
     this.statusEl.innerText = this.serviceWorkerStatus
   }