Awesome WebExtensions

A curated list of awesome resources for WebExtensions development.

WebExtensions are a cross-browser system for developing browser add-ons. To a large extent the system is compatible with the extension API supported by Google Chrome and Opera. Extensions written for these browsers will in most cases run in Firefox or Microsoft Edge with just a few changes.

Contents

• Getting Started
• Community
• Libraries and Frameworks
• Tools
• Boilerplates
• Sample Extensions

Getting started

• Chrome Extensions documentation - Documentation for the original Chrome extension model.
• Chrome Extensions API - Comprehensive documentation on the original API provided by Chrome.
• Mozilla's WebExtensions documentation - MDN wiki for the WebExtensions API.
• Browser support for WebExtensions - Compatibility table for Chrome, Edge, Firefox, and Opera.
• Mozilla Firefox API support - Detailed WebExtensions support for Firefox.
• Microsoft Edge API support - Detailed WebExtensions support for Edge.
• Opera API support - Detailed WebExtensions support for Opera.
• Porting Chrome Extensions to Firefox - Guide to prepare, install, and debug Chrome extensions to be ported in Firefox.

Community

Chrome

• Google Groups - Discussions.
• Stack Overflow - Relevant questions.

Firefox

• Mailinglist - Discussions.
• Stack Overflow - Relevant questions.
• #webextensions - IRC.

Edge

• Stack Overflow - Relevant questions.

Libraries and Frameworks

Code meant become part of the extension.

• webext-options-sync - Helps you manage and autosave your extension's options.
• webext-inject-on-install - Automatically add content scripts to existing tabs when your extension is installed. Chrome + Firefox.
• chrome-promise - Promised version of chrome.* callback-style functions.
• redux-webext - Uses redux for managing the state of your WebExtension

Tools

Apps that help you manage your extensions.

• Chrome Webstore Upload - Upload the extension to the Chrome Web Store via cli (or on Travis, automatically).
• mozilla/Web-ext Command line tool to help build, run, and test WebExtensions.
• chromepet - Get notified when your new version has been published.
• inline-install - Simplify the installation of the extension directly from your website.
• wemf - Format and validate manifest.json.
• maniver - Bump the extension version via cli.
• chrome-ext-downloader - Download any extension on Chrome Web Store to see how they do it.
• unzip-crx - Unzips Google Chrome (crx) files.
• chrome-store-api - Chrome Web Store API wrapper.
• crx2ff - Check the compatibility of a Chrome extension with the Firefox WebExtensions API.
• chromereload - Auto-reload your extension during development.

Testing

• sinon-chrome - Mocks the Chrome Extensions API for testing.
• addons-validator - Validate an extension against Mozilla's guidelines.

Boilerplates

• extensionizr.com - Web UI that helps you create an initial configuration and files.
• generator-chrome-extension - Boilerplate based on gulp & babel.
• generator-chrome-extension-kickstart - Flexible Boilerplate based on gulp, webpack & babel.
• react-chrome-extension-boilerplate - React boilerplate with Hot reloading.

Sample Extensions

These are simple and modern WebExtensions repositories that could help you figure out where pieces go, including automatic deployment via Travis CI.

• npm-hub
• Sticky Pinned Tabs
• Dim Files on GitHub
• Refined GitHub

License

To the extent possible under law, Federico Brigante has waived all copyright and related or neighboring rights to this work.