props.navigation.navigate stops working after clicking Firebase Dynamic Link

[thezenvan]

What's going on?

In welcome screen run Firebase Authentication sendSignInLinkToEmail method which sends an email with a link. Go to email and click the link, it opens the app back to the welcome screen but when clicking a button that should navigate to another screen the button is receiving the tap (can see logged message in console) but navigate function doesn't do anything.
When the email link re-opens the app, clicking on the button should navigate to requested screen.

---

Steps to reproduce

Create ignite project using Bowser biolerplate, setup the navigation stack and use this code (or something similar):

export const WelcomeScreen: React.FunctionComponent<{ NavigationScreenProps }> = observer(props => {

  const onLoginPress = () => {
    console.log("login")
    props.navigation.navigate("login")
  }

return (
    <Screen testID="WelcomeScreen" style={CONTAINER} backgroundColor={color.transparent}>
      <View style={[Styles.welcomeSection, Styles.mediumWrapper]}>
        <Button preset="linkInline" text="Log in " onPress={onLoginPress} />
        <Text text="to my Acccount" preset="p1"></Text>
      </View>
    </Screen>
  )
})

---

ignite doctor results:

System
  platform           darwin                                                                                                              
                                                 
  arch               x64                                                                                                                 
  cpu                4 cores        Intel(R) CPU    i5-2400  @ 3.09GHz 
  directory          /Users/omb/Documents/react-native-projects/test-app                                                   

JavaScript
  node               10.16.3      /usr/local/bin/node 
  npm                6.9.0        /usr/local/bin/npm  
  yarn               1.15.2       /usr/local/bin/yarn 

React Native
  react-native-cli   2.0.1      
  app rn version     0.61.2     

Ignite
  ignite-cli         3.2.3        /usr/local/bin/ignite 
  generators         {}                                 

Android
  java               1.8.0_172    /usr/bin/java                
  android home       -            /usr/local/share/android-sdk 

iOS
  xcode              10.1       
  cocoapods          1.8.0        /Users/omb/gems/bin/pod 

[MossP]

Sorry I don't have an answer but I'm experiencing a strange issue also quite similar where the nav stops working after a fast refresh has occurred.

I'm curious if they are the same issue. Are you able to navigate after a couple of fast refresh auto updates?

[thezenvan]

I'm able to navigate after a reload so as a workaround for now I implemented this module https://www.npmjs.com/package/react-native-restart to force a reload

[morgandonze]

Hi @thezenvan have you been able to solve this problem? Let me know if you're still stuck with it 😄

[aneem]

@mlaco I'm also facing similar issue.
As pointed out by @MossP , the nav stops whenever we exit the app moves to background via the backhandler or after a fast refresh.

In my case, everything was working fine while using the default createStackNavigator in the RootNavigator. Once I replaced the createStackNavigator with the createSwitchNavigator as per this guide I faced this issue.

This issue exists only when trying to use the navigation prop injected by the react-navigation. Instead of using navigation.navigateTo, if we use the navigateTo from the NavigationStoreModel, the navigation works just fine.

Possible cause of issue:
When trying to navigate, Navigation/NAVIGATE action gets dispatched but Navigation/COMPLETE_TRANSITION doesn't get dispatched.

[aiingstan]

@aneem, the state seems to be correct while using navigateTo action method. But in my case, the screen is not changed. I added some log in StatefulNavigator component and it isn't rendered again after the navigation state changes, do you have any idea? What confuses me is that it works in dev mode but has issue only in release mode