navigation.goBack crashes the app on Android

[Miraj98]

Description

When calling navigation.goBack on Android, the app crashes. Works perfectly fine on iOS. The issue does not occur for all screens but specifically when navigating back to the Tab.Navigator. My navigation is setup as follows

<Stack.Navigator>
  <Stack.Screen name="MainTabs" component={MainTabs} /> // <- This is a bottom tab navigator
  <Stack.Screen name="Screen1" component={Screen1} /> 
  <Stack.Screen name="Screen2" component={Screen2} /> 
  {/*
   * Other screens...
   * /}
</Stack.Navigator>

Some where I saw that I should try detachInactiveScreens={false}. I tried this and it still does not work. Here is an error log as well -

java.lang.IllegalStateException: com.facebook.react.uimanager.IllegalViewOperationException: StackOverflowException
	at com.facebook.react.bridge.ReactContext.handleException(ReactContext.java:387)
	at com.facebook.react.views.view.ReactViewGroup.dispatchDraw(ReactViewGroup.java:755)
	at android.view.View.updateDisplayListIfDirty(View.java:19100)
	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4321)
	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4313)
	at android.view.View.updateDisplayListIfDirty(View.java:19069)
	at android.view.View.draw(View.java:19962)
	at android.view.ViewGroup.drawChild(ViewGroup.java:4337)
	at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4138)
	at android.view.View.draw(View.java:20237)
	at android.widget.ScrollView.draw(ScrollView.java:1739)
	at com.facebook.react.views.scroll.ReactScrollView.draw(ReactScrollView.java:488)
	at android.view.View.updateDisplayListIfDirty(View.java:19109)
	at android.view.View.draw(View.java:19962)
	at android.view.ViewGroup.drawChild(ViewGroup.java:4337)
	at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4138)
	at com.facebook.react.views.view.ReactViewGroup.dispatchDraw(ReactViewGroup.java:710)
	at android.view.View.draw(View.java:20237)
	at android.view.View.updateDisplayListIfDirty(View.java:19109)
	at android.view.View.draw(View.java:19962)
	at android.view.ViewGroup.drawChild(ViewGroup.java:4337)
	at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4138)
	at com.facebook.react.views.view.ReactViewGroup.dispatchDraw(ReactViewGroup.java:710)
	at android.view.View.draw(View.java:20237)
	at android.view.View.updateDisplayListIfDirty(View.java:19109)
	at android.view.View.draw(View.java:19962)
	at android.view.ViewGroup.drawChild(ViewGroup.java:4337)
	at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4138)
	at android.view.View.updateDisplayListIfDirty(View.java:19100)
	at android.view.View.draw(View.java:19962)
	at android.view.ViewGroup.drawChild(ViewGroup.java:4337)
	at androidx.coordinatorlayout.widget.CoordinatorLayout.drawChild(CoordinatorLayout.java:1277)
	at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4114)
	at android.view.View.updateDisplayListIfDirty(View.java:19100)
	at android.view.View.draw(View.java:19962)
	at android.view.ViewGroup.drawChild(ViewGroup.java:4337)
	at com.swmansion.rnscreens.ScreenStack.performDraw(ScreenStack.kt:295)
	at com.swmansion.rnscreens.ScreenStack.access$performDraw(ScreenStack.kt:15)
	at com.swmansion.rnscreens.ScreenStack$DrawingOp.draw(ScreenStack.kt:316)
	at com.swmansion.rnscreens.ScreenStack.drawAndRelease(ScreenStack.kt:269)
	at com.swmansion.rnscreens.ScreenStack.dispatchDraw(ScreenStack.kt:286)
	at android.view.View.updateDisplayListIfDirty(View.java:19100)
	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4321)
	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4294)
	at android.view.View.updateDisplayListIfDirty(View.java:19069)
	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4321)
	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4294)
	at android.view.View.updateDisplayListIfDirty(View.java:19069)
	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4321)
	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4294)
	at android.view.View.updateDisplayListIfDirty(View.java:19069)
	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4321)
	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4294)
	at android.view.View.updateDisplayListIfDirty(View.java:19069)
	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4321)
	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4294)
	at android.view.View.updateDisplayListIfDirty(View.java:19069)
	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4321)
	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4294)
	at android.view.View.updateDisplayListIfDirty(View.java:19069)
	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4321)
	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4294)
	at android.view.View.updateDisplayListIfDirty(View.java:19069)
	at android.view.ViewGroup.recreateChildDisplayList(ViewGroup.java:4321)
	at android.view.ViewGroup.dispatchGetDisplayList(ViewGroup.java:4294)
	at android.view.View.updateDisplayListIfDirty(View.java:19069)
	at android.view.ThreadedRenderer.updateViewTreeDisplayList(ThreadedRenderer.java:686)
	at android.view.ThreadedRenderer.updateRootDisplayList(ThreadedRenderer.java:692)
	at android.view.ThreadedRenderer.draw(ThreadedRenderer.java:801)
	at android.view.ViewRootImpl.draw(ViewRootImpl.java:3406)
	at android.view.ViewRootImpl.performDraw(ViewRootImpl.java:3190)
	at android.view.ViewRootImpl.performTraversals(ViewRootImpl.java:2559)
	at android.view.ViewRootImpl.doTraversal(ViewRootImpl.java:1529)
	at android.view.ViewRootImpl$TraversalRunnable.run(ViewRootImpl.java:7409)
	at android.view.Choreographer$CallbackRecord.run(Choreographer.java:1036)
	at android.view.Choreographer.doCallbacks(Choreographer.java:832)
	at android.view.Choreographer.doFrame(Choreographer.java:767)
	at android.view.Choreographer$FrameDisplayEventReceiver.run(Choreographer.java:1022)
	at android.os.Handler.handleCallback(Handler.java:873)
	at android.os.Handler.dispatchMessage(Handler.java:99)
	at android.os.Looper.loop(Looper.java:201)
	at android.app.ActivityThread.main(ActivityThread.java:6810)
	at java.lang.reflect.Method.invoke(Native Method)
	at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:547)
	at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:873)
Caused by: com.facebook.react.uimanager.IllegalViewOperationException: StackOverflowException
	... 84 more
Caused by: java.lang.NullPointerException: Attempt to invoke virtual method 'void android.view.View.setVisibility(int)' on a null object reference
	at org.reactnative.maskedview.RNCMaskedView.updateBitmapMask(RNCMaskedView.java:58)
	at org.reactnative.maskedview.RNCMaskedView.dispatchDraw(RNCMaskedView.java:33)
	at android.view.View.buildDrawingCacheImpl(View.java:19499)
	at android.view.View.buildDrawingCache(View.java:19365)
	at android.view.View.draw(View.java:19954)
	at android.view.ViewGroup.drawChild(ViewGroup.java:4337)
	at android.view.ViewGroup.dispatchDraw(ViewGroup.java:4138)
	at com.facebook.react.views.view.ReactViewGroup.dispatchDraw(ReactViewGroup.java:710)
	... 83 more

Screenshots

Steps To Reproduce

1. Create a stack navigator
2. Embed a tab navigator is its initial screen
3. Add other screens to the stack navigator
4. Navigate to one of these screens from any of the tab navigator tabs
5. call navigation.goBack and the app crashes on android

Expected behavior

App should not crash

Actual behavior

App crashes

Reproduction

Platform

• iOS
• Android
• Web
• Windows
• tvOS

Workflow

• Bare workflow

Package versions

package	version
react-native	0.64.0
@react-navigation/native	6.0.6
@react-navigation/native-stack	6.2.5
react-native-screens	3.9.0
react-native-safe-area-context	3.3.2
react-native-gesture-handler	2.1.0
react-native-reanimated	2.2.4

[github-actions]

Hey! 👋

The issue doesn't seem to contain a minimal reproduction.

Could you provide a snippet of code, a snack or a link to a GitHub repository that reproduces the problem?

[github-actions]

Hey! 👋

It looks like you've omitted a few important sections from the issue template.

Please complete Reproduction section.

[maticzav]

Did you have any luck resolving this issue or at least finding the source of error?

[kacperkapusciak]

Hi @Miraj98,
Thank you for submitting an issue!

From the provided steps I was unable to reproduce the crash. Could you provide a minimal reproduction eg. a snack, snippet of code, or GitHub repo that reproduces the problem?

Cheers

[Chandranshu5]

Hey @Miraj98! were you able to resolve the issue, I am facing the same issue and unable to get the solution. Kindly help me.

[Miraj98]

@Chandranshu5 The issue was actually with a masking library that I was using at the time. The masking library worked on iOS but not on Android.

[bhc777]

@Miraj98
me too ,use Material Top Tabs Navigator page , goback crashes the app on Android .
remove Tab goback is OK!

IMG_0687.mp4

Have you found a solution? Please reply to me with help thanks .
lemonwater@mi.com.tw

{
  "name": "MyApp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "lint": "eslint .",
    "start": "react-native start",
    "test": "jest"
  },
  "dependencies": {
    "@react-native-masked-view/masked-view": "^0.3.2",
    "@react-navigation/material-top-tabs": "^7.0.0",
    "@react-navigation/native": "^7.0.0",
    "@react-navigation/native-stack": "^7.0.0",
    "react": "18.3.1",
    "react-native": "0.76.1",
    "react-native-gesture-handler": "^2.20.2",
    "react-native-pager-view": "^6.5.0",
    "react-native-safe-area-context": "^4.14.0",
    "react-native-screens": "^4.0.0",
    "react-native-tab-view": "^4.0.0"
  },
  "devDependencies": {
    "@babel/core": "^7.25.2",
    "@babel/preset-env": "^7.25.3",
    "@babel/runtime": "^7.25.0",
    "@react-native-community/cli": "15.0.0",
    "@react-native-community/cli-platform-android": "15.0.0",
    "@react-native-community/cli-platform-ios": "15.0.0",
    "@react-native/babel-preset": "0.76.1",
    "@react-native/eslint-config": "0.76.1",
    "@react-native/metro-config": "0.76.1",
    "@react-native/typescript-config": "0.76.1",
    "@types/react": "^18.2.6",
    "@types/react-test-renderer": "^18.0.0",
    "babel-jest": "^29.6.3",
    "eslint": "^8.19.0",
    "jest": "^29.6.3",
    "prettier": "2.8.8",
    "react-test-renderer": "18.3.1",
    "typescript": "5.0.4"
  },
  "engines": {
    "node": ">=18"
  }
}

// In App.js in a new project

import * as React from 'react';
import { View, Text } from 'react-native';
import {
  createStaticNavigation,
  useNavigation,
} from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import { Button } from '@react-navigation/elements';

import { createMaterialTopTabNavigator } from '@react-navigation/material-top-tabs';

const Tab = createMaterialTopTabNavigator()

function HomeScreen() {
  const navigation = useNavigation();

  return (
    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
      <Text>Home Screen</Text>
      <Button onPress={() => navigation.navigate('Details')}>
        Go to Details
      </Button>
    </View>
  );
}

function SettingsScreen() {
  const navigation = useNavigation();

  return (
    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
      <Text>SettingsScreen Screen</Text>
      <Button onPress={() => navigation.navigate('Details')}>
        Go to Details
      </Button>
    </View>
  );
}


function DetailsScreen() {
  const navigation = useNavigation();

  return (
    <Tab.Navigator>
    <Tab.Screen name="Home" component={HomeScreen} />
    <Tab.Screen name="Settings" component={SettingsScreen} />
  </Tab.Navigator>
  );
}

function DetailsScreen2() {
  const navigation = useNavigation();

  return (
    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>

      
      <Text>Details Screen</Text>
      <Button onPress={() => navigation.navigate('Details')}>
        Go to Details... again
      </Button>
    </View>
  );
}

const RootStack = createNativeStackNavigator({
  initialRouteName: 'Home',
  screens: {
    Home: HomeScreen,
    Details: DetailsScreen,
  },
});

const Navigation = createStaticNavigation(RootStack);

export default function App() {
  return <Navigation />;
}