fix(astro): Automatically use CSR control components for prerendered pages

[wobsoriano]

Description

Fixes #7613

This PR fixes a runtime error that occurs when using Astro Clerk control components (<SignedIn>, <SignedOut>, <Protect>) on prerendered pages.

Modified the control component wrappers (SignedIn.astro, SignedOut.astro, Protect.astro) to detect when Astro.locals.auth is unavailable and automatically fall back to CSR (client-side rendering) variants.

Checklist

• pnpm test runs as expected.
• pnpm build runs as expected.
• (If applicable) JSDoc comments have been added or updated for any package exports
• (If applicable) Documentation has been updated

Type of change

• 🐛 Bug fix
• 🌟 New feature
• 🔨 Breaking change
• 📖 Refactoring / dependency upgrade / documentation
• other:

Summary by CodeRabbit

• New Features

  • Added a new example prerendered page demonstrating how to use Clerk authentication components in static build scenarios.
  • Improved authentication control components to intelligently adapt and function correctly in both prerendered and dynamic rendering modes.

• Tests

  • Added end-to-end test for prerendered pages, validating Clerk authentication controls work correctly across different user authentication states.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
clerk-js-sandbox	Ready	Preview, Comment	Jan 30, 2026 0:19am

[changeset-bot]

🦋 Changeset detected

Latest commit: 0c94d7d

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

This PR includes changesets to release 1 package

Name	Type
@clerk/astro	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

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

• 🔍 Trigger a full review

✨ Finishing touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch rob/fix-astro-prerendered

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[pkg-pr-new]

Open in StackBlitz

@clerk/agent-toolkit

npm i https://pkg.pr.new/@clerk/agent-toolkit@7708

@clerk/astro

npm i https://pkg.pr.new/@clerk/astro@7708

@clerk/backend

npm i https://pkg.pr.new/@clerk/backend@7708

@clerk/chrome-extension

npm i https://pkg.pr.new/@clerk/chrome-extension@7708

@clerk/clerk-js

npm i https://pkg.pr.new/@clerk/clerk-js@7708

@clerk/dev-cli

npm i https://pkg.pr.new/@clerk/dev-cli@7708

@clerk/elements

npm i https://pkg.pr.new/@clerk/elements@7708

@clerk/clerk-expo

npm i https://pkg.pr.new/@clerk/clerk-expo@7708

@clerk/expo-passkeys

npm i https://pkg.pr.new/@clerk/expo-passkeys@7708

@clerk/express

npm i https://pkg.pr.new/@clerk/express@7708

@clerk/fastify

npm i https://pkg.pr.new/@clerk/fastify@7708

@clerk/localizations

npm i https://pkg.pr.new/@clerk/localizations@7708

@clerk/nextjs

npm i https://pkg.pr.new/@clerk/nextjs@7708

@clerk/nuxt

npm i https://pkg.pr.new/@clerk/nuxt@7708

@clerk/clerk-react

npm i https://pkg.pr.new/@clerk/clerk-react@7708

@clerk/react-router

npm i https://pkg.pr.new/@clerk/react-router@7708

@clerk/remix

npm i https://pkg.pr.new/@clerk/remix@7708

@clerk/shared

npm i https://pkg.pr.new/@clerk/shared@7708

@clerk/tanstack-react-start

npm i https://pkg.pr.new/@clerk/tanstack-react-start@7708

@clerk/testing

npm i https://pkg.pr.new/@clerk/testing@7708

@clerk/themes

npm i https://pkg.pr.new/@clerk/themes@7708

@clerk/types

npm i https://pkg.pr.new/@clerk/types@7708

@clerk/upgrade

npm i https://pkg.pr.new/@clerk/upgrade@7708

@clerk/vue

npm i https://pkg.pr.new/@clerk/vue@7708

commit: 0c94d7d

[coderabbitai]

Actionable comments posted: 0

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

packages/astro/src/astro-components/control/Protect.astro (1)

34-54: ProtectCSR is missing support for the protect-fallback slot.

While ProtectSSR correctly implements the protect-fallback slot pattern (with fallback to fallback slot) matching Protect.astro, ProtectCSR only handles the fallback slot (line 40). This creates an inconsistency: the CSR implementation won't recognize the protect-fallback slot, while the SSR implementation will.

ProtectCSR needs to add support for protect-fallback slot with the same fallback pattern used in Protect.astro and ProtectSSR.astro to maintain consistency across both rendering strategies.