mdn / mdn/webextensions-examples

Add script-on-click example and related content

Open
#635 8 comments 0 reactions 1 assignee View on GitHub

@rebloor is already working on this.

Since Aug 21, 2026.

example
Dominant language
JavaScript
Stars
4.5k
Forks
2.6k
Avg merge
15h 27m
Merged PRs (30d)
3

Description

Add a tutorial using script-on-click: an example of how to create a cross-browser MV3 extension example that uses a service worker on browsers that support it and an event page on browsers that do not support it (Firefox in particular).

The code sample was part of a presentation that shows this progression:

Note on preferred_environment: Neither Firefox nor Safari requires background.preferred_environment, if both scripts and service_worker are specified, both browsers choose scripts. preferred_environment should only be used if the dev prefs to use service_worker where available. This behavior is documented in detail at https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/background#browser_support.

...and if you need even more context on the design of the feature and the cross-browser behavior, there is more to read at https://github.com/w3c/webextensions/issues/282MDN Web Docsbackground - Mozilla | MDN Use the background key to include one or more background scripts, a background page, or a Service worker in your extension.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.