clerk-testing

bởi clerk

Các tiện ích kiểm thử E2E cho luồng xác thực Clerk trong Playwright và Cypress. Hỗ trợ cả hai framework Playwright và Cypress với các mẫu thiết lập dành riêng cho từng framework (globalSetup cho Playwright, custom commands cho Cypress). Cung cấp các tiện ích clerkSetup() và setupClerkTestingToken() để khởi tạo môi trường kiểm thử và vượt qua tính năng phát hiện bot. Bao gồm tính năng lưu trạng thái storageState để tái sử dụng các phiên đã xác thực qua các bài kiểm thử, giúp giảm thời gian thực thi kiểm thử. Yêu cầu khóa API kiểm thử ( pk_test_* ,...

npx skills add https://github.com/clerk/skills --skill clerk-testing

Testing

Decision Tree

FrameworkDocumentation
Overviewhttps://clerk.com/docs/guides/development/testing/overview
Playwrighthttps://clerk.com/docs/guides/development/testing/playwright/overview
Cypresshttps://clerk.com/docs/guides/development/testing/cypress/overview

Mental Model

Test auth = isolated session state. Each test needs fresh auth context.

  • clerkSetup() initializes test environment
  • setupClerkTestingToken() bypasses bot detection
  • storageState persists auth between tests for speed

Workflow

  1. Identify test framework (Playwright or Cypress)
  2. WebFetch the appropriate URL from decision tree above
  3. Follow official setup instructions
  4. Use development-instance keys only (pk_test_* / sk_test_*). If the project has no keys yet, npx clerk@latest init (the Clerk CLI; see clerk-setup) creates a Clerk application and writes development-instance keys to the env file. No Clerk account or Dashboard visit is needed.

Best Practices

  • Use setupClerkTestingToken() before navigating to auth pages
  • Use test API keys: pk_test_xxx, sk_test_xxx
  • Save auth state with storageState for faster tests
  • Use page.waitForSelector('[data-clerk-component]') for Clerk UI

Anti-Patterns

PatternProblemFix
Production keys in testsSecurity riskUse pk_test_* keys
No setupClerkTestingToken()Auth failsCall before navigation
UI-based sign-in every testSlow testsUse storageState

Framework-Specific

Playwright: Use globalSetup for auth state Cypress: Add addClerkCommands({ Cypress, cy }) to support file

See Also

  • clerk-setup - Install Clerk before adding tests
  • clerk-nextjs-patterns - Next.js patterns being tested
  • Demo Repo

Thêm skills từ clerk

mosaic
clerk
Work on Mosaic UI: styling a component with slot recipes (`defineSlotRecipe` / `useRecipe` / slots / variants), or building a flow — authoring a state machine…
clerk-billing
clerk
Quản lý đăng ký Clerk Billing - hiển thị PricingTable của Clerk
clerk-nextjs-patterns
clerk
Các mẫu Next.js nâng cao cho xác thực, middleware, Server Actions và bộ nhớ đệm theo phạm vi người dùng với Clerk. Phân biệt auth() phía máy chủ với hook useAuth() phía máy khách; việc trộn lẫn chúng là một lỗi phổ biến gây hỏng. Bao gồm các chiến lược middleware (ưu tiên công khai so với ưu tiên bảo vệ), bảo vệ tuyến API và mã trạng thái HTTP phù hợp (401 so với 403). Bao gồm các mẫu bộ nhớ đệm theo phạm vi người dùng với unstable_cache và bảo vệ Server Actions khỏi các thay đổi trái phép. Cung cấp khả năng tương thích Core 2...
clerk-expo-patterns
clerk
Các mẫu Expo / React Native với Clerk — Bộ nhớ đệm token SecureStore, OAuth
changesets
clerk
Create or refresh a `.changeset/<slug>.md` for the current branch, or report that none is required. Triggers on "/changesets create", "add a changeset",…
clerk
clerk
Tệp nhị phân clerk là một cổng đã được xác thực trước đến Backend API và Platform API của Clerk, cùng với các công cụ cấp dự án (xác thực, liên kết, kéo biến môi trường, cấu hình phiên bản). Khi người dùng hỏi bất cứ điều gì liên quan đến tài nguyên Clerk, hãy sử dụng clerk trước thay vì tự viết lệnh curl.
clerk-cli
clerk
Tệp nhị phân clerk là một cổng đã được xác thực trước đến Backend API và Platform API của Clerk, cùng với các công cụ cấp dự án (xác thực, liên kết, kéo môi trường, cấu hình phiên bản). Khi người dùng hỏi bất cứ điều gì liên quan đến tài nguyên Clerk, hãy sử dụng clerk trước thay vì tự viết lệnh curl.
clerk-astro-patterns
clerk
Các mẫu Astro với Clerk — middleware, trang SSR, thành phần island,