browser-extension-builder

Builds Chrome and Firefox extensions using Manifest V3, content scripts, and service workers.

1|Updated Aug 17, 2025
One-click install
npx skills add https://github.com/ratnesh-maurya/mdconverter --skill browser-extension-builder-ratnesh-maurya
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: browser-extension-builder
Source: https://github.com/ratnesh-maurya/mdconverter/tree/main/.claude/skills/browser-extension-builder
Command: npx skills add https://github.com/ratnesh-maurya/mdconverter --skill browser-extension-builder-ratnesh-maurya

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Building a browser extension requires navigating Manifest V3 configuration, content script injection, background service workers, and Chrome Web Store policies, which is error-prone without a clear architecture. ## Core Features & Use Cases - Extension Architecture: Provides a standard project structure with popup, content scripts, background service worker, options page, and icons. - Manifest V3 Templates: Supplies ready-to-adapt manifest.json configurations with permissions, content script matching, and action definitions. - Storage and Messaging Patterns: Implements chrome.storage local/sync APIs and message passing between popup, background, and content scripts. - Use Case: You want to build an extension that highlights data on web pages and saves user preferences. Use this Skill to scaffold the manifest, inject a floating UI via a content script, and persist settings with chrome.storage. ## Quick Start Ask the AI to scaffold a Manifest V3 browser extension with a popup UI, a content script that modifies page elements, and chrome.storage for saving settings.

Frequently Asked Questions about browser-extension-builder

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

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

Create a manifest.json with manifest_version 3, declare permissions like storage and activeTab, and register your popup, content scripts, and background service worker. Organize the project into popup, content, background, options, and icons directories.

How do content scripts communicate with the popup in a browser extension?

Content scripts communicate with popups through the background service worker using chrome.runtime.onMessage listeners and sendResponse callbacks. Return true from the listener to keep the message channel open for asynchronous responses.

What is the difference between chrome.storage.local and chrome.storage.sync?

chrome.storage.local stores up to 5MB on the local device, while chrome.storage.sync is limited to 100KB total with 8KB per item but syncs across the user's signed-in devices. Use sync for small settings and local for larger data.

Why does my Manifest V3 background script stop running?

Manifest V3 service workers are terminated when idle, unlike persistent background pages in MV2. Keep background logic minimal, use chrome.alarms for periodic tasks, and offload heavy work to content scripts.

What permissions should a browser extension request?

Request only the minimum permissions needed, such as storage and activeTab, since broad permissions reduce installs and risk store rejection. Use optional permissions and request them at the time of use with an explanation in the description.