bruz / react-native-redux-groceries

A simple grocery list app with offline support, built with React Native, Redux, Firebase
MIT License
420 stars 80 forks source link

Doesn't work offline #2

Closed chetstone closed 9 years ago

chetstone commented 9 years ago

When I build and install this app on my iPhone, it works fine when online, but when I go into airplane mode, the app displays an "Offline" message at the top but otherwise freezes up. Browsing the code quickly, it seems like it should do something while offline, but I'm not sure what...

bruz commented 9 years ago

Sorry about the delay in getting back to you - for some reason I didn't get a notification email from github.

Offline mode is actually completely read-only, so it sounds like the app is behaving as expected. I was hoping to allow changes in offline mode, but the Firebase javascript API didn't appear to allow persisting data and initiating the library after the app has been closed and then re-opened offline. So the only benefit of offline mode in the app at the moment is that you can see your list even after the app is closed (including force closing) and re-opened.

chetstone commented 9 years ago

On Fri, Nov 20, 2015 at 9:57 AM, Bruz Marzolf notifications@github.com wrote:

Sorry about the delay in getting back to you - for some reason I didn't get a notification email from github.

No problem. Actually your timing is perfect because I'm just trying to figure out a related issue in my app.

Offline mode is actually completely read-only, so it sounds like the app is behaving as expected.

Ah right, of course. In the app I'm building, the main data is an accumulator, so I use a firebase transaction, and the firebase client stores the transactions while offline and runs them when the app comes back online. Except if the app is killed, in which case they're lost. So I store a sum in async storage and issue an adjusting transaction when the app starts up. Works fine, but has been a bit complicated to implement.

Now I'm trying to deal with some data that is not so important to sync and would be much more complicated to do correctly, so I want to do what you're doing in your app: disable changes while the app is offline. But I'm having a lot of trouble getting a reliable offline/online reading from ".info/connected."

For example, in your app it appears that once you take the phone offline, the app will never come back online until it is killed and restarted. And in my app, the opposite appears to be true (although I could have a bug in my code --- it can happen :) --- .info/connected claims I'm always online unless I'm logged out.

In your app you're using both ".info/connected" and Netinfo. What are you using Netinfo for? It looks like it only fires once when the app starts up and just sets a 5 second timer.

Thanks for the reply!

chetstone commented 9 years ago

Update: I found the typo in my code that caused me to believe firebase was always connected. Now I see my app is behaving just like yours. If the app starts up online firebase will connect. Then in airplane mode, when wifi is switched off, it will disconnect. When wifi is reconnected, Firebase will often not reconnect. Occasionally it will, anywhere from a few seconds to 5 minutes after NetInfo says it's connected. But most often it will never reconnect (I have decided 20 minutes is approximately equal to forever). Occasionally doing something in the app which attempts to push something to Firebase will seem to cause it to reconnect, or perhaps switching wifi off and on again may trigger it, but usually the only way to get it to reconnect is to kill the app and restart.

(Note: another thing that caused me some confusion is the fact that NetInfo.isConnected.fetch() always returns true. This was fixed in 0.15rc)

One more thing. It's not just the ".info/connected" listener that shows offline, the entire firebase client is offline. Changes in the app do not get pushed to the server and vice-versa.

bruz commented 9 years ago

I can confirm what you're seeing:

To answer your question:

In your app you're using both ".info/connected" and Netinfo. What are you using Netinfo for? It looks like it only fires once when the app starts up and just sets a 5 second timer.

I was using NetInfo as a quick check for lack of connection on startup so I didn't have to wait for the Firebase callback that's slow when not connected, so it goes into offline mode quickly and doesn't have to show a loading state until that's done. If NetInfo comes back as connected, then it waits 5 seconds for the Firebase callback to come back as connected (which seems to happen fairly fast in this case), and otherwise goes into offline mode.

bruz commented 9 years ago

I've updated the app to React Native 0.15.0 now that it's out, and the connectivity check on initial load using NetInfo.isConnected.fetch() seems to be returning false correctly now.

Closing this, as I'm not sure there's much else to be done about the other Firebase issues at the moment.