RNScreensNavigationController is pushing the same view controller instance more than once

Description

We are seeing the following crash quite frequently on iOS since we started to use react-native-screens/createNativeStackNavigator. Any help would be much appreciated.

Exception Type: EXC_CRASH (SIGABRT)
Crashed Thread: 0

Application Specific Information:
<RNScreensNavigationController: 0x1038e6800> is pushing the same view controller instance (<RNSScreen: 0x12f123e20>) more than once which is not supported and is most likely an error in the application

Thread 0 Crashed:
0   CoreFoundation                  0x3259749d8         __exceptionPreprocess
1   libobjc.A.dylib                 0x34e15ab50         objc_exception_throw
2   UIKitCore                       0x3298bc6c0         -[UINavigationController pushViewController:transition:forceImmediate:]
3   UIKitCore                       0x32a4dbfb4         -[_UIAfterCACommitBlock run]
4   UIKitCore                       0x32a041a64         _runAfterCACommitDeferredBlocks
5   UIKitCore                       0x32a030f94         _cleanUpAfterCAFlushAndRunDeferredBlocks
6   UIKitCore                       0x32a062564         _afterCACommitHandler
7   CoreFoundation                  0x3258f3878         __CFRUNLOOP_IS_CALLING_OUT_TO_AN_OBSERVER_CALLBACK_FUNCTION__
8   CoreFoundation                  0x3258edf4c         __CFRunLoopDoObservers
9   CoreFoundation                  0x3258edbf0         CFRunLoopRunSpecific
10  GraphicsServices                0x3533f9594         GSEventRunModal
11  UIKitCore                       0x32a0323d4         -[UIApplication _run]
12  UIKitCore                       0x32a037954         UIApplicationMain
13  ########                        0x200d3d5d4         main (main.m:7)

Steps To Reproduce

We see this crash in our Sentry issues but don’t know how to reproduce it yet.

Package versions

• React: 16.13.1
• React Native: 0.63.3
• React Native Screens: 2.16.1
• React Navigation: 4.4.3

[kacperkapusciak]

I’ve managed to reproduce this issue with the following code

import React, {useEffect} from 'react';
import {StyleSheet, Button, View, Text} from 'react-native';
import {enableScreens} from 'react-native-screens';
import {createNativeStackNavigator} from 'react-native-screens/native-stack';

enableScreens();

const MainScreen = ({navigation}) => {
  useEffect(() => {
    navigation.navigate('Modal')
  }, [])

  return (
    <View style={styles.screen}>
      <Text>Issue 791</Text>
    </View>
  )
}

const PushScreen = ({navigation}) => (
  <View style={styles.screen}>
    <Button onPress={() => navigation.push('Push')} title="Mash this button" />
  </View>
);

const Stack = createNativeStackNavigator();

const App = () => (
  <Stack.Navigator>
    <Stack.Screen
      name="Main"
      component={MainScreen}
    />
    <Stack.Screen
      name="Push"
      component={PushScreen}
    />
    <Stack.Screen
      name="Modal"
      component={PushScreen}
      options={{ stackPresentation: 'modal'}}
    />
  </Stack.Navigator>
);

const styles = StyleSheet.create({
  screen: {
    ...StyleSheet.absoluteFillObject,
    flex: 1,
    paddingTop: 200,
    alignItems: 'center',
  },
});

export default App;

This error occurs when you push a ‘normal’ screen under a modal. Inside modals only pushing modals is supported. Could you check if it’s the case within your app?

[birgernass]

I know my information is very limited at this point. Thanks for sharing your thoughts on this.