V6.7.0 breaks the location state flow

[alamchrstn]

Hi, I tried to update to v6.7.0 and I found out that it breaks the flow of the app (maybe most of the apps that use this will get this issue also). It's caused by the inclusion of location's state into the payload of the redux action, thus it's causing the app to be re-rendered multiple times and also resulting in pushing too many stacks into the browser history.

history.push({
pathname: '/other-page',
state: responseData,
});

if state is not passed, then it works as normal. Maybe someone could come up with a solution for this? In the meantime, I revert back to version prior to v6.7.0

Thanks!

[richardchen85]

I have the same problem. After i looked into the source code, I found that the state object stored in store is different from the one stored in history.

So, if you want to continue to use v6.7.0, you can use JSON.stringify(state) to serialize the state into string:

history.push({
  pathname: '/other-page',
  state: JSON.stringify(responseData),
});

[BlazPocrnja]

Hello everyone first time contributor long time programmer.

connected-react-router/src/ConnectedRouter.js

Lines 43 to 59 in 9b3ef9b

	if (
	props.history.action === 'PUSH' &&
	(pathnameInHistory !== pathnameInStore ||
	searchInHistory !== searchInStore ||
	hashInHistory !== hashInStore ||
	stateInStore !== stateInHistory)
	) {
	this.inTimeTravelling = true
	// Update history's location to match store's location
	history.push({
	pathname: pathnameInStore,
	search: searchInStore,
	hash: hashInStore,
	state: stateInStore,
	})
	}
	})

On line 48, this comparison doesn't work if the location's state is an object, meaning it returns true every-time and results in multiple locations being pushed to history.

I don't think serializing the state into a string is the best long term solution. I would prefer to use my state as an object as it has been in previous releases. If there's a reason not to please let me know!

Anyways just doing a comparison between objects here seems to fix the problem for me 100%, so I'd like to maybe make that change to this repo?

[alamchrstn]

I would definitely agree with @BlazPocrnja , comparing the location's state would need to consider object comparison.

[EDcjukna]

I agree with @BlazPocrnja but I think it might also be valuable to be able to supply your own function to determine the equality of objects.

This could be done with lodash isEqualWith, this could be an optional function prop passed to the ConnectedRouter.

[BlazPocrnja]

@EDcjukna I like that idea actually! I'll put something together in my pull request. #399