Skip to main content
Docs

SwiftUI previews

Use Clerk.preview() in #Preview blocks to render Clerk-powered SwiftUI screens without launching a full app session.

Use Clerk.preview()

Inject Clerk.preview() into your preview environment:

import ClerkKit
import SwiftUI

#Preview("Signed Out") {
  ContentView()
    .environment(Clerk.preview { preview in
      preview.isSignedIn = false
    })
}

#Preview("Signed In") {
  ContentView()
    .environment(Clerk.preview())
}

Parameters

  • Name
    isSignedIn
    Type
    Bool
    Description

    Controls whether the preview uses signed-in or signed-out mock state. Defaults to true.

Use ClerkEnvironment.json for realistic previews

For more realistic preview behavior, add your instance's /v1/environment response to a ClerkEnvironment.json file in your app bundle. Clerk.preview() will load it automatically.

Copy your environment response

Open the following URL in a new browser tab. Replace YOUR_FRONTEND_API_URL with your .

https://YOUR_FRONTEND_API_URL/v1/environment

Then, copy the raw JSON response body.

Create ClerkEnvironment.json

In Xcode:

  1. Add a new file named ClerkEnvironment.json to your app project.
  2. Paste the /v1/environment JSON response into the file.
  3. Ensure your app target is selected in Target Membership so the file is included in the main bundle.

Note

If you change your Clerk configuration, fetch /v1/environment again and replace ClerkEnvironment.json so previews stay in sync.

Refresh previews

Rebuild the preview canvas. Clerk.preview() will:

  1. Look for ClerkEnvironment.json in Bundle.main.
  2. Use that environment if found and decodable.
  3. Fall back to Clerk.Environment.mock if the file is missing or invalid.

Troubleshooting

  • If your preview still looks generic, confirm the file name is exactly ClerkEnvironment.json and that it is part of your app target.
  • Clerk.preview() is preview-only. Outside SwiftUI previews, it returns Clerk.shared.

Feedback

What did you think of this content?

Last updated on

View raw fileGitHubEdit on GitHub