Add-on SDK

Using the Add-on SDK you can create Firefox add-ons using standard Web technologies: JavaScript, HTML, and CSS. The SDK includes JavaScript APIs which you can use to create add-ons, and tools for creating, running, testing, and packaging add-ons.

---

Tutorials

Getting started

How to install the SDK and use the cfx tool to develop, test, and package add-ons.

Interact with the browser

chrome://browser/content/browser.xul

Development techniques

Learn about common development techniques, such as unit testing, logging, creating reusable modules, localization, and mobile development.

Create user interface components

Create user interface components such as toolbar buttons, context menus, menu items, and dialogs.

Modify web pages

Modify pages matching a URL pattern or dynamically modify a particular tab.

Putting it together

Walkthrough of the Annotator example add-on.

---

Guides

Contributor's guide

Learn how to start contributing to the SDK, and about the most important idioms used in the SDK code, such as modules, classes and inheritance, private properties, and content processes.

SDK infrastructure

Aspects of the SDK's underlying technology: modules, the Program ID, and the rules defining Firefox compatibility.

Content scripts

A detailed guide to working with content scripts.

SDK idioms

The SDK's event framework and the distinction between add-on scripts and content scripts.

XUL migration

A guide to porting XUL add-ons to the SDK. This guide includes a comparison of the two toolsets and a working example of porting a XUL add-on.

---

Reference

High-Level APIs

Reference documentation for the high-level SDK APIs.

Tools reference

Reference documentation for the cfx tool used to develop, test, and package add-ons, the console global used for logging, and the package.json file.

Low-Level APIs

Reference documentation for the low-level SDK APIs.