Inspect Firefox WebExtensions storage.local

Question

WebExtensions can store data locally in their storage.local. Apparently it is a key-value store and the values can be primitive types (such as numbers, booleans, and strings) or Array types.

I want to inspect what a particular WebExtension (not made by me) is storing in this area.

How can this be done?

Bonus for methods that can be automated, allowing me to extract the data from a bash script. But GUI solutions are very acceptable too.

Answer 1

In Firefox

• enter about:debugging into the navigation bar and hit enter
• check Enable add-on debugging at the very top of that page
• below that you can see a list of all installed extensions. Find the one you want to inspect and click its debug link.
• An Incoming Connection prompt will show. Click OK to allow it.
• In the new pop up switch to the Console tab
• Here you can execute code in the context of the extension

• Paste the following code to get the storage.local content:

  chrome.storage.local.get(null, function(items) {
      console.log(items);
  });
  

Edit:

If you want to download the object you could stringify it, create a blob from it and then create a data URL from the blob and open it in a new tab or download it. Like this:

chrome.storage.local.get(null, function(items) {
    var blob = new Blob([JSON.stringify(items, null,'  ')], {type: "text/plain"});
    var url = URL.createObjectURL(blob);
    chrome.tabs.create({ url: url }); // requires that the extension has the "tabs" permission
    //chrome.downloads.download({ url: url }); // requires that the extension has the "downloads" permission
});

The target extension needs to have the "tabs" permission to open a tab or the "downloads" permission to start a download. You could also look for other ways of accessing the data. For instance through a "browserAction"/"pageAction"-popup or by sending an ajax call to an external server submitting the data in the post body...