开源软件名称：

开源软件地址：

开源软件介绍：

webextensions-examples

https://github.com/mdn/webextensions-examples

Maintained by the MDN team at Mozilla.

WebExtensions are a way to write browser extensions: that is, programsinstalled inside a web browser that modify the behaviour of the browser orof web pages loaded by the browser. They are built on a set ofcross-browser APIs, so WebExtensions written for Google Chrome or Opera willin most cases run in Firefox or Edge too.

The "webextensions-examples" repository is a collection of simple but completeand installable WebExtensions. You can use the examples to see how to use theWebExtensions APIs, and as a starting point for your own WebExtensions.

The examples are made available under theMozilla Public License 2.0.

How to use "webextensions-examples"

To use the repository, first clone it.

Each example is in its own top-level directory. Install an example in yourfavourite web browser (installation instructions are below),and see how it works. Each example has its own short README explaining whatit does.

To find your way around a WebExtension's internal structure, have a look at theAnatomy of a WebExtensionpage on MDN.

To use these examples in Firefox, you should use the most recent releaseof Firefox. Some examples work with earlier releases.

A few examples rely on APIs that are currently only available in pre-releaseversions of Firefox. Where this is the case, the example should declarethe minimum version that it needs in the strict_min_version part of theapplications keyin its manifest.json file.

Installing an example

There are a couple ways to try out the example extensions in this repository.

1. Open Firefox and load about:debugging in the URL bar. Click theLoad Temporary Add-onbutton and select the manifest.json file within thedirectory of an example extension you'd like to install.Here is a videothat demonstrates how to do this.
2. Install theweb-exttool, change into the directory of the example extensionyou'd like to install, and type web-ext run. This will launch Firefox andinstall the extension automatically. This tool gives you someadditional development features such asautomatic reloading.

Index of examples

annotate-page

Sidebar demo.

apply-css

Inserts CSS into a web page.

beastify

Adds a browser action with a popup and injects a script into a web page.

bookmark-it

Adds and removes bookmarks.

borderify

Injects scripts into pages that match a URL pattern.

chill-out

Page action demo, plus some features of alarms and tabs.

commands

Defines keyboard shortcuts.

context-menu-copy-link-with-types

Advanced clipboard interaction, including copy to clipboard from a background page.

context-menu-demo

Adds items to the context menu.

contextual-identities

Contextual identities (containers) demo.

cookie-bg-picker

Demo using cookies, browser actions with popups, and content scripts.

embedded-webextension-bootstrapped

An embedded WebExtension in a bootstrapped Firefox add-on.

embedded-webextension-sdk

An embedded WebExtension in an Add-on SDK Firefox add-on.

emoji-substitution

Injects content scripts into web pages matching a given URL pattern.

eslint-example

How to configure a WebExtension with eslint.

favourite-colour

Demo of storage and options(settings) pages.

firefox-code-search

Customizes the behavior of the browser's address bar.

forget-it

Clears stored browsing data.

google-userinfo

Authenticates the user with Google.

history-deleter

Clears browsing history entries by domain.

latest-download

Displays the most recently downloaded item.

list-cookies

Lists all cookies in the active tab.

mocha-client-tests

Tests the add-on using Mocha.

native-messaging

Exchanges messages between the add-on and a Python program installed on the user's computer.

navigation-stats

Collects and displays statistics for sites the user navigates to.

notify-link-clicks-i18n

Displays localized notifications when the user clicks on links.

open-my-page-button

Opens a page bundled with the add-on, when the user clicks a toolbar button.

page-to-extension-messaging

Exchanges messages between a web page and the add-on.

permissions

Demo showing how to ask the user for additional permissions at runtime.

quicknote

Note-taking add-on: shows how to store data, and how to use browser actions and popups.

react-es6-popup

How to use React and ES6 in an add-on.

selection-to-clipboard

Basic clipboard example: copying to the clipboard in a content script.

stored-credentials

Performs HTTP basic authentication using a stored username and password.

tabs-tabs-tabs

Demo of various tabs functions: open, close, move, etc.

top-sites

Replaces the "new tab" page with links to pages that the user often visits.

user-agent-rewriter

Intercepts and modifies HTTP requests.

webpack-modules

Uses webpack to package npm modules for use in an add-on.

window-manipulator

Demo of various windows functions: create, close, resize, etc.

Learn more

To learn more about developing WebExtensions, see theWebExtensions documentation on MDNfor getting started guides, tutorials, and full API reference docs.

Problems?

If you find a problem, please file a bug.

If you need help, email the dev-addons mailing list or contact the WebExtensions team in the #webextensions IRC channel on irc.mozilla.org.

Contributing

We welcome contributions, whether they are whole new examples, new features,bug fixes, or translations of localizable strings into new languages. Pleasesee the CONTRIBUTING.md file for more details.