[PR #560] [MERGED] fix: rewrite Flight HL stylesheet hints during client-side navigation #675

New issue

Closed

opened 2026-05-06 13:09:28 +02:00 by BreizhHardware · 0 comments

BreizhHardware commented

2026-05-06 13:09:28 +02:00

Owner

📋 Pull Request Information

Original PR: https://github.com/cloudflare/vinext/pull/560
Author: @NathanDrake2406
Created: 3/16/2026
Status: ✅ Merged
Merged: 3/17/2026
Merged by: @james-elicx

Base: main ← Head: fix/preload-as-client-nav

📝 Commits (3)

62db6ff fix: rewrite Flight HL "stylesheet" hints at the stream source
da3b04e chore: retrigger CI
a840757 Merge remote-tracking branch 'origin-https/main' into fix/preload-as-client-nav

📊 Changes

4 files changed (+262 additions, -48 deletions)

View changed files

📝 packages/vinext/src/entries/app-rsc-entry.ts (+31 -1)
📝 packages/vinext/src/entries/app-ssr-entry.ts (+7 -15)
📝 tests/__snapshots__/entry-templates.test.ts.snap (+193 -21)
📝 tests/app-router.test.ts (+31 -11)

📄 Description

Summary

Fix <link rel=preload> missing valid as attribute during client-side navigation (#558)
React's Flight server emits HL["url","stylesheet"] hints for CSS, but "stylesheet" is not a valid HTML as value (should be "style")
The previous fixFlightHints in app-ssr-entry.ts only covered SSR-embedded Flight data — client-side navigation, server action, and HMR responses were unpatched
Wrap renderToReadableStream in app-rsc-entry.ts so every Flight stream is rewritten at the source — one fix that covers all consumers
Remove the now-redundant fixFlightHints from the SSR embed transform

Approach

Instead of patching each consumer (SSR embed, browser navigation, server actions, HMR), the fix shadows the renderToReadableStream import with a wrapper that pipes through a TransformStream rewriting "stylesheet" → "style" in HL hints. Every downstream consumer gets clean data automatically.

Test plan

New test: generateRscEntry wraps renderToReadableStream with HL hint fix
Existing fixFlightHints regex tests still pass (updated comment)
fixPreloadAs (Fizz HTML stream fix) unchanged and passing
Entry template snapshots updated
npx vp test run tests/app-router.test.ts -t "CSS preload fix" — all 4 tests pass

Closes #558

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/cloudflare/vinext/pull/560 **Author:** [@NathanDrake2406](https://github.com/NathanDrake2406) **Created:** 3/16/2026 **Status:** ✅ Merged **Merged:** 3/17/2026 **Merged by:** [@james-elicx](https://github.com/james-elicx) **Base:** `main` ← **Head:** `fix/preload-as-client-nav` --- ### 📝 Commits (3) - [`62db6ff`](https://github.com/cloudflare/vinext/commit/62db6ff7833751acdc7f617d7161dbc00cda74d0) fix: rewrite Flight HL "stylesheet" hints at the stream source - [`da3b04e`](https://github.com/cloudflare/vinext/commit/da3b04e658145024adb7cca541c49bcd07b834ac) chore: retrigger CI - [`a840757`](https://github.com/cloudflare/vinext/commit/a840757a0a506dbde9c5aab8aa32ab0b268ed913) Merge remote-tracking branch 'origin-https/main' into fix/preload-as-client-nav ### 📊 Changes **4 files changed** (+262 additions, -48 deletions) <details> <summary>View changed files</summary> 📝 `packages/vinext/src/entries/app-rsc-entry.ts` (+31 -1) 📝 `packages/vinext/src/entries/app-ssr-entry.ts` (+7 -15) 📝 `tests/__snapshots__/entry-templates.test.ts.snap` (+193 -21) 📝 `tests/app-router.test.ts` (+31 -11) </details> ### 📄 Description ## Summary - Fix `<link rel=preload>` missing valid `as` attribute during client-side navigation (#558) - React's Flight server emits `HL["url","stylesheet"]` hints for CSS, but `"stylesheet"` is not a valid HTML `as` value (should be `"style"`) - The previous `fixFlightHints` in `app-ssr-entry.ts` only covered SSR-embedded Flight data — client-side navigation, server action, and HMR responses were unpatched - Wrap `renderToReadableStream` in `app-rsc-entry.ts` so every Flight stream is rewritten at the source — one fix that covers all consumers - Remove the now-redundant `fixFlightHints` from the SSR embed transform ## Approach Instead of patching each consumer (SSR embed, browser navigation, server actions, HMR), the fix shadows the `renderToReadableStream` import with a wrapper that pipes through a TransformStream rewriting `"stylesheet"` → `"style"` in HL hints. Every downstream consumer gets clean data automatically. ## Test plan - [x] New test: `generateRscEntry` wraps `renderToReadableStream` with HL hint fix - [x] Existing `fixFlightHints` regex tests still pass (updated comment) - [x] `fixPreloadAs` (Fizz HTML stream fix) unchanged and passing - [x] Entry template snapshots updated - [x] `npx vp test run tests/app-router.test.ts -t "CSS preload fix"` — all 4 tests pass Closes #558 --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>