insin / react-hn

React-powered Hacker News client

Home Page:https://insin.github.io/react-hn

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Offline support in Firefox

sejoker opened this issue · comments

I was impressed with the demo @addyosmani did at IO 2016. Offline support works perfectly in Chrome. I cannot get it working in latest FF 46, although according to Jake Archibald's status page the service workers support in FF as good as in Chrome. Maybe the libraries that were used (sw-toolkit and sw-precache) have some issues or it is the lack of testing in FF?

I noticed that both offline features don't work:

  • refreshing the home page in offline mode
  • opening the cached comments page.

Just to check: for offline cached comments did you turn on 'Offline Mode' in Settings before testing? Also, were you testing on Firefox for Android or Firefox desktop?

@addyosmani you are right, I forgot to check 'Offline mode' in Settings when tested in the desktop version of FF, it works perfectly fine in Firefox desktop.

On a side note, I've tested the app on the mobile (Nexus 6, Android 6.0.1) and cannot make it work in offline mode using FF and Chrome ('Offline mode' checked in Settings).

I assume this issue could be closed, but I would be appreciated to know how to make it work on mobile as well.

@sejoker I need to come up with a slightly better UX for it, but something that you might find fixes issues you're running into on Android is pulling-to-refresh once you've switched to Offline Mode or relaunching the app from your homescreen after going into Offline Mode. That should trigger it. I probably could add a 'force refresh on setting the option' routine in there to avoid this. Will consider it :)

Closing this issue, but if you run into any trouble feel free to keep pining this thread and I'll file bugs if there's anything unknown you run across.

At least comments cache in 'Offline mode' doesn't work on Android mobile (on both Chrome and FF). Tried to run from homescreen and in the browsers. Also, the issue reproduced on Android 5 (tried on the different device to be 100% sure).

@sejoker I'll try to reproduce this on a few different devices and get back to you. My current testing steps are as follows:

  • Add the normal app to the homescreen
  • Launch app from homescreen
  • Turn on 'Offline mode' from Settings
  • Refresh the page or pull down to refresh.
  • Navigate to a page where you want comments to be cached
  • Close the app
  • Turn on Airplane mode
  • Launch the app. Navigate to the page commented were supposed to be cached

If you're following similar steps and running into issues, that's definitely a bug and I'll chase down the cause.

@addyosmani you have precisely described the steps I used to reproduce the issue.

Hmm. Just tested the above on Firefox for Android (Beta) and story and comment caching was working as expected. Perhaps I'm using different versions of these browsers. Could you confirm what versions you're using and I'll give those a spin too? :)

I finally figured out the reason why it didn't work for me. Service workers require https only, the website allows to work with http and doesn't redirect to https by default. Initially, I've added the link to the homescreen when served the page from http. I confirm that caching works on Firefox and Chrome on Android when accessed through https.

@addyosmani thanks a lot for your time.

Looks like this is the necessary app.yaml config to require https and redirect to it from http: https://cloud.google.com/appengine/docs/flexible/nodejs/configuring-your-app-with-app-yaml#security

I'll create a new issue to update the app.yaml. Thanks @insin!