browser-extension

Build and ship Manifest V3 browser extensions with typed messaging and least-privilege security.

1|Updated Jun 2, 2026
One-click install
npx skills add https://github.com/envoydev/claude-stack --skill browser-extension-envoydev
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: browser-extension
Source: https://github.com/envoydev/claude-stack/tree/main/stack/skills/browser-extension
Command: npx skills add https://github.com/envoydev/claude-stack --skill browser-extension-envoydev

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Browser extension development fails in predictable ways: service workers that lose state on termination, store rejections from overbroad permissions, CSP violations from runtime template compilation, and untyped messaging that rots the codebase. This Skill encodes the MV3 platform constraints and engineering patterns that survive review and termination. ## Core Features & Use Cases - MV3 Architecture Guidance: Design the ephemeral service worker as an event router, persist state across storage tiers, and handle cold starts with synchronous listener registration. - Security Floor: Apply least-privilege permissions, OAuth with PKCE, sender validation on messages, and strict CSP compliance to pass Chrome Web Store and AMO review. - Tooling and Shipping: Scaffold with WXT, test with Vitest and Playwright persistent contexts, and publish to Chrome, Firefox, and Edge stores via CI. - Use Case: When asked to build a Chrome extension with a popup UI and content script, use this Skill to structure the typed message contract, choose storage quotas correctly, and prepare a store-compliant submission. ## Quick Start Use the browser-extension skill to scaffold a Manifest V3 extension with a typed messaging layer and WXT tooling.

Frequently Asked Questions about browser-extension

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

FAQPage Schema
How do I build a Chrome extension with Manifest V3?▼

Build MV3-only since Chrome stopped running MV2 for ordinary users in mid-2025. Design the background as an ephemeral service worker that routes events and persists all state to chrome.storage, and scaffold with WXT for cross-browser builds and content-script HMR.

WXT vs Plasmo vs CRXJS for browser extension development?▼

WXT is the default pick: a Vite-based framework with generated manifests, cross-browser builds, and active maintenance. CRXJS suits Chromium-only projects wanting full Vite control. Plasmo is stalled with no releases in about a year and should be avoided for new projects.

Why does my extension service worker lose its state?▼

Service workers terminate after roughly 30 seconds of idle, wiping all globals. Persist ephemeral state in chrome.storage.session, durable data in chrome.storage.local, and use chrome.alarms instead of setInterval, which dies with the worker.

Can I use Vue or Angular in an extension popup?▼

Yes, but extension-page CSP forbids unsafe-eval, so runtime template compilation breaks. Use Vue's runtime-only build with precompiled SFCs or Angular AOT only, never JIT. Svelte and React precompile anyway and are generally safe.

Why was my Chrome Web Store extension rejected?▼

Common causes are overbroad host permissions like all_urls, remotely hosted code, obfuscation, and violating the single-purpose policy. Request optional host permissions at runtime with activeTab, bundle every dependency, and keep one narrow purpose.

How do I test a browser extension end to end?▼

Use Playwright with a Chromium persistent context, loading the built extension via --load-extension with an absolute path. Resolve the extension ID dynamically from the service-worker URL, and unit-test business logic in plain TS modules with a fake chrome API.