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

[Bug]: useBlocker block twice when navigating on a page using setSearchParams

Open tpoisseau opened this issue 1 year ago • 0 comments

What version of React Router are you using?

6.21.1

Steps to Reproduce

  1. a controllable shouldBlock state
  2. a page locking navigation on mount, unlocking it on dismount. It could be a form page, locking if form is dirty, unlocking when form is submit (navigate after submit)
  3. a page using setSearchParams on mount

I prepared a whole bug reproduction repository so feel free to use it and tweak it : https://stackblitz.com/edit/uhn4nr-react-router-useblocker-issue?file=README.md

Expected Behavior

After blocker.proceed() I expect navigating to new page without having to confirm twice, even if the page opened do a setSearchParams on mount. because on the second confirmation, my shouldBlock is false, but blocker state is blocking.

Actual Behavior

After confirming navigation (blocker.proceed()) the navigation happen. shouldBlock is false but setSearchParams is blocked, open a new confirmation modal which should be confirmed once again.

Best regards,

tpoisseau avatar Dec 27 '23 13:12 tpoisseau