clerk-chrome-extension-patterns
Installation
SKILL.md
Chrome Extension Patterns
CRITICAL RULES
- OAuth (Google, GitHub, etc.) and SAML are NOT supported in popups or side panels -- use
syncHostto delegate auth to your web app - Email links (magic links) don't work in popups -- the popup closes when the user clicks outside, resetting sign-in state
- Side panels don't auto-refresh auth state -- users must close and reopen the side panel after signing in via the web app
- Service workers and content scripts have NO access to Clerk React hooks -- use
createClerkClient()or message passing - Extension URLs use
chrome-extension://nothttp://-- all redirect URLs must usechrome.runtime.getURL('.') - Without a stable CRX ID, every rebuild breaks auth -- configure
keyin manifest BEFORE deploying - Content scripts cannot use Clerk directly due to origin restrictions -- Clerk enforces strict allowed origins
- Bot protection must be DISABLED in Clerk Dashboard -- Cloudflare bot detection is not supported in extension environments
Authentication Options
| Method | Popup | Side Panel | syncHost (with web app) |
|---|---|---|---|
| Email + OTP | Yes | Yes | Yes |
| Email + Link | No | No | Yes |
Related skills
More from clerk/skills
clerk-nextjs-patterns
Advanced Next.js patterns - middleware, Server Actions, caching with
11.2Kclerk
Clerk authentication router. Use when user asks about adding authentication,
7.7Kclerk-setup
Add Clerk authentication to any project by following the official quickstart
6.9Kclerk-custom-ui
Custom authentication flows and component appearance - hooks (useSignIn,
6.7Kclerk-webhooks
Clerk webhooks for real-time events and data syncing. Verify with verifyWebhook
6.0Kclerk-testing
E2E testing for Clerk apps. Use with Playwright or Cypress for auth flow
5.8K