fix(render): await stream.allReady before reading renderToReadableStream output

[aplr]

When using renderToReadableStream (the edge/browser/bun code path), the stream was read immediately after creation without waiting for all Suspense boundaries to resolve. This caused the output to contain streaming HTML markers (<!--$?-->, $RC hydration scripts) instead of fully resolved HTML, producing broken, blank emails in clients that don't execute JavaScript.

Root cause: renderToReadableStream returns a stream immediately with the shell HTML, then fills in pending Suspense boundaries asynchronously via inline <script> tags. Without await stream.allReady, the HTML is captured before those boundaries resolve.

Fix: Add await stream.allReady before reading the stream in both the edge render and the node render's renderToReadableStream fallback path. This is the renderToReadableStream equivalent of onAllReady in renderToPipeableStream.

Tests: The browser render variant even had an existing Suspense test whose inline snapshot explicitly asserted the broken streaming output <!--$?-->, hydration <script> tags, and the $RC function as the expected result. In other words, the test was inadvertently documenting the bug as intended behaviour rather than catching it as a regression. This commit corrects the assertion and adds a dedicated regression test alongside it.

This issue is particularly visible when using @react-email/tailwind, which uses an async Suspense-based setup on first render.

Fixes #3090

Open for discussion

Instead of awaiting stream.allReady in every render(), it could be added to both readStream() implementations.

Type of change

• Bug fix (non-breaking change which fixes an issue)

Checklist

• I have performed a self-review of my code
• I have added tests that cover the Suspense resolution behaviour for all three renderToReadableStream paths: edge, browser, node
• My changes generate no new warnings
• My changes don't break any existing tests

---

Summary by cubic

Wait for Suspense to finish before reading renderToReadableStream, so HTML is fully resolved and emails render in non‑JS clients. Applies to edge, Node fallback, and browser render; fixes #3090 and first‑render issues with @react-email/tailwind.

• Bug Fixes
  • Await stream.allReady before reading in edge, Node renderToReadableStream fallback, and browser.
  • Prevent streaming markers ($RC, <!--$?-->) from leaking; aligns with onAllReady.
  • Harden tests for renderToReadableStream: move into WritableStream block, mock react-dom/server to react-dom/server.browser, fix browser Suspense assertions, and use a deferred promise; add regression tests for <Tailwind> produces broken streaming HTML when rendering in Bun #3090.
  • Add changeset for @react-email/render patch release.

^{Written for commit 3c2a00d. Summary will update on new commits.}

[vercel]

@aplr is attempting to deploy a commit to the resend Team on Vercel.

A member of the Team first needs to authorize it.

[changeset-bot]

🦋 Changeset detected

Latest commit: 3c2a00d

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages

Name	Type
@react-email/render	Patch
@react-email/components	Patch
playground	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[pkg-pr-new]

Open in StackBlitz

npm i https://pkg.pr.new/@react-email/render@3091

commit: 13a1149

[Copilot]

Pull request overview

This PR fixes incomplete HTML output when using React’s renderToReadableStream by awaiting stream.allReady before consuming the stream, ensuring Suspense boundaries fully resolve before the HTML is captured (preventing $RC hydration scripts and <!--$?--> markers from leaking into email HTML).

Changes:

• Await stream.allReady before reading from renderToReadableStream in both the edge renderer and the node renderer’s readable-stream path.
• Add coverage asserting Suspense-resolved output for edge and node readable-stream paths.
• Reduce a couple of Suspense test delays to speed up test execution.

Reviewed changes

Copilot reviewed 6 out of 6 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
packages/render/src/node/render.tsx	Waits for stream.allReady before reading renderToReadableStream output in node.
packages/render/src/edge/render.tsx	Waits for stream.allReady before reading renderToReadableStream output in edge.
packages/render/src/node/render-node.spec.tsx	Speeds up an existing Suspense-related test delay.
packages/render/src/node/render-edge.spec.tsx	Adds regression test ensuring Suspense resolves before final HTML is returned (no $RC / <!--$?-->).
packages/render/src/edge/render.spec.tsx	Adds regression test ensuring Suspense resolves before final HTML is returned (no $RC / <!--$?-->).
packages/render/src/browser/render-web.spec.tsx	Speeds up an existing Suspense-related test delay.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

You can also share your feedback on Copilot code review. Take the survey.

[cubic-dev-ai]

No issues found across 6 files

Confidence score: 5/5

• Automated review surfaced no issues in the provided summaries.
• No files require special attention.

[cubic-dev-ai]

1 issue found across 2 files (changes from recent commits).

Prompt for AI agents (unresolved issues)

Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.


<file name="packages/render/src/node/render-edge.spec.tsx">

<violation number="1" location="packages/render/src/node/render-edge.spec.tsx:172">
P2: Suspense regression test can become a false positive because the async promise may resolve before render actually suspends.</violation>
</file>

_{Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.}