bug: Fallback route breaks routing in ionic react

[justinpathrose]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

v8.x

Current Behavior

In ionic project with Tabs, I have added a fallback route using the recomended way of doing it.

<Route component={NotFoundPage} />

In normal use, the routing works fine, but if I go to the invalid route directly, the navigation is broken.

Expected Behavior

The navigation works without any issues/jank.

Steps to Reproduce

1. Dowload code from github - https://github.com/justinpathrose/ionic-fallback and run.
2. Click on Tab 1 button in /login route.
3. Click on Go to Invalid Route button in /tabs/tab1 route.
4. Reload the page.
5. Click on Tab 1 Button.

Code Reproduction URL

https://github.com/justinpathrose/ionic-fallback

Ionic Info

Ionic:

Ionic CLI : 7.2.1 (/Users/justin/.nvm/versions/node/v20.19.1/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/react 8.5.8

Utility:

cordova-res : not installed globally
native-run : 2.0.1

System:

NodeJS : v20.19.1 (/Users/justin/.nvm/versions/node/v20.19.1/bin/node)
npm : 10.8.2
OS : macOS Unknown

Screen.Recording.2025-06-02.at.13.35.21.mov

Additional Information

No response