Skip to content

fix(react): preserve updates across preview remounts#1297

Open
pbroom wants to merge 2 commits intocodesandbox:mainfrom
pbroom:fix/restart-preview-after-last-unmount
Open

fix(react): preserve updates across preview remounts#1297
pbroom wants to merge 2 commits intocodesandbox:mainfrom
pbroom:fix/restart-preview-after-last-unmount

Conversation

@pbroom
Copy link
Copy Markdown

@pbroom pbroom commented Mar 29, 2026

Summary

  • keep the existing recovery when a new bundler registers after the last preview unmounts
  • queue file updates until replacement clients finish initializing so remounts do not drop the next edit
  • discard stale overlapping client loads for the same preview id so React StrictMode remount paths settle on the newest client

Test plan

  • YARN_IGNORE_PATH=1 yarn workspace @codesandbox/sandpack-react build
  • Focused useClient regressions in the validated v2.20.0 Sandpack mirror:
    TEST_ENV=true node ../node_modules/jest/bin/jest.js src/contexts/utils/useClient.test.ts --runInBand --runTestsByPath --transformIgnorePatterns "node_modules/(?!@codemirror)/" --modulePathIgnorePatterns e2e
  • Manual downstream smoke in color-kit under React StrictMode: initial load -> edit -> refresh -> edit -> refresh

Made with Cursor

Remounting the only preview could leave the provider idle even after a new client was created, which caused later edits and refreshes to stop updating. Restart Sandpack when a new bundler registers from idle and keep the provider status running once a client is recreated.

Made-with: Cursor
@codesandbox
Copy link
Copy Markdown

codesandbox bot commented Mar 29, 2026

Review or Edit in CodeSandbox

Open the branch in Web EditorVS CodeInsiders

Open Preview

@vercel
Copy link
Copy Markdown

vercel bot commented Mar 29, 2026

@pbroom is attempting to deploy a commit to the CodeSandbox Team on Vercel.

A member of the Team first needs to authorize it.

@codesandbox-ci
Copy link
Copy Markdown

codesandbox-ci bot commented Mar 29, 2026

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

pbroom added a commit to pbroom/sandunpack that referenced this pull request Mar 29, 2026
- Proposed an upstream fix for the sandpack-react lifecycle issue as `codesandbox/sandpack#1297`, focusing on the client recreation and provider status during remounts.
- Clarified the separation of this fix from the hosted-package issue `codesandbox/sandpack#1296` to facilitate independent review.
- Updated notes to reflect the successful validation of the color-kit docs app against the vendored Sandpack build, ensuring reliable preview state preservation during refresh flows.
Queue edits until replacement clients finish initializing and discard stale overlapping client loads. This keeps preview remounts from dropping the next update under React StrictMode.

Made-with: Cursor
@pbroom pbroom changed the title fix(react): recover after remounting the last preview fix(react): preserve updates across preview remounts Mar 29, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant