ReferenceError: browser is not defined

huchenhai commented 7 years ago

Please advise

wbamberg commented 7 years ago

You'll need to give me more information than this, like an actual complete add-on that is giving you this error, and steps to reproduce.

lidel commented 7 years ago

@huchenhai If you got the error while running one of examples, make sure you are using the latest Firefox (version 52.x). If problem occurred while running test suite with sinon-chrome, try stubbing with var browser = browser || chrome or by using https://github.com/mozilla/webextension-polyfill

SerkanSipahi commented 6 years ago

@wbamberg i have tried some of the 'webextensions-examples' on chrome v61 but i get an error browser is not defined! what im doing wrong? is the global 'browser' not available on chrome? should i use webextension-polyfill? i thought that 'webextensions' api by w3c and chrome, opera, etc have already implemented that....

makyen commented 6 years ago

@SerkanSipahi That browser is not defined is expected in Chrome. Chrome implements the APIs using the chrome.* namespace with callbacks. Firefox implements the namespace browser.* with Promises for all APIs, and chrome.* (with callbacks) for almost all APIs (all that are cross compatible with Chrome). If you want cross compatibility with Chrome, then you should do either:

Use the chrome.* namespace and callbacks. These will just work in Chrome and Firefox. Compatibility with Edge is also easier, because Edge implements the browser.* namespace, but uses callbacks, not Promises.
Use a shim/polyfill which converts calls to the browser.* namespace with Promises to chrome.* with callbacks for Chrome. One such shim is: webextension-polyfill. Note that any pollyfill/shim you use will come with it's own set of issues.

SerkanSipahi commented 6 years ago

@makyen thank you, you help me a lot :)

wbamberg commented 6 years ago

SerkanSipahi commented 6 years ago

@wbamberg I have found some more resources => https://github.com/mdn/browser-compat-data and https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Browser_support_for_JavaScript_APIs ;)

ghost commented 5 years ago

https://github.com/mdn/webextensions-examples/issues/194#issuecomment-338422836 is correct, however, now days, newer Firefox versions will always have both chrome and browser available. Older versions that supports web-extension (versions 42 to 53) won't, since the support was introduces gradually, for this case there is a small line to include on the top of the JS file(s) you're using:

/* ╔══════════════════════════════╗
   ║ (background script title)    ║
   ╟──────────────────────────────╢
   ║ (description)                ║
   ╚══════════════════════════════╝
░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░ */
"use strict";
var API = chrome || browser;

then use API instead of chrome or browser to play nice with both browsers, or include Mozilla's https://github.com/mozilla/webextension-polyfill that will wrap everything nicely in a cross-browser compatible promise-structure.

mdn / webextensions-examples

ReferenceError: browser is not defined #194