-
Notifications
You must be signed in to change notification settings - Fork 50.7k
Description
When startTransition is called inside a popstate event handler (like pressing the browser back button), React shows the Suspense fallback if the component suspends. Outside of popstate events, startTransition keeps the previous UI visible while the new content loads. The popstate case should behave the same way.
This was discussed as planned but not yet implemented in #26025:
"the thinking was we would fall back to the regular transition behavior (give up and change it back to async). This PR doesn't implement that but it's not as urgent as the main fix and we can add that later."
React version: 19.2.0
Steps To Reproduce
- Render a component that suspends inside a
Suspenseboundary. Let it resolve. - Call
history.pushStateand usestartTransitionto render a different component. - Invalidate the first component's data so it will suspend again on next render.
- Press the browser back button. In the
popstatehandler, callstartTransitionto switch back.
Link to code example: https://codesandbox.io/p/sandbox/mfs2q3
Note: Does not reproduce in CodeSandbox's iframe. Open the preview in a new tab.
The current behavior
The Suspense fallback is shown during back navigation, even though the update is wrapped in startTransition. This only happens when startTransition is called inside a popstate event. The same startTransition call outside of popstate keeps the previous UI visible as expected.
The expected behavior
The previous UI should stay visible while the suspended component loads, regardless of whether startTransition was called inside a popstate event or not. The synchronous popstate optimization (#26025) should fall back to normal transition behavior when it can't finish without suspending.