skills.rest
Joshkovu
JoshkovuCOMMUNITY
Explore all skills by this author →
𝕏@JoashKutee80790GitHub

clerk-chrome-extension-patterns

Configure Clerk authentication across Chrome extension UI, service workers, and content scripts.

1|Updated May 1, 2026
Search Tags:#oauth#service worker#clerk#token refresh#plasmo#chrome extensions#syncHost
One-click install
npx skills add https://github.com/Joshkovu/ghost-ai --skill clerk-chrome-extension-patterns-joshkovu
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: clerk-chrome-extension-patterns
Source: https://github.com/Joshkovu/ghost-ai/tree/main/.agents/skills/clerk-chrome-extension-patterns
Command: npx skills add https://github.com/Joshkovu/ghost-ai --skill clerk-chrome-extension-patterns-joshkovu

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill solves the challenge of implementing Clerk authentication in Chrome extensions where popup/side panel flows cannot reliably handle OAuth/SAML and where background service workers and content scripts must follow strict token and origin constraints.

Core Features & Use Cases

  • Popup/Side Panel Auth Guardrails: Uses Clerk extension UI components correctly while enforcing that OAuth and SAML are delegated rather than executed in the extension UI.
  • syncHost Delegation for Web-App-Based OAuth/SAML: Keeps extension auth in sync with a companion web app so users can authenticate once and the extension reflects that state.
  • createClerkClient for Background/Headless: Fetches and refreshes session tokens in service workers via the correct client import and the background: true option.
  • Content Script Token Access via Message Passing: Enables page-side UI injection based on authenticated state by requesting tokens from the background worker rather than calling Clerk directly.
  • Stable CRX ID and Allowed Origins: Prevents auth breakage after rebuilds by pinning the extension key/ID and updating Clerk allowed origins accordingly.

Quick Start

Use the clerk-chrome-extension-patterns skill to set up your popup auth and, when you need OAuth or SAML, configure syncHost with host_permissions plus a stable CRX ID so the extension can delegate and reliably read session state.

Frequently Asked Questions about clerk-chrome-extension-patterns

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I handle Clerk OAuth in a Chrome extension popup or side panel?▼

Clerk OAuth in Chrome extension popups requires delegating the authentication flow to a companion web app via syncHost. You configure manifest host_permissions and Clerk allowed origins so the extension UI stays in sync with web app session state.

How do I access Clerk session tokens in a Chrome extension service worker?▼

To access Clerk session tokens in a background service worker, use createClerkClient imported from @clerk/chrome-extension/client with the background: true option. This allows the headless worker to fetch and refresh tokens reliably.

How do I get Clerk auth tokens in Chrome extension content scripts?▼

Content scripts obtain Clerk auth tokens by using chrome.runtime message passing to request them from the background service worker. This bypasses strict origin constraints by preventing content scripts from calling the Clerk client directly.

Why does Clerk authentication break after rebuilding my Chrome extension?▼

Chrome extension authentication breaks after rebuilds because the extension ID changes. You must pin a stable CRX ID using the extension key and update the Clerk allowed origins configuration to match that specific ID.

Does Clerk authentication work with Plasmo Chrome extensions?▼

Yes, Clerk authentication works with Plasmo Chrome extensions by applying UI components in the popup or side panel. It delegates OAuth/SAML via syncHost and manages headless background state for reliable sign-in flows.

What are the limitations of using Clerk directly in a Chrome extension popup?▼

Chrome extension popups cannot reliably execute OAuth or SAML flows directly due to popup-side limitations. You must delegate these flows to a companion web app using syncHost instead of attempting to run them within the extension UI.

Related Skills

Explore More Software Engineering Skills→
clerkclerk
66

clerk-chrome-extension-patterns

Authenticate Chrome extension users with Clerk across popup, background, and content-script contexts.

Official
Advanced
Endsi3gEndsi3g

clerk-chrome-extension-patterns

Configure Clerk authentication across Chrome extension contexts with syncHost and messaging.

Community
Advanced
Aditya07024Aditya07024

clerk-chrome-extension-patterns

Implement Clerk authentication patterns for Chrome extensions with popup and service worker workflows.

Community
Advanced
RajAryanIITBHURajAryanIITBHU

clerk-chrome-extension-patterns

Implement secure Clerk authentication for Chrome extensions with session syncing and token caching.

Community
Advanced