WebExtensions の開発方法を分かりやすくなるよう、シンプルな WebExtensions のサンプルを集めたレポジトリ https://github.com/mdn/webextensions-examples を公開しています。この記事では、そのレポジトリにあるアドオンについて説明します。
これらのサンプルは Firefox Nightly で動作します。よりバージョン番号の小さい Firefox で動作するものもありますが、アドオンの manifest.json に指定されている strict_min_version キーを必要に応じて確認してください。
これらのアドオンをインストールする際には、about:debugging を利用した方法で行うことを推奨します。これは Firefox 45 から導入されたインストール方法ですが、パッケージ化や署名の必要なしに、アドオンをディレクトリから直接読み込むことができます。
レポジトリにコントリビュートしたい方は、是非とも pull request を送ってください！
beastify
https://github.com/mdn/webextensions-examples/tree/master/beastify
Adds a browser action icon to the toolbar. Click the button to choose a beast. The active tab's body content is then replaced with a picture of the chosen beast.
Manifest keys
JavaScript modules
Bookmark it!
https://github.com/mdn/webextensions-examples/tree/master/bookmark-it
A simple bookmark button
Manifest keys
JavaScript modules
borderify
https://github.com/mdn/webextensions-examples/tree/master/borderify
Adds a solid red border to all webpages matching mozilla.org.
Manifest keys
chill-out
https://github.com/mdn/webextensions-examples/tree/master/chill-out
Show a page action after a period of inactivity. Show cat gifs when the page action is clicked.
Manifest keys
JavaScript modules
commands
https://github.com/mdn/webextensions-examples/tree/master/commands
Press Ctrl+Shift+Y to send an event (Command+Shift+Y on a Mac).
Manifest keys
JavaScript modules
cookie-bg-picker
https://github.com/mdn/webextensions-examples/tree/master/cookie-bg-picker
Allows the user to customize the background color and tiled pattern on sites the visit, and also saves their preferences via a cookie, reapplying them whenever they revisit a site they previously customized.
Manifest keys
JavaScript modules
context-menu-demo
https://github.com/mdn/webextensions-examples/tree/master/context-menu-demo
Demonstrates various features of the contextMenus API.
Manifest keys
JavaScript modules
favourite-colour
https://github.com/mdn/webextensions-examples/tree/master/favourite-colour
An example options ui
Manifest keys
JavaScript modules
history-deleter
https://github.com/mdn/webextensions-examples/tree/master/history-deleter
History API demo: deletes history items for a given domain
Manifest keys
JavaScript modules
inpage-toolbar-ui
https://github.com/mdn/webextensions-examples/tree/master/inpage-toolbar-ui
Adds a browser action icon to the toolbar. Click the button to inject an in-page toolbar UI into the current webpage.
Manifest keys
JavaScript modules
latest-download
https://github.com/mdn/webextensions-examples/tree/master/latest-download
Shows the last downloaded item, and lets you open or delete it.
Manifest keys
JavaScript modules
notify-link-clicks-i18n
https://github.com/mdn/webextensions-examples/tree/master/notify-link-clicks-i18n
Shows a notification when the user clicks on links.
Manifest keys
JavaScript modules
open-my-page-button
https://github.com/mdn/webextensions-examples/tree/master/open-my-page-button
Adds browser action icon to toolbar to open packaged web page.
Manifest keys
JavaScript modules
page-to-extension-messaging
https://github.com/mdn/webextensions-examples/tree/master/page-to-extension-messaging
Visit https://mdn.github.io/webextensions-examples/content-script-page-script-messaging.html for the demo.
Manifest keys
quicknote
https://github.com/mdn/webextensions-examples/tree/master/quicknote
Allows the user to make quick notes by clicking a button and entering text into the resulting popup. The notes are saved in storage.
Manifest keys
JavaScript modules
tabs-tabs-tabs
https://github.com/mdn/webextensions-examples/tree/master/tabs-tabs-tabs
A list of methods you can perform on a tab.
Manifest keys
JavaScript modules
user-agent-rewriter
https://github.com/mdn/webextensions-examples/tree/master/user-agent-rewriter
Adds browser action icon to toolbar to choose user agent string from popup menu.