This repository is intended as an example repository containing templates and good practices for creating a WebExtension based add-on for Firefox.

Note: I'm no longer maintaining this repository. The concepts and tools here will likely continue to work. Having automated testing of your code is always a good idea.

Aims

The aim of this repository is to bring together tools and services into a template/example repository, so that add-on developers can have a good starting point for created WebExtensions that includes testing suites.

What's here

This repository includes a small WebExtension as an example, and includes the infrastructure to build and test it using Firefox.

It has test suites for lint, unit, and integration/ functional testing. There's also code coverage for the unit tests.

Additionally the test suites are run on the Travis service providing continuous testing coverage. This may be reflected in a developer's own repository where it is open source, providing coverage of pull requests etc.

Quick Start

• Copy the files from this repository into a new one you've created (don't forget the .* files, but not the .git folder!).
• Edit package.json and manifest.json to set up the names and information for your extension. Also edit the message.json files in add-on/_locales/ to set up the user visible names and descriptions.
• Run npm install
• Run npm test to check that everything is OK.
  • You may need to update module.exports.promiseAddonButton with the new add-on name.

If you're publishing your extension on github:

• Create a repository on github (if you haven't already), and commit & push the code.
• Enable Travis & Coveralls.
  • Update the top of this README.md if you want the correct badges for your test status & code coverage displayed.
• Enable a module updating tool.

Source Tree Outline

• add-on/
  • The add-on source code. In a separate directory so that the web-ext tool will only ship files in that directory.
• docs/
  • Useful documents!
• test/
  • Tests for the add-on including unit and functional tests.
• .eslintrc.js, .eslintignore
  • The configuration for eslint, used to lint the code.
• .travis.yml
  • Setup for continuous integration via Travis CI - default setup is to build every time you push or someone creates a PR.
• karma.config.js
  • The configuration for running the functional tests in test/functional.

Documentation

It is intended that all parts of this repository have at least outline documentation. If you find any parts that are missing, please file an issue or create a PR.

• Building, running code and tests
• Keeping modules up to date via automated services
• Testing
  • Linting
  • Unit Tests
  • Functional Tests

Issues

If you've found an issue with WebExtensions themselves, or wish to discuss them further, please use the add-ons community on discourse

For issues and items not working properly in this repository, please see the issues list, or file a new one.