react-navigation Error thrown for unknown reason (The screen dismissedRouteName was removed natively but didn't get removed from JS state.)

Error thrown for unknown reason (The screen dismissedRouteName was removed natively but didn't get removed from JS state.)

Open hermanbanken opened this issue 2 years ago • 23 comments

Current behavior

When we use stack navigators, together with navigation actions using nav.navigate() we are seeing error such as the following error in LogBox:

The screen '${dismissedRouteName}' was removed natively but didn't get removed from JS state.
This can happen if the action was prevented in a 'beforeRemove' listener, which is not fully supported in native-stack.
Consider using 'gestureEnabled: false' to prevent back gesture and use a custom back button with 'headerLeft' option to override the native behavior.

The corresponding code that logs this is: https://github.com/react-navigation/react-navigation/commit/6d518a46b89496f4a3bfd2da24245fe344f97290#diff-1d8f4947ac2b908a880d4f9353b91b3615b51fa4963b1148ad802fceae040472R96-R113

We see NO reason why this code exists, because when we remove this console.error via patch-package everything works as expected. The code captures the nextDismissedKey in the onDismissed callback, so. it always fires for any native back-button. When inspecting the navigation state, there is no trace of the previous routes in JS state.

I'm still trying to get the Snack to reproduce the issue. So far it is working in the Snack, but it fails in my project very reliably. I'll work on the reproduction tomorrow. In the mean while I'm very interested into why this error even exists if it seems to be non-problematic. Is it left-over from something else?

Expected behavior

Regular navigation using nav.navigate just works & does not error to LogBox.

Reproduction

~Still working on making the error reproduce, but this already approximately explains what we're doing: https://snack.expo.dev/CgavlJWkN~ Update: we reproduced it, but the LogBox is not working, so instead we now capture console.error in the views: https://snack.expo.dev/jGvqnviA-_

Screenshot 2022-04-12 at 09 16 39

When you go Back (triggering native onDismissed) and then do another navigation, the dismissedRouteName is somehow still set.

Maybe the nextDismissedKey is simply never cleared?

Platform

[x] Android
[X] iOS
[ ] Web
[ ] Windows
[ ] MacOS

Packages

[ ] @react-navigation/bottom-tabs
[ ] @react-navigation/drawer
[ ] @react-navigation/material-bottom-tabs
[ ] @react-navigation/material-top-tabs
[ ] @react-navigation/stack
[X] @react-navigation/native-stack

Environment

[x] I've removed the packages that I don't use

package	version
@react-navigation/native	^6.0.6
@react-navigation/native-stack	^6.2.5
react-native-safe-area-context	^3.3.2
react-native-screens	^3.10.1
react-native	0.66.4
node	v16.13.0
npm	8.1.0

Apr 11 '22 20:04 hermanbanken

Couldn't find version numbers for the following packages in the issue:

@react-navigation/drawer
@react-navigation/material-bottom-tabs
@react-navigation/material-top-tabs
@react-navigation/stack

Can you update the issue to include version numbers for those packages? The version numbers must match the format 1.2.3.

The versions mentioned in the issue for the following packages differ from the latest versions on npm:

@react-navigation/native (found: 6.0.6, latest: 6.0.10)
@react-navigation/bottom-tabs (found: 6.0.9, latest: 6.3.1)

Can you verify that the issue still exists after upgrading to the latest versions of these packages?

Apr 11 '22 20:04 github-actions[bot]

Reproduction now works! See the errors (in the view) after going back and forth a few times: https://snack.expo.dev/jGvqnviA-_

Apr 12 '22 06:04 hermanbanken

Couldn't find version numbers for the following packages in the issue:

@react-navigation/bottom-tabs
@react-navigation/drawer
@react-navigation/material-bottom-tabs
@react-navigation/material-top-tabs
@react-navigation/stack

Can you update the issue to include version numbers for those packages? The version numbers must match the format 1.2.3.

The versions mentioned in the issue for the following packages differ from the latest versions on npm:

@react-navigation/native (found: 6.0.6, latest: 6.0.10)

Can you verify that the issue still exists after upgrading to the latest versions of these packages?

Apr 12 '22 07:04 github-actions[bot]

Remove label package:bottom-tabs pls!

Apr 12 '22 07:04 hermanbanken

Seeing this too. @hermanbanken did you figure out the cause?

May 06 '22 15:05 lvwrence

We patched the lib ignoring the issue temporarily.

May 06 '22 16:05 hermanbanken

We see this too, this happen when you navigate to route, go back and navigate to the same route again. If you navigate to different route after go back it does not seem to happen