When using base tag, react-router and redux-devtools, Uncaught SecurityError: Failed to execute 'pushState' on 'History' occurs

[narr]

When base tag is used like "http://localhost:3000/", in addBasename function from useBasename.js
location.basename is set to '/' and location.pathname is also set to '/' if the location.pathname is '/'.
The problem is that when it reverts to the path '/' by redux-devtools with react-router, it uses locationBeforeTransitions object which is the location object from history and the path becomes '//' in finishTransition function from createBrowserHistory.js and it cause an error like below at window.history.pushState(historyState, null, path) in finishTransition function.

Uncaught SecurityError: Failed to execute 'pushState' on 'History': A history state object with URL 'http:' cannot be created in a document with origin 'http://localhost:3000'.

I guess location.pathname should be set '/' only when location.basename is not '/' so that the path in finishTransition function will be '/'.

[taion]

The correct fix here is probably to use addBasename in transitionTo on useBasename.

That said, we're not going to accept a PR here without tests.

[GabiAxel]

This also happened to me when trying to replace('/') from React Router onEnter and base="/".

[mjackson]

Looks like conversation has stalled here.

[mwq27]

I'm having this same problem. Was there a solution?

[jonaskello]

Having the same issue. Any solution yet? Have read several other issues that states what the problem is, for example here and here.

[JMStudiosJoe]

My solution was taking path from one state
var helloState = {
name: 'hello',
url: '/login',
component: LoginComponent
}
and changing it to
var helloState = {
name: 'hello',
url: '#/login',
component: LoginComponent
}