We are troubleshooting an error that happens intermittently on Safari mobile when navigating offline. The json and pages are added as additional manifest entries (see more info below). This works great on desktop and on Android. And sometimes it works on Safari, but other times it throws the offline error. It may work the first time it is installed, but not on the second install, even if all data is removed. It begins working again when connected.
And this does work consistently in desktop and in android. But Safari has this maddening issue.
The error is very similar to the issue described here, but our app uses "display":"standalone"
It seems like maybe there is a race condition between the service worker returning the fetch data and Safari getting ahead of it. Because it's the same error that happens when you try to navigate to an external link when offline.
Does this ring any bells? It's incredibly hard to troubleshoot because once offline, there is not way to debug it on mobile (that we can find). Any ideas are appreciated. As we have been troubleshooting this for weeks.
Summary
We are troubleshooting an error that happens intermittently on Safari mobile when navigating offline. The json and pages are added as additional manifest entries (see more info below). This works great on desktop and on Android. And sometimes it works on Safari, but other times it throws the offline error. It may work the first time it is installed, but not on the second install, even if all data is removed. It begins working again when connected.
Versions
next-pwa
: 5.5.6next
: 12.3.1How To Reproduce
Steps to reproduce the behavior:
Here is a minimal repo that exhibits the issue
Expected Behaviors
Safari should navigate to the various saved pages when offline.
Screenshots
Additional Context
The app uses the approach described in this fantastic article https://dev.to/sfiquet/precaching-pages-with-next-pwa-31f2#how-to-precache-pages to add additional manifest entries and precache the page and json files in the
next.config.js
:And this does work consistently in desktop and in android. But Safari has this maddening issue.
The error is very similar to the issue described here, but our app uses
"display":"standalone"
It seems like maybe there is a race condition between the service worker returning the fetch data and Safari getting ahead of it. Because it's the same error that happens when you try to navigate to an external link when offline.
Does this ring any bells? It's incredibly hard to troubleshoot because once offline, there is not way to debug it on mobile (that we can find). Any ideas are appreciated. As we have been troubleshooting this for weeks.