[Help Wanted] New versions of the app is not visible

[agentmilindu]

I'm developing a product which uses this amazing Offline Plugin. But I have a little issue, most probably me messing with the configs, please help me.

Users are complaining they don't see the new versions unless they refresh the page again. I see / being served from service worker. In our scenario, users know the features beforehand and we need to make sure they get the latest version without asking them to refresh.

I see / in the cache and sometimes having 2,3 versions old caches on some users. How can I exclude this from caching? We are okay with the index's page load time as it is a very small file, our main.<hash>.js is what contains all the app contents.

We want users who go to / get the latest index content which has the latest main.<hash>.js without refreshing. Please help us.

[agentmilindu]

My initial config was as follows,

    new OfflinePlugin({
      relativePaths: false,
      publicPath: '/',
      caches: {
        main: [':rest:'],
        excludes: ['.htaccess'],
        additional: ['*.chunk.js'],
      },
      // removes warning for about `additional` section usage
      safeToUseOptionalCaches: true,
      AppCache: false,
    }),

My current config is al follows,

    new OfflinePlugin({
      relativePaths: false,
      publicPath: '/',
      appShell: '/',
      caches: {
        main: [':rest:'],
        excludes: ['.htaccess', '/', '/auth/login', 'index.html'],
        additional: ['*.chunk.js'],
      },
      ServiceWorker: {
        events: true,
      },
      // removes warning for about `additional` section usage
      safeToUseOptionalCaches: true,
      AppCache: false,
    }),

also having this part now,

OfflinePluginRuntime.install({
    onUpdateReady: () => {
      console.log('ready to update from service woker');
      OfflinePluginRuntime.applyUpdate();
    },
    onUpdated: () => {
      console.log('updating from service worker');
      window.location.reload(true);
    },
  });

[GGAlanSmithee]

@agentmilindu

Cannot see any obvious misstakes in your config, a couple of questions:

1. Is your index.html generated by webpack (i.e. via html-webpack-plugin)?
2. Have you completely removed the service-worker after updating your config so that it's using the newest version?
3. Have you made sure that your server is not caching the service-worker? (Cache-Control: no-store).
4. Does your exclude pattern exactly match or actually include the actual index asset being served?
5. Does the registered events fire at all?

Here are some issues that might be related:

• https://github.com/NekR/offline-plugin/issues/24
• https://github.com/NekR/offline-plugin/issues/51