add setting to always show push notifications

src/components/settings_modal/tabs/notifications_tab.vue

@@ -19,7 +19,7 @@
           </div>
         </li>
         <li>
-          <BooleanSetting path="unseenAtTop">
+          <BooleanSetting path="unseenAtTop" expert="1">
             {{ $t('settings.notification_setting_unseen_at_top') }}
           </BooleanSetting>
         </li>
@@ -38,6 +38,7 @@
         </li>
         <li>
           <h3> {{ $t('settings.notification_visibility') }}</h3>
+          <p v-if="expertLevel > 0">{{ $t('settings.notification_setting_filters_chrome_push') }}</p>
           <ul class="setting-list two-column">
             <li>
               <h4> {{ $t('settings.notification_visibility_mentions') }}</h4>
@@ -233,6 +234,21 @@
           >
             {{ $t('settings.enable_web_push_notifications') }}
           </BooleanSetting>
+          <ul class="setting-list suboptions">
+            <li>
+              <BooleanSetting
+                path="webPushAlwaysShowNotifications"
+                :disabled="!mergedConfig.webPushNotifications"
+              >
+                {{ $t('settings.enable_web_push_always_show') }}
+              </BooleanSetting>
+              <div :class="{ faint: !mergedConfig.webPushNotifications }">
+                <small>
+                  {{ $t('settings.enable_web_push_always_show_tip') }}
+                </small>
+              </div>
+            </li>
+          </ul>
         </li>
         <li>
           <BooleanSetting

src/i18n/en.json

@@ -699,12 +699,15 @@
     "notification_setting_ignore_inactionable_seen_tip": "This will not actually mark those notifications as read, and you'll still get desktop notifications about them if you chose so",
     "notification_setting_unseen_at_top": "Show unread notifications above others",
     "notification_setting_filters": "Filters",
+    "notification_setting_filters_chrome_push": "On some browsers (chrome) it might be impossible to completely filter out notifications by type when they arrive by Push",
     "notification_setting_block_from_strangers": "Block notifications from users who you do not follow",
     "notification_setting_privacy": "Privacy",
     "notification_setting_hide_notification_contents": "Hide the sender and contents of push notifications",
     "notification_mutes": "To stop receiving notifications from a specific user, use a mute.",
     "notification_blocks": "Blocking a user stops all notifications as well as unsubscribes them.",
     "enable_web_push_notifications": "Enable web push notifications",
+    "enable_web_push_always_show": "Always show web push notifications",
+    "enable_web_push_always_show_tip": "Some browsers (Chromium, Chrome) require that push messages always result in a notification, otherwise generic 'Website was updated in background' is shown, enable this to prevent this notification from showing. Can result in showing duplicate notifications on other browsers.",
     "more_settings": "More settings",
     "style": {
       "switcher": {

src/modules/config.js

@@ -79,6 +79,7 @@ export const defaultState = {
     polls: true
   },
   webPushNotifications: false,
+  webPushAlwaysShowNotifications: false,
   muteWords: [],
   highlight: {},
   interfaceLanguage: browserLocale,

src/sw.js

@@ -29,6 +29,7 @@ const setSettings = async () => {
   const locale = vuexState.config.interfaceLanguage || 'en'
   i18n.locale = locale
   const notificationsNativeArray = Object.entries(vuexState.config.notificationNative)
+  state.webPushAlwaysShowNotifications = vuexState.config.webPushAlwaysShowNotifications
 
   state.allowedNotificationTypes = new Set(
     notificationsNativeArray
@@ -62,7 +63,7 @@ const showPushNotification = async (event) => {
   const activeClients = await getWindowClients()
   await setSettings()
   // Only show push notifications if all tabs/windows are closed
-  if (activeClients.length === 0) {
+  if (state.webPushAlwaysShowNotifications || activeClients.length === 0) {
     const data = event.data.json()
 
     const url = `${self.registration.scope}api/v1/notifications/${data.notification_id}`
@@ -72,7 +73,7 @@ const showPushNotification = async (event) => {
 
     const res = prepareNotificationObject(parsedNotification, i18n)
 
-    if (state.allowedNotificationTypes.has(parsedNotification.type)) {
+    if (state.webPushAlwaysShowNotifications || state.allowedNotificationTypes.has(parsedNotification.type)) {
       return self.registration.showNotification(res.title, res)
     }
   }