remix-run / history

Manage session history with JavaScript
MIT License
8.29k stars 959 forks source link

Query string is returned twice when it has spaces in it #798

Open selbekk opened 4 years ago

selbekk commented 4 years ago

I opened this issue in the React Router repo first, but it looks like the issue might be rooted in this package.

Reproduction https://codesandbox.io/s/lively-bash-4vmb6?file=/src/App.js

Steps to reproduce Replace the search string with something with a space in it. In my example you do that by clicking the button

Expected Behavior I'd expect the search parameter to resolve to the decoded string right away.

Actual Behavior The search parameter first returns the encoded version of the space (so for%20example in my repro), and then immediately changes to for example.

I'm using the search parameter to trigger a useEffect (which in turn calls our API), so this kind of blows 😅

Any idea as to why this is happening?

vivekkhatri commented 4 years ago

Hey @selbekk I'm new to React but I've found something. Kindly let me know how we should communicate.

mjackson commented 4 years ago

Hmm, it looks like the double render could be a hash history bug. The hashchange event sometimes fires multiple times in quick succession, so there is some code in createHashHistory that tries to prevent from firing the listener multiple times. But in this case since the query string is apparently changing I bet it's firing once for each encoding.