chore(rsc/example): fallback to CSR on SSR error #973
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
hi-ogawa
changed the title
hi-ogawa
force-pushed
the
11-11-chore_rsc_update_example_to_fallback_to_csr_on_ssr_error
branch
from
7fe3922 to
efbaa6d
Compare
hi-ogawa
force-pushed
the
11-11-chore_rsc_update_example_to_fallback_to_csr_on_ssr_error
branch
from
331ac90 to
ef269bd
Compare
…llback to CSR on SSR error Apply the same SSR error handling pattern from the basic example to the remaining examples that use SSR (starter, starter-cf-single, and ssg). When SSR fails, these examples now return a 500 status with a minimal HTML shell and trigger pure CSR on the browser, which replays the error and shows the error boundary. Also adds missing GlobalErrorBoundary to starter-cf-single and ssg examples. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]>
For the SSG example, when rendering fails during static site generation (options.ssg=true), the build should fail rather than generating a fallback CSR shell. The try-catch error handling is now only applied for regular SSR at request time. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]>
There was a problem hiding this comment.
Pull Request Overview
This PR implements a fallback mechanism to gracefully handle SSR errors by falling back to Client-Side Rendering (CSR) when Server-Side Rendering fails. The changes ensure that when SSR encounters an error, the server returns a minimal HTML shell with a 500 status code, allowing the client to replay the error and trigger error boundaries for proper error handling.
- Wraps SSR rendering in try-catch blocks to catch and handle errors
- Returns an object with both stream and status code from
renderHTMLfunctions - Adds proper error handling for form-based server actions with explicit 500 responses
- Implements CSR fallback using
__NO_HYDRATEflag andcreateRootinstead ofhydrateRoot
Reviewed Changes
Copilot reviewed 18 out of 18 changed files in this pull request and generated 16 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/plugin-rsc/examples/starter/src/framework/entry.ssr.tsx | Adds try-catch wrapper for SSR rendering and returns status code along with stream |
| packages/plugin-rsc/examples/starter/src/framework/entry.rsc.tsx | Updates to handle new SSR result format and adds error handling for server actions with proper status codes |
| packages/plugin-rsc/examples/starter/src/framework/entry.browser.tsx | Implements CSR fallback logic by checking for __NO_HYDRATE flag and using createRoot when SSR failed |
| packages/plugin-rsc/examples/starter-cf-single/src/framework/error-boundary.tsx | Adds new global error boundary component for catching and displaying errors |
| packages/plugin-rsc/examples/starter-cf-single/src/framework/entry.ssr.tsx | Same SSR error handling as starter example |
| packages/plugin-rsc/examples/starter-cf-single/src/framework/entry.rsc.tsx | Same RSC handling as starter example |
| packages/plugin-rsc/examples/starter-cf-single/src/framework/entry.browser.tsx | Adds error boundary wrapper and CSR fallback logic |
| packages/plugin-rsc/examples/ssg/src/framework/error-boundary.tsx | Adds new global error boundary component for SSG example |
| packages/plugin-rsc/examples/ssg/src/framework/entry.ssr.tsx | Adds SSR error handling with special case for SSG builds to let errors throw |
| packages/plugin-rsc/examples/ssg/src/framework/entry.rsc.tsx | Updates to handle new SSR result format |
| packages/plugin-rsc/examples/ssg/src/framework/entry.browser.tsx | Adds error boundary wrapper and CSR fallback logic |
| packages/plugin-rsc/examples/basic/src/routes/server-error/server.tsx | Adds new test component for triggering server errors |
| packages/plugin-rsc/examples/basic/src/routes/root.tsx | Integrates the new test server error component |
| packages/plugin-rsc/examples/basic/src/framework/error-boundary.tsx | Updates error page styling to match Next.js conventions |
| packages/plugin-rsc/examples/basic/src/framework/entry.ssr.tsx | Same SSR error handling as starter example |
| packages/plugin-rsc/examples/basic/src/framework/entry.rsc.tsx | Same RSC handling as starter example with server action error handling |
| packages/plugin-rsc/examples/basic/src/framework/entry.browser.tsx | Implements CSR fallback logic |
| packages/plugin-rsc/e2e/basic.test.ts | Adds tests for server component error handling and updates error message assertions |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
packages/plugin-rsc/examples/starter-cf-single/src/framework/error-boundary.tsx
Outdated
Show resolved
Hide resolved
packages/plugin-rsc/examples/ssg/src/framework/error-boundary.tsx
Outdated
Show resolved
Hide resolved
packages/plugin-rsc/examples/starter-cf-single/src/framework/entry.rsc.tsx
Show resolved
Hide resolved
🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <[email protected]>
hi-ogawa
deleted the
11-11-chore_rsc_update_example_to_fallback_to_csr_on_ssr_error
branch
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
Part of #795. Similar idea as wakujs/waku#1752
TODO