@things-factory/shell 8.0.93 → 8.0.97

package/client/serviceworker/sw-src.js

@@ -114,13 +114,14 @@ if (production) {
 }
 
 /* for push notification */
-addEventListener('push', async event => {
+addEventListener('push', event => {
   if (!event.data) {
     return
   }
 
+  let notification, data
   try {
-    var { notification, data } = event.data.json()
+    ;({ notification, data } = event.data.json())
   } catch (e) {
     notification = {
       body: event.data.text()
@@ -136,22 +137,31 @@ addEventListener('push', async event => {
     data
   }
 
-  await notificationStore.add({
-    timestamp: Date.now(),
-    ...notification,
-    ...data
-  })
+  /**
+   * event.waitUntil로 showNotification까지 감싸야 한다.
+   * 안 감싸면 Chrome이 "푸시 왔는데 알림 미표시"로 판단해
+   * "이 사이트는 백그라운드에서 업데이트되었습니다" 대체 알림을 추가로 띄운다(중복).
+   * https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/showNotification
+   */
+  event.waitUntil(
+    (async () => {
+      await notificationStore.add({
+        timestamp: Date.now(),
+        ...notification,
+        ...data
+      })
 
-  await notificationStore.limit()
+      await notificationStore.limit()
 
-  channel.postMessage({
-    type: 'notification',
-    notification,
-    data
-  })
+      channel.postMessage({
+        type: 'notification',
+        notification,
+        data
+      })
 
-  /* https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerRegistration/showNotification */
-  registration.showNotification(title, options)
+      await registration.showNotification(title, options)
+    })()
+  )
 })
 
 addEventListener('notificationclick', async event => {