test(ssr): add SSR and hydration tests for 'getServerSnapshot'

[sukvvon]

Summary

• Add ssr.test.tsx with tests for getServerSnapshot callback in useSnapshot
• Test initial snapshot and latest snapshot after proxy state changes
• Add hydration mismatch test to verify getServerSnapshot prevents hydration error
• Covers previously uncovered line 161 in src/react.ts

Check List

• pnpm run fix for formatting and linting code and docs

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
valtio	Ready	Preview, Comment	Mar 8, 2026 3:35am

[codesandbox-ci]

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.

[pkg-pr-new]

More templates

• counter
• editor-proxyWithHistory
• valtio-photo-booth-demo
• starter

npm i https://pkg.pr.new/valtio@1209

commit: 6ee03db

[dai-shi]

Unless I don't misunderstand, this is not a valid test.

[dai-shi]

I think this test still passes even if we remove getServerSnapshot.

[sukvvon]

@dai-shi I verified by removing getServerSnapshot — the test fails with Missing getServerSnapshot, which is required for server-rendered content. So renderToString does invoke getServerSnapshot, and this test validates its presence.

[dai-shi]

Okay, but this test doesn't cover the behavior of getServerSnapshot. For example, if we have the getServerSnapshot implementation identical to that of getSnapshot, the test may pass.

[sukvvon]

@dai-shi You're right — this test doesn't distinguish the behavior of getServerSnapshot from getSnapshot. However, it serves as a regression test to ensure getServerSnapshot is provided, since renderToString throws if it's missing. I also added a test (3aea407) that verifies the latest snapshot is returned after proxy state changes.

[sukvvon]

@dai-shi Added a hydration mismatch test (a5c4d42) that verifies getServerSnapshot prevents hydration error by rendering with renderToString and hydrating with hydrateRoot, asserting no console.error is called.

[dai-shi]

I think I've got a better explanation.

The purpose of getServerSnapshot is to avoid hydration error.
So, the test should cover that. Testing if getServerSnapshot is defined is too trivial (only to increase the test coverage without much benefit.)

We've never tested if the current implementation can avoid hydration error.

valtio/src/react.ts

Line 161 in 383ccf1

() => snapshot(proxyObject),

If the test reveals it, we need to fix the implementation.

[dai-shi]

This is too naive. The AI doesn't understand the underlying problem.
Try to create a bug so that such a hydration-mismatch test fails.
I'm not sure if it's possible. But, otherwise, it's not valid for getServerSnapshot test.