Can add the 'refreshOffline' event

[Zane0816]

I want my pwa app to display a banner added to the home screen, this event is essential

[NekR]

Hello. How this event affects the banner? You want to refresh your PWA when new version is available?

[Zane0816]

If I add this event to my PWA app, Chrome for Android will display a banner added to the home screen. If there is no such event, it won't. The only thing this event needs to do is return to appShell.

[NekR]

Can you please describe in a bit more details how it supposed to work. Chrome shows "add to homescreen" mini-info-bar when you have a manifest.json file and your ServiceWorker returns something when the page is offline. So it supposed to work without any additional events from this plugin.

[Zane0816]

My question is similar https://stackoverflow.com/questions/44393892/chrome-not-showing-add-to-homescreen-in-my-pwa my manifest.json :

{
  "short_name": "MyPWA",
  "name": "MyPWA",
  "icons": [
    {
      "src": "/Logo.png",
      "sizes": "512x512",
      "type": "image/png"
    },
    {
      "src": "/Logo.png",
      "sizes": "144x144",
      "type": "image/png"
    },
    {
      "src": "/Logo.png",
      "sizes": "192x192",
      "type": "image/png"
    }
  ],
  "theme_color": "transparent",
  "background_color": "transparent",
  "start_url": "/",
  "display": "standalone"
}

if i add this in my custom sw.js

self.addEventListener('refreshOffline', function(response) {
    //to do something
});

When I open my PWA app, it will display the "add tohomescreen" prompt.

If I only use "offline-plugin", the service worker works fine, but just does not display the "add to homescreen"' prompt.

I am troubled by this problem.

If "offline-plugin" adds a "refreshOffline" event, I don't need to add it.

[NekR]

Well, ServiceWorker doesn't have refreshOffline event. Even if it exists in chrome, it's non-standard. Can you please show your offline-plugin config? Maybe I'll be able to help you that way.

[Zane0816]

ok,my offline-plugin config is

{
      appShell: '/',
      updateStrategy: 'changed',
      version: IsProduction ? pkg.version : null,
      autoUpdate: 1000 * 60 * 60,
      ServiceWorker: {
        events: true
      },
 }

in my entry

import * as OfflinePluginRuntime from 'offline-plugin/runtime'

OfflinePluginRuntime.install({
  onUpdating () {
    console.log('SW Event:', 'onUpdating')
  },
  onUpdateReady () {
    console.log('SW Event:', 'onUpdateReady')
    OfflinePluginRuntime.applyUpdate()
  },
  onUpdated () {
    console.log('SW Event:', 'onUpdated')
    if (confirm('Page content updated, reloaded?')) {
      window.swUpdate = true
      location.reload()
    }
  },
  onUpdateFailed () {
    console.log('SW Event:', 'onUpdateFailed')
  }
})

[NekR]

Hmm, weird, all seems good 🤔

вт, 7 мая 2019 г., 5:07 张平 [email protected]:

ok,my offline-plugin config is

{ appShell: '/', updateStrategy: 'changed', version: IsProduction ? pkg.version : null, autoUpdate: 1000 * 60 * 60, ServiceWorker: { events: true }, }

in my entry

import * as OfflinePluginRuntime from 'offline-plugin/runtime' OfflinePluginRuntime.install({ onUpdating () { console.log('SW Event:', 'onUpdating') }, onUpdateReady () { console.log('SW Event:', 'onUpdateReady') OfflinePluginRuntime.applyUpdate() }, onUpdated () { console.log('SW Event:', 'onUpdated') if (confirm('Page content updated, reloaded?')) { window.swUpdate = true location.reload() } }, onUpdateFailed () { console.log('SW Event:', 'onUpdateFailed') } })

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/NekR/offline-plugin/issues/449#issuecomment-489878535, or mute the thread https://github.com/notifications/unsubscribe-auth/AAJCLEM3QVLBP5XVNWGNLO3PUDP4XANCNFSM4HDGGHAA .

[Zane0816]

I create a demo OfflineDemo in github When I access OfflineDemo with Chrome on my Android phone, I don't see the "Add to Home Screen" prompt.