1316441 - "browser is not defined" on reloading add-on

Status: RESOLVED WORKSFORME

(WebExtensions :: General, defect, P2)

Description

[Will Bamberg [:wbamberg]]

Attachment: test-options.zip

I've attached the example add-on from the "implement a settings page" example: https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Implement_a_settings_page .

STR:
* open "about:debugging"
* click "Load Temporary Add-on", and select the add-on
* open "about:addons"
* click the "Preferences" button to open the options page
* back in "about:debugging", click "Reload"

-> ReferenceError: browser is not defined...........options.js:17:7

Comment 1

[Will Bamberg [:wbamberg]]

Firefox 51.0a2

Comment 2

[Kris Maglione [:kmag]]

I think the problem is that we create the options browser before the extension has fully initialized...

It's really probably time for us to figure out a way to tell the AddonManager when an extension has finished initializing...

Comment 3

[Kestrel]

I noticed this only happens with temporarily loaded extensions.

1. Install the above example extension as a permanently loaded extension. 
2. Open its options page. 
3. Disable it and then enable it.

Result: No error.

Comment 5

[Tom Brückner]

I'm getting this error even when I don't reload the temporary loaded extension (FF 53). In effect, there's no way to test options pages in add-on debugging mode. The sample provided in the webextension-samples github repository ("favorite color") fails.

Comment 6

[Andy McKay]

Luca I think you've been looking at this recently?

Comment 7

[Luca Greco [:rpl] [:luca] [:lgreco]]

Yes, I'm looking into Bug 1409697 which seems very likely to be related to this issue.
(also, as described in Bug 1409697 Comment 5, while investigating Bug 1409697 I noticed that for every addon reload, the related onExternalInstall event received by the "about:addons" extensions.js script is processed twice and so _updateView is executed twice).

it is also worth to mention that I've not been able to reproduce the same error from Comment 0 on a recent mozilla-central tip.

Besides that, while looking into the attached test extension, I just noticed that there is an additional issue which should be fixed in the options.html/options.js files which are part of the extension:

the "Save" button is a "submit" button inside a "form", and so the options page is going to be reloaded when the save button is pressed, and the "browser.storage.local.set" API call will raise an error when trying to resolve the returned promise in a context that doesn't exist anymore (because the page have been reloaded in the meantime, by the default behavior of the "submit" button):

- options.html

      <form>
        <label>Border color<input type="text" id="color" ></label>
        <button type="submit">Save</button>
      </form>

- options.js

      function saveOptions(e) {
        browser.storage.local.set({
          color: document.querySelector("#color").value
        });
      }

To prevent the "Save" button to reload the options page, the saveOptions handler should call "e.preventDefault()":

      function saveOptions(e) {
        e.preventDefault();

        browser.storage.local.set({
          color: document.querySelector("#color").value
        });
      }

Finally, while trying to reproduce this issue, I also noticed, and filed as Bug 1419063, an issue related to the sources from a options page being missing from the Addon Debugging's Debugger panel when the extension is running in non-oop mode (while they are detected and listed as expected in the Debugger panel when the extension is running in oop mode).

Comment 8

[Shane Caraveo (:mixedpuppy)]

I do not see the original reported problem here, and there is a followup bug for another problem discovered with this.  closing.