ServiceWorker being replaced after page reload

[mwidmann]

I am facing an issue with using the OneSignal module. Sometimes after a page reload the service worker in use is the OneSignalServiceWorker.js, sometimes sw.js with an error in the console

installWorker - SW's 'controllerchange' fired but no state change!

In this case running OneSignal.sendSelfNotification() from the console in the DevTools produces an error

Uncaught (in promise) g: This operation can only be performed after the user is subscribed.
    at Function.<anonymous> (https://cdn.onesignal.com/sdks/OneSignalPageSDKES6.js?v=151104:1:250797)
    at Generator.next (<anonymous>)
    at r (https://cdn.onesignal.com/sdks/OneSignalPageSDKES6.js?v=151104:1:716)

To reproduce the effect I performed the following steps:

npx create-nuxt-app nuxt-test-push-notifications

The settings are as follows:

create-nuxt-app v3.4.0
✨  Generating Nuxt.js project in nuxt-test-push-notifications
? Project name: nuxt-test-push-notifications
? Programming language: JavaScript
? Package manager: Npm
? UI framework: None
? Nuxt.js modules: Progressive Web App (PWA)
? Linting tools: (Press <space> to select, <a> to toggle all, <i> to invert selection)
? Testing framework: None
? Rendering mode: Universal (SSR / SSG)
? Deployment target: Server (Node.js hosting)
? Development tools: jsconfig.json (Recommended for VS Code if you're not using typescript)
? What is your GitHub username? martin widmann
? Version control system: Git

After all the setup is done, I changed nuxt.config.js to look like this:

export default {
  server: {
    port: 8080,
    host: '0.0.0.0',
  },
  head: {
    title: 'nuxt-test-push-notifications',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: '' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },

  css: [
  ],

  plugins: [
  ],

  components: true,

  buildModules: [
  ],

  modules: [
    '@nuxtjs/onesignal',
    '@nuxtjs/pwa',
  ],

  oneSignal: {
    init: {
      appId: 'REDACTED',
      allowLocalhostAsSecureOrigin: true,
    }
  },

  pwa: {
    workbox: {
      config: {
        debug: true
      }
    }
  },

  build: {
  }
}

I then run it with npm run build && npm run start to not fall into the self destroying sw mode.

I set up a test project in OneSignal and for local SSL I'm proxying the nodejs server running on localhost:8080 through an Apache with self signed (and registerd) SSL certs running on port 80.

When I reload the page leaving the Application Tab open, I can see the Service Worker being OneSignalServiceWorker.js and directly being replaced by sw.js.

Any idea why I am facing this issue?

[mwidmann]

Found this issue on the pwa-module issue tracker which seems to be related to my problem. Seems that adding the following

  pwa: {
    workbox: {
      swURL: 'OneSignalSDKWorker.js',
      ...
    }
  },

To the nuxt.config.js fixes this issue for me. At least the sw is not replaced anymore and I can test push notifications with OneSignal.sendSelfNotification() any time I tried.

[i-defranca]

any updates on this?

[lopermo]

Still impossible to use this module...
Can @pi0 take a look, please?

[Oldwo1f]

i have the same issue, sometimes i get onesignal service worker (and i am able to recieve push) sometimes i get the normal sw.js (and i am not able to recieve push)