Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

useLocation and history.location.pathname are not in sync #117

Open
miestr opened this issue Aug 28, 2023 · 0 comments
Open

useLocation and history.location.pathname are not in sync #117

miestr opened this issue Aug 28, 2023 · 0 comments

Comments

@miestr
Copy link

miestr commented Aug 28, 2023

I have a weird timing issue where useLocation().pathname and history.location.pathname are NOT in sync, which leads to a wrong app re-rendering.

App logic: there are two routes available if the user is logged in: "/dashboard" and "/forbidden". The app initialisation navigates to "/dashboard" and then logs the user in. So I expect the "forbidden" component not to be rendered, when I access the app with this route, but to be redirected to the dashboard. However, in the console, the second app rendering after the login still delivers useLocation().pathname = "/forbidden", whereas history is correct. Which triggers the rendering of the "forbidden" component instead of the "dashboard".

I attached a sandbox where the issue is reproducable: https://codesandbox.io/s/laughing-stitch-y3cwvd?file=/src/App.js
If you type the URL "/forbidden", you will see three console outputs. Why the pathnames are different in the second rendering?

I use following versions:
"react": "18.2.0"
"react-dom": "18.2.0"
"react-router": "6.10.0"
"react-router-dom": "6.10.0"
"react-router-redux": "4.0.8"
"redux-first-history": "5.1.1"
"history": "5.3.0"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant