State Recovery on Browser Back Button event

[toddpi314]

Any guidance on how to support back behavior with the browser back button?

Since the switch navigator is the only available option on web, the browser back button event will pop a historical URL without the browser application responding as a forward navigation.

[ericvicenti]

Your issue seems quite valid but I can’t think of the exact use case. Can you give me a more complete example, perhaps with some code I can run?

[509dave16]

@ericvicenti @toddpi314 Having the same problem with a navigation structure that roughly looks like this.

Switch Navigator -> Custom Tab Navigator -> Stack Navigator

                                -> Start - Screen
Switch Navigator
                                -> Network - Custom Tab Navigator
                                      -> MyHome - Stack Navigator
                                      -> MySearch - Stack Navigator
                                      -> MyShopping - Stack Navigator
                                      -> MyProfile - Stack Navigator
                                      -> Chat - Stack Navigator
                                      -> MySettings - Stack Navigator

Pressing browser back button always triggers a Navigation/NAVIGATE to the currently active Tab(i.e. Stack Navigator) instead of to the previous Screen on the stack. Like in the following screen shot where I box the Screen in the stack that I should have been taken to:

Let me know if you need more info @ericvicenti . This is roughly what I'm using currently version-wise for native/web(p.s. using react-native-web and createBrowserApp for web):	software	version
react-navigation	^4.0.10
@react-navigation/core	3.6.1
@react-navigation/web	^1.0.0-alpha.9
react-navigation-tabs	^2.7.0
react-navigation-stack	^2.0.15
react-native-reanimated	~1.4.0
react-native-gesture-handler	~1.5.0
react-native-screens	2.0.0-alpha.12
react-native-web	^0.11.7

[509dave16]

@ericvicenti It appears that what is really happening is that entire chain of actions is created to direct the User to the screen in the history just before the current one. To simulate going back. However this only works for my: MyHome - Stack Navigator MySearch - Stack Navigator MyShopping - Stack Navigator

The other two Stack Navigators that are being used fail to complete all of the chained navigation actions. Or some of the actions are invalid: MyProfile - Stack Navigator MySettings - Stack Navigator

Not sure what to exactly provide. Each navigator is created in the exact same way. Haven't been able to find the culprit in those latter two Stack Navigators that would be causing the back navigation to fail. One thing that does stand out is that the NotificationScreenProfile route name in one of the actions is not a route that exists in my app.

[509dave16]

@ericvicenti Figured out the NotificationScreenProfile . We have a separate set of routes where the route names are prefixed with NotificationScreen for in-app/push notification navigation. So there will be a Profile and NotificationScreenProfile named routes that point to the Profile.js screen. Still not sure how it's picking.