Requires understanding React's transition handling during navigation events
The issue describes inconsistent Suspense behavior when startTransition is called during popstate events versus regular transitions. The fix needs to align these behaviors while handling browser navigation events. The main challenge is understanding React's transition and Suspense coordination during navigation.
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
Suspense boundary. Let it resolve.history.pushState and use startTransition to render a different component.popstate handler, call startTransition to 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 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 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.
Claim this issue to let others know you're working on it. You'll earn 20 points when you complete it!