shadowwalker / next-pwa

Zero config PWA plugin for Next.js, with workbox 🧰
MIT License
3.75k stars 311 forks source link

Routes with `getStaticProps` result in client side error screen when offline #440

Open joshuawootonn opened 1 year ago

joshuawootonn commented 1 year ago

Summary

Pages that use getStaticProps have a runtime error on the offline page. If — after I have the runtime error — I refresh then I correctly hit the offline page.

Note (I noticed that refreshing showed the offline page because when testing Next 13 it "didn't have this problem." But actually it was just hard refreshing because of the client side error.

Versions

Note: I have tested 12.2 locally and it has the same behavior as 12.3 Note2: I have tested 13 and it automatically reloaded for me. So I never saw the client error screen.

How To Reproduce

I created this demo of me encountering the error in a minimal reproduction I made by extending the v2 offline demo:

joshuawootonn commented 1 year ago

This could be the problem with: https://github.com/shadowwalker/next-pwa/issues/379

smultar commented 1 year ago

This could be the problem with: https://github.com/shadowwalker/next-pwa/issues/379

This very well is the problem experienced in that issue.

shadowwalker commented 1 year ago

This is an interesting edge case, unfortunately there is no way to get routes and SSG pages info within webpack config during client side build. I was trying to get some work around solution. I got it mostly working, but still having some issues.

joshuawootonn commented 1 year ago

This is an interesting edge case, unfortunately there is no way to get routes and SSG pages info within webpack config during client side build. I was trying to get some work around solution. I got it mostly working, but still having some issues.

Thanks for taking a look / trying to figure it out. Is there a feature branch or any artifacts of the work you did? I am happy to contribute, but I might need a point in the right direction :)

dohomi commented 1 year ago

I am seeing the same error with dynamic routes except that I am using getServerSideProps instead of SSG pages

safoine27 commented 1 year ago

Any updates on this? I am also experiencing the same issue using getServerSideProps and I couldn't find any workaround for this

ltndat commented 1 year ago

Any updates on this? I am also experiencing the same issue using getServerSideProps and I couldn't find any workaround for this

I have at same issues with getServerSideProps. I try console.log in getServerSideProps function, it's have props data. But in the function component page/*.js it wasn't received.

It's not have solution for this case?

ltndat commented 1 year ago

I just found solution for this case. In the next.config.js file. You just need pass navigateFallback options to any not falsy, then you can navigate in your page by next/link. But i get bug with workbox.

image image