webextensions-examples/embedded-webextension-sdk

This is a very simple example of how to use a WebExtension embedded in a Legacy Add-on to be able to gradually port a legacy addon written as a Add-on SDK extension into a pure WebExtension and migrate the legacy addon data into the WebExtensions storage.local.

The simple example legacy addon provides:

• a button in the toolbar
• a content script
• some user data stored in the Firefox preferences using the simple-prefs SDK module (and keep in sync the data storage in the webextension with the preferences updated from the simple-prefs Add-on preferences UI)
• some user data stored using the simple-storage SDK moduel
• when the button is pressed, it shows a panel which renders the above data from the Firefox preferences

The transition example is composed of 3 steps:

• Step 0: original legacy addon, everything is written using the legacy Addon SDK implementation strategies
• Step 1: hybrid addon (an SDK legacy container addon with a simple webextension embedded into it), the legacy code provides access to the preferences and handle (with the background page) the transition of this data into the WebExtensions storage.local StorageArea, the webextension provides the UI and the new data storage, the Addon Preferences UI is still the one provided by the SDK simple-prefs module, kept in sync with the one storage in the WebExtension storage.local API
• Step 2: a pure WebExtensions addon is extracted from the Step 1 (once the old users have been already able to transition their data using the step 1 version), with the options rewritten into a WebExtensions option_ui page.