Skip to content

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

@blood-romantic

Description

@blood-romantic

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?

  • I have tested this issue on the latest react-native-navigation release and it still reproduces.

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

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions