React-native-navigation: Blank screen after waking phone with app in foreground

Created on 28 Apr 2017  ·  17Comments  ·  Source: wix/react-native-navigation

Hello,

there is a strange phenomena happening to my app since switching to react-native-navigation. Every time I put my phone to sleep while the app is running in the foreground and then waking it up again after some time (does not happen if I wake it immediately), the screen of my app is either blank or I only see the header and tabnavigation. In case I see the tabnavigation I can navigate through the tabs, but the mainarea still stays blank.

It could be that it's related to the other library I'm using (react-native-firebase). Maybe @Ehesp could help me here, since he's using the same libs together.

I've implemented the startup of my app like so:

// App.js
Launch((user) => {
    // User is logged in
    Store.dispatch(GeneralActions.setUserData(user));
    DataConnector.listen(user.get('uid'));
    Navigation.startTabBasedApp({
        tabs: [{
            ...
        }, {
            ...
        }, {
            ...
        }, {
           ...
        }, {
            ...
        }],
        animationType: 'none'
    });
}, () => {
    // User is logged out
    DataConnector.unlisten();
    Navigation.startSingleScreenApp({
        screen: {
           ...
        },
        animationType: 'none'
    });
});


// Launch.js
export default function (onLoggedIn, onLoggedOut) {
    let lastState = false;
    IconImageLoader.loadIconImages().then(() => {
        firebase.auth().onAuthStateChanged((user) => {
            Storage.init().then(() => {
                if (user && !lastState) {
                    firebase.messaging().subscribeToTopic(user.uid);
                    firebase.analytics().setUserId(user.uid);
                    onLoggedIn(Map(user))
                } else if(lastState) {
                    lastState = false;
                    onLoggedOut();
                }
            })
        })
    }).catch(onLoggedOut)
}

🏚 stale

Most helpful comment

I'm also having the same issue with both Android and iOS even with production.

We did run several tests run on by keeping the app idle during time ranges from 1/2hrs to 2hrs to reproduce the issue.

Issue was not consistent all the time but when it occurs had to kill the process of the app and restart it.

RNN Version: 1.1.446
RN Version: 0.51.0

Any updates on this?

All 17 comments

Hey,

Not seen this myself. Have you tried using debug mode and seeing if you get the same results with the blank screen? It maybe related to my comment here: https://github.com/wix/react-native-navigation/issues/963#issuecomment-294781853

@guyca do you think this could be due to the context issue you mentioned?

Hello,

it's kind of hard to debug, since I do have the same problem mentioned in those other issues (when debugging, screen stays blank all the time, without possibility to reload)

But thanks nevertheless. I can focus on other things for the time being and wait for the debugging fix. Maybe I'll figure something out on my own as to why this is happening.

I think the issue with the debugging one is that it requires a breaking change (basically having some sort of onReady event), which I believe @DanielZlotin isn't keen on.

As for RNFB, I've not seen this issue yet, but we released a new version yesterday (alpha13) with a database refactor, so make sure you're using that one :)

Alright, I will try to figure out some workaround for this issue then.

As for RNFB, not using the new version yet, but I'll update asap, thanks. :)

Which version of react-native-navigation are you using @Ehesp?

Quit keen actually :)
This feature is already implemented in v2,
We will probably cherry pick it into v1 soon, unless we find a better
solution

On Apr 28, 2017 11:16 AM, "David Künnen" notifications@github.com wrote:

Which version of react-native-navigation are you using @Ehesp
https://github.com/Ehesp?


You are receiving this because you were assigned.
Reply to this email directly, view it on GitHub
https://github.com/wix/react-native-navigation/issues/1160#issuecomment-297937363,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AGWgj7biaNHAA_fKIeFBK_cI3E1YaZ43ks5r0aBJgaJpZM4NLHsD
.

I'm talking about
https://github.com/wix/react-native-navigation/blob/v2/playground/src/app.js#L8

On Apr 28, 2017 11:23 AM, "Daniel Zlotin" zlotindaniel@gmail.com wrote:

Quit keen actually :)
This feature is already implemented in v2,
We will probably cherry pick it into v1 soon, unless we find a better
solution

On Apr 28, 2017 11:16 AM, "David Künnen" notifications@github.com wrote:

Which version of react-native-navigation are you using @Ehesp
https://github.com/Ehesp?


You are receiving this because you were assigned.
Reply to this email directly, view it on GitHub
https://github.com/wix/react-native-navigation/issues/1160#issuecomment-297937363,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AGWgj7biaNHAA_fKIeFBK_cI3E1YaZ43ks5r0aBJgaJpZM4NLHsD
.

Maybe I'll update to v2. I'm not afraid of beta/alpha versions. :)

@guyca @DanielZlotin I'm also keen :D Who would be able to do this on an iOS side?

Any news on this? 😃

Apparently this was caused by some other problem I had, so my main problem has been resolved with this (https://github.com/invertase/react-native-firebase/issues/107).

This did reveal another problem tho. It seems like, if the app changes from singleScreen to tabBased, tabBased to singleScree, or maybe even singleScreen to singleScreen, tabBased to tabBased while in background, the content section isn't working anymore after resume. The header/tabbar however still works.

Maybe this could be reproduced by simple setting a timeout that triggers the mentioned change while in background.

Maybe related to #1047

I'm also having the same issue with both Android and iOS even with production.

We did run several tests run on by keeping the app idle during time ranges from 1/2hrs to 2hrs to reproduce the issue.

Issue was not consistent all the time but when it occurs had to kill the process of the app and restart it.

RNN Version: 1.1.446
RN Version: 0.51.0

Any updates on this?

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.
If you believe the issue is still relevant, please test on the latest version and report back. Thank you for your contributions.

The issue has been closed for inactivity.

Hello, Guys any updates? I am using startTabBasedApp application. When app is in background and opening other app on top of it and then going back to my app after some time, it is causing this issue.
below are the versions of RN and RNN
"react-native-navigation": "^1.1.457",
"react-native": "0.53.3",

@Kaniz92 : Looks like I am getting similar problem like you. Have you find any solution?

Was this page helpful?
0 / 5 - 0 ratings