Working with service worker for sync/push in DEV mode



  • Hi,

    Our app (PWA) use SW for 3 purposes :

    • Caching statics resources
    • Push notifications to user
    • Sync data with the server

    For productivity reason we need to be able to have SW active for the 2 last points in DEV mode : How can we manage ?
    Today, all the features working in PROD mode, but it’s not very efficient for debugging and adding new features on SYNC/PUSH…

    As I’ll understand the way to do it, I could send a PR to the doc…

    Working with Quasar 0.16

    Thanks !


  • Admin

    The main problem with SW on dev mode is that it breaks HMR (Hot Module Reload) since SW caching would be in effect. If you find a clever way to make both SW and HMR happy, I’d be thrilled to integrate the solution.



  • @rstoenescu I will find a solution 😀 keep on touche !



  • @rstoenescu I read the code from quasar-cli and I think, the solution could be like this…

    • Create (when generating app or whatever when) 2 other files in the src-pwa :

      • File one : push-service-worker.js : Which would be all in comment, but let the dev putting his code about listenning “push notification”
      • File two : sync-service-worker.js : Which would be all in comment, but let the dev putting his code about listenning “sync notification”
    • In “dev mode”, quasar-cli answer automatically to the GET service-worker.js with the no-op template : Perfect ! Just add the content of the two files above to the response

    • In “prod mode”, quasar-cli building the service-worker.js depending of options (params), let’s do the same and add the content of the two files above at the end of the file

    In a perfect world, user could define, in the quasar.conf.js 2 settings under the [pwa] section :

    • usePushServiceWorker : true/false | To add the push part to the generated SW
    • useSyncServiceWorker : true/false | To add the sync part to the generated SW

    I tried to make it work, but running Quasar-CLI on my PC was not so easy…

    Best regards



  • @sebastien-roul +1 for this solution. I try to create a PWA and it’s a little complicate for someone not having a huge background in PWA things. Actually my main difficulty is to deploy the created PWA and to be able to install it on a smartphone. I have no idea how to add Sync and Push service and Google Audits tells me my app does not register a service worker.
    @rstoenescu I think a PWA dedicated howto should be really appreciated.