wix / react-native-navigation

A complete native navigation solution for React Native
https://wix.github.io/react-native-navigation/
MIT License
13.01k stars 2.68k forks source link

[RN71-IOS] - Got a blank screen after setRoot() #7839

Open blood-romantic opened 5 months ago

blood-romantic commented 5 months ago

What happened?

I got a blank screen after SplashScreen.hide(), even if the SignInScreen's render() has been called

What was the expected behaviour?

the react component SignInScreen should be shown without a blank

Was it tested on latest react-native-navigation?

Help us reproduce this issue!

Navigation.registerComponent(appName, () => (props) => <StoreProvider store={store}>
  <App {...props}/>
</StoreProvider>, () => App);

Navigation.registerComponent('app.SignInScreen', () => (props) => <Provider store={store}>
  <SignInScreen {...props}/>
</Provider>, () => SignInScreen);

Navigation.registerComponent('app.ScanningScreen', () => (props) => <Provider store={store}>
  <ScanningScreen {...props}/>
</Provider>, () => ScanningScreen);

Navigation.events().registerAppLaunchedListener(async () => {
  let session = await checkForPreviousSession() || {};  <--  invoke `SplashScreen.hide()` in this function
  Navigation.setRoot({
    root: {
      stack: {
        children: [
          {
            component: {
              name: Object.keys(session).length ? 'app.ScanningScreen' : 'app.SignInScreen' // unique ID registered with Navigation.registerScreen
            },
          },
        ],
        options: {
          statusBar: {
            backgroundColor: COLORS.BLUE,
            style: session ? 'light' : 'dark'
          },
          topBar: { visible: false, height: 0 },
          layout: {
            orientation: ['portrait'], // must be defined in root and within subsequent screens
          },
        },
      },
    },
  });
});

Podfile:

  use_react_native!(
    :path => config[:reactNativePath],
    # to enable hermes on iOS, change `false` to `true` and then install pods
    :hermes_enabled => true, #flags[:hermes_enabled],
    :fabric_enabled => false, #flags[:fabric_enabled],
    # An absolute path to your application root.
    :flipper_configuration => flipper_config,
    :app_path => "#{Pod::Config.instance.installation_root}/.."
  )

In what environment did this happen?

React Native Navigation version: 7.37.2 React Native version: 0.71.15 Has Fabric (React Native's new rendering system) enabled: no Node version: 21.5.0 Device model: iphone13 iOS version: 16.2