Workbox: Workbox doesn't cache in iOS standalone

[vanhtuan0409]

Library Affected:
workbox-sw
workbox-webpack-plugin

Browser & Platform:
iOS 11.4

Issue or Feature Request Description:
I trying to build a PWA that have the offline capability. I'm using workbox-webpack-plugin with InjectManifest class. The app runs well on Safari/Chrome (MacOS and iOS) under both online and offline condition. When I added to the app to home screen from Safari (iOS) and turn off internet connection, I got No connection page from Safari. I tried to debug from Safari but there are no error messages.

App URL: https://nordot-pwa.herokuapp.com/
Webpack config:

new InjectManifest({
      swSrc: path.resolve(paths.appSrc, "sw.js"),
      swDest: "service-worker.js",
      // Don't precache sourcemaps (they're large) and build asset manifest:
      exclude: [/\.map$/, /^(?:asset-)manifest.*\.js(?:on)?$/]
})

Sw.js:

console.log("Service worker is running!");

workbox.skipWaiting();
workbox.clientsClaim();

workbox.routing.registerNavigationRoute("/index.html", {
  whitelist: [/^(?!\/__).*/]
});

// Background sync for tracking post api
const bgSyncPlugin = new workbox.backgroundSync.Plugin("trackingQueue", {
  maxRetentionTime: 24 * 60 // Retry for max of 24 Hours
});
workbox.routing.registerRoute(
  /\/api\/.*\/*.json/,
  workbox.strategies.networkOnly({ plugins: [bgSyncPlugin] }),
  "POST"
);

workbox.precaching.precacheAndRoute(self.__precacheManifest);

When reporting bugs, please include relevant JavaScript Console logs and links to public URLs at which the issue could be reproduced.

[jeffposnick]

There's a bug in Safari's service worker implementation that prevented resources loaded by importScripts from being implicitly cached, as the service worker specification requires.

This has been fixed in Safari Technical Previews as of release 59, but I don't know how that translates into the version of Safari that's deployed on iOS 11.4.

My guess is that it explains what you're seeing, and if you have access to the Safari Technical Preview program on your iOS device, confirming that the latest version of Safari works as expected should be possible.

[vanhtuan0409]

@jeffposnick Thank you a lot for the response
The Safari browser is working OK. Only Standalone version (the app after added to home screen) have the problem. So I think this is the problem of iOS itself.
Do we have any workaround for this or we should wait for iOS update

[dcflow]

Hey @jeffposnick I put the workbox script inside the service worker but it still doesn't seem to work.
Is there any way to make this work?

[michalsnik]

I have the same problem using GenerateSW. Everything works nice in Safari itself but not after adding the page to the home screen. Ok it works partially - that is when I open the app while having the internet and then disable it - I can go through the app and assets are loading properly from cache - but if I go to home screen and then back to the app - it shouts there's no internet - just like the service-worker had been deleted and it can't load index.html from cache anymore.

[michalsnik]

Interestingly when I move precache manifest's content from separate file to the service-worker.js itself it works as expected 🤔 Do you have any idea why it might behave like this? @jeffposnick

[michalsnik]

In the end I decided to use sw-precache-webpack-plugin and now it works like a charm.

[jeffposnick]

Here's what seems to be the relevant, underlying bug in Safari: https://bugs.webkit.org/show_bug.cgi?id=190269

I'm going to leave this tracking bug against Workbox open for the time being, and we should loop back around once that WebKit bug fix makes it out to iOS Safari and confirm that it's fixed.

[joewoodhouse]

This appears to be working now in iOS12.1?

[musti-91]

does it work for you like that?
because I have the same configuration but it doesn't work for me!!😔
I mean for InjectManifet()

[alexandre-combemorel]

I also, lost my cache once I close Safari with iOS12.1.
It seems to still not be working.

[jeffposnick]

If folks on the latest iOS release still can reproduce issues, let us know and we can reopen.