react-router icon indicating copy to clipboard operation
react-router copied to clipboard

[Bug]: Use with single-spa, `useBlocker` may cause unnessesary reload

Open cyrilluce opened this issue 1 year ago • 0 comments

What version of React Router are you using?

6.23.1

Steps to Reproduce

sandbox: https://stackblitz.com/edit/github-yc7ha4?file=index.html

Click go test > proceed

Expected Behavior

Redirect success without reload page

Actual Behavior

Page will reload due to this code: https://github.com/remix-run/react-router/blob/main/packages/router/router.ts#L1004 image

Actually I had trace the reason, single-spa will inject history api, which make history.pushState/replaceState fire extra synthetic popstate event( BY DESIGN, see: https://single-spa.js.org/docs/api/#popstateevent and https://github.com/single-spa/single-spa/issues/528)

If createBrowserRouter after single-spa injected, it will be affected.

At the time, useBlocker's disposer haven't executed, and blocker.state === 'unblock', single-spa's popstate will trigger another history restore, which delta is 0, and try to execute history.go(0), finally cause reload.

Possible fix is ignore delta === 0

cyrilluce avatar Jun 06 '24 12:06 cyrilluce