acdlite / acdlite/redux-router
Infinite recursion when dispatching action in onEnter hook.
- Dominant language
- JavaScript
- Stars
- 2.3k
- Forks
- 194
- PR merge metrics
- No merged PRs in 30d
Description
To initially fill the state of my app on the server, components subscribe to the onEnter hook of their routes. In this static initialisation functions I dispatch some actions.
Now this code in redux-router kicks in:
https://github.com/rackt/redux-router/blob/master/src/client.js#L29
... and replaces the history again (calling onEnter again) ...
https://github.com/rackt/redux-router/blob/master/src/client.js#L37
... because it didn't had the chance to set `routerState` which initially is set to `undefined` ...
https://github.com/rackt/redux-router/blob/master/src/client.js#L14
... resulting in an infinite loop.
Just setting `routerState` before the `replaceHistory` call fixes the loop - but everything still gets called twice.
``` js
store.subscribe(() => {
const nextRouterState = routerStateSelector(store.getState());
if (
nextRouterState &&
!routerStateEquals(routerState, nextRouterState)
) {
const { state, pathname, query } = nextRouterState.location;
routerState = nextRouterState;
history.replaceState(state, pathname, query);
} else {
routerState = nextRouterState;
}
});
```
There has to be a way to initialise `routerState` with the correct state instead of `undefined` on the first call.
Contributor guide
No contributing guide indexed for this repository
Research direction
The issue is in src/client.js lines 14, 29, and 37. Start by understanding the subscribe callback and how routerState is initialized. The fix involves setting routerState before replaceHistory to prevent the loop. Check the routerStateSelector and routerStateEquals functions. Test by simulating server-side rendering with onEnter hooks that dispatch actions.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 30/100