Firefox console ReferenceError: browser is not defined

Question

I am trying to learn WebExtension development for Firefox. I find the window debugging tools EXTREMELY useful as I can interactively evaluate javascript code in the window context.

For the Webextension APIs at the browser level, I have been totally unsuccessful when trying to similarly use the browser console. For example trying to use the tabs API

Click on menu->developer->browser console

In the console command line enter any expression beginning with browser and I get

"ReferenceError: browser not defined"

I have tried in chrome and got same error (read article about chrome.* vs browser.*)

For example trying to find all tabs:

var querying=browser.tabs.query(queryInfo)

or

chrome.tabs.query()

Returns browser or chrome as not defined

Please help

Answer 1

As described at [1] WebExtension APIs are present in pages contained inside a WebExtension. The browser console gives you access to the javascript environment used to implement the main browser user interface which is a very different environment.

To experiment with the WebExtensions APIs interactively, your best bet is probably to create a very simple WebExtension with an empty background page, then attach to it with the debugger [2]

[1] https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API

[2] https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Debugging