I have a PWA written in Java using Vaadin and Jetty that detects when the app is offline, and if so, shows a screen that says "You are offline". On an iPad, when the browser is closed and opened again, the app shows "You are offline" even if it is not. It stays this way even when refreshing the page, the only way to recover is to clear the browser's cache. It works on other devices, even iPhone. I have a reproducer here: https://github.com/mperktold/vaadin14-embedded-jetty Steps to reproduce: 1. Run Main.java 2. Open https://<your-pc>:8443 on an iPad. 3. Close the browser. 4. Open the browser.
<rdar://problem/79715785>
Given that there hasn't been a response so far, is there anything I can add to help? Can you reproduce?
I tried using https://vaadin14-embedded-jetty.herokuapp.com/ but I do not see the "You are offline" message. I just see Your name + field + Say hello, both iPhone and iPad. Is that expected? How do you check for offline? Is it using navigator.onLine? Do you check in service worker or in window?
Yes, that is expected, so you cannot reproduce, and with your link I cannot reproduce either. The check is done by the framework, I think it is these two files: https://github.com/vaadin/flow/blob/master/flow-server/src/main/resources/com/vaadin/flow/server/frontend/sw.ts https://github.com/vaadin/flow/blob/master/client/packages/client-common/src/ConnectionState.ts It does involve navigator.onLine. One difference is that the certificate I am using for local development is not trustworthy. Is that relevant? It works in other browsers, once I ignore the warning about the certificate that is.
I don't think certificate would make a difference here. I tried again https://github.com/mperktold/vaadin14-embedded-jetty on an iPad and attached web inspector to the service worker immediately after opening the page. I then checked navigator.onLine value, which was as expected. I toggled network on/off and validated onLine is updated. I also put wifi off and validated 'you are offline' is shown. When I put wifi on again, the page gets refreshed. There could be a timing issue of course but I haven't found anything obvious. Is there a way you could provide a https://vaadin14-embedded-jetty.herokuapp.com/ version that does reproduce the issue for you? > It stays this way even when refreshing the page, the only way to recover is to clear the browser's cache. Could you check the value of navigator.onLine in the web page and in the service worker when you are in that case?
> I also put wifi off and validated 'you are offline' is shown. When I put wifi on again, the page gets refreshed. This works for me as well. But did you try to close the browser while you have the page open and online, and then open the browser again? That's the scenario that triggers the problem for me. > There could be a timing issue of course but I haven't found anything obvious. > Is there a way you could provide a https://vaadin14-embedded-jetty.herokuapp.com/ version that does reproduce the issue for you? > Could you check the value of navigator.onLine in the web page and in the service worker when you are in that case? At the moment, I am not able to do any of these, sorry. Will come back to it later if we don't figure it out in the meantime.
(In reply to Matthias Perktold from comment #6) > > I also put wifi off and validated 'you are offline' is shown. When I put wifi on again, the page gets refreshed. > > This works for me as well. But did you try to close the browser while you > have the page open and online, and then open the browser again? That's the > scenario that triggers the problem for me. I did not try with a local server, just with https://vaadin14-embedded-jetty.herokuapp.com/
OK this issue cooled off a bit, sorry for that. In the meantime, I can confirm that the problem only exists with non-trustworthy certificates. When the certificate is valid, the browser correctly notices whether it is online or offline. When the certificate is not trustworthy, it appears as though the browser tries to provide PWA features like offline/online, but fails to do so. In other browsers on other devices, these features are simply disabled with non-trustworthy certificates. In this case, it means that the browser never shows the "You are offline" page, even if we are in fact offline. It simply always tries to access the web page. If it does't work because we are offline, the browser shows a standard error message. If we are online, it works. I think WebKit should behave in the same way, i.e. depending on the certificate, it should either provide PWA features or not. It should not try to provide them but then fail to do so because of the certificate.
To add more context: the reason I am working with selfsigned certificates is that we serve our application on-premise within local networks and want to be able to use HTTPS. Setting up a real certificate in a local network is a hassle, and using plain HTTP is not good either.
I am able to reproduce - naviagator.onLine always returning false - even when device is connected to the internet. steps: 1. open iphone simulator (I used iphone_12_pro) 2. launch safari 3. goto google.com 4. open developer tools for the tab opened in step 3. 5. check navigator.onLine, it will be true. 6. Now connect to another wifi network which is not connected to the Internet 7. check navigator.onLine, it will be false. Till this point everything is working as expected. 9. Then connect back to the wifi network which is connected to the Internet 10. check navigator.onLine, it will still be false (the unexpected response). userAgent : Mozilla/5.0 (iPhone; CPU iPhone OS 15_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.2 Mobile/15E148 Safari/604.1"