Skip to content

ReferenceError: browser is not defined #194

Closed
@huchenhai

Description

@huchenhai

Please advise

Activity

wbamberg

wbamberg commented on Mar 13, 2017

@wbamberg

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

lidel commented on Mar 14, 2017

@lidel

@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

SerkanSipahi commented on Oct 21, 2017

@SerkanSipahi

@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

makyen commented on Oct 21, 2017

@makyen
Contributor

@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:

  1. 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.
  2. 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

SerkanSipahi commented on Oct 21, 2017

@SerkanSipahi

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

ghost

ghost commented on Apr 9, 2019

@ghost

#194 (comment) 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.

added a commit that references this issue on May 6, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @lidel@wbamberg@SerkanSipahi@makyen@huchenhai

        Issue actions

          ReferenceError: browser is not defined · Issue #194 · mdn/webextensions-examples