Skip to content

Conversation

@hi-ogawa
Copy link
Contributor

@hi-ogawa hi-ogawa commented Jul 26, 2025

Description

summary

  • Client already works. Client hmr catches syntax errors and triggers error overlay.
  • Avoid rsc:update when syntax errors by calling transformRequest during hotUpdate.
  • After the syntax error is fixed, next hotUpdate properly triggers server hmr (without full reload).
  • Send transformRequest error to client to trigger error overlay.
  • SSR with syntax error triggers Vite's error middleware with the same error overlay.

todo

@hi-ogawa hi-ogawa added the trigger: preview Trigger pkg.pr.new label Jul 26, 2025
@pkg-pr-new
Copy link

pkg-pr-new bot commented Jul 26, 2025

Open in StackBlitz

npm i https://pkg.pr.new/@vitejs/plugin-react@626
npm i https://pkg.pr.new/@vitejs/plugin-react-oxc@626
npm i https://pkg.pr.new/@vitejs/plugin-rsc@626
npm i https://pkg.pr.new/@vitejs/plugin-react-swc@626

commit: 703fdb5

hi-ogawa added a commit to hi-ogawa/waku that referenced this pull request Jul 26, 2025
hi-ogawa and others added 10 commits July 26, 2025 11:49
Add e2e tests for syntax error scenarios:
- Client HMR syntax error with error overlay
- Server HMR syntax error with error overlay
- Initial SSR with server component syntax error
- Initial SSR with client component syntax error

Tests validate the fix for handling syntax errors before server HMR
and proper error overlay behavior during development.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
- Remove manual timeouts in favor of Playwright defaults
- Move defineSyntaxErrorTests function to outer scope for reusability
- Replace manual waitForTimeout with expect().toPass() pattern
- Add client counter component for testing state preservation
- Simplify server syntax error test (3/4 tests now passing)

Tests validate syntax error handling during:
- Client HMR with error overlay
- Server HMR with error overlay
- Initial SSR with server/client component errors

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
- Improve error recovery detection with proper error page check
- Increase timeout for server HMR error overlay dismissal
- Re-add client state preservation test for server syntax error
- Add more lenient retry logic for SSR recovery

This addresses the intermittent test failures and ensures proper
validation of server HMR behavior without full page reloads.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
- Add client state preservation validation to client syntax error test
- Remove TODO comment from server test (now working with recent fix)
- Both HMR tests now verify client state is preserved during error recovery
- Validates that fix prevents full page reloads during syntax error handling

Tests now comprehensively verify that syntax error recovery works
without losing client state, confirming the HMR improvements work correctly.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
Merged line-by-line comments into more concise, purpose-driven sections
to improve readability and reduce verbosity.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>
@hi-ogawa hi-ogawa marked this pull request as ready for review July 26, 2025 05:54
@hi-ogawa hi-ogawa changed the title fix(rsc): handle syntax errors before server hmr fix(rsc): handle transform errors before server hmr Jul 26, 2025
@hi-ogawa hi-ogawa merged commit d28356f into main Jul 26, 2025
24 checks passed
@hi-ogawa hi-ogawa deleted the 07-26-fix_rsc_handle_syntax_errors_before_server_hmr branch July 26, 2025 07:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

trigger: preview Trigger pkg.pr.new

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Gracefully handle syntax error during dev

2 participants