Firefox Add-On window.addEventListener error: window not defined

Question

i'm trying to follow this tutorial for creating a firefox addon that intercept when the url in the address bar change:

https://developer.mozilla.org/en-US/Add-ons/Code_snippets/Progress_Listeners#Example:_Notification_when_the_value_in_Address_Bar_changes

I just copied the code, and just added an alert to see if it works, but i can't have it run in any way.

My code is:

const {Cu} = require("chrome");
Cu.import("resource://gre/modules/XPCOMUtils.jsm", this);

var urlListener = {
    oldURL: null,

    init: function() {
        gBrowser.addProgressListener(this);
    },

    uninit: function() {
        gBrowser.removeProgressListener(this);
    },

    processNewURL: function(aURI) {
        if (aURI.spec == this.oldURL) return;

        // now we know the url is new...
        alert(aURI.spec);
        this.oldURL = aURI.spec;
    },

    // nsIWebProgressListener
    QueryInterface: XPCOMUtils.generateQI(["nsIWebProgressListener",
                                           "nsISupportsWeakReference"]),

    onLocationChange: function(aProgress, aRequest, aURI) {
    alert("Called");
        this.processNewURL(aURI);
    },

    onStateChange: function() {},
    onProgressChange: function() {},
    onStatusChange: function() {},
    onSecurityChange: function() {}
};

  window.addEventListener("load", function() { urlListener.init() }, false);
  window.addEventListener("unload", function() { urlListener.uninit() }, false);

Whenever i try to start/test this extension i receive the following error:

Running tests on Firefox 24.3.0/Gecko 24.3.0 ({ec8030f7-c20a-464f-9b0e-13a3a9e97384}) under linux/x86-gcc3.
Error: ReferenceError: window is not defined 
 Traceback (most recent call last):
  File "resource://jid1-u33krawc1uacsa-at-jetpack/amazon_rewriter/tests/test-main.js", line 1, in 
    var main = require("./main");
  File "resource://gre/modules/commonjs/sdk/loader/cuddlefish.js", line 133, in CuddlefishLoader/options<.load
    result = load(loader, module);
  File "resource://jid1-u33krawc1uacsa-at-jetpack/amazon_rewriter/lib/main.js", line 38, in 
    window.addEventListener("load", function() { urlListener.init() }, false);
0 of 1 tests passed.

Probably it's me that i don't understand something from the tutorial/extension creation process.

Can you help me to understand what is missing?

EDIT After kapep answer, i resolved the window not defined error. But it seems that nothing happen when i change the url in the address bar. Any idea?

Answer 1

There are no global window or gBrowser objects, you need to get the browser and choose which window (nsIDOMWindow) you want to add the listener. This part seems to be missing or out of scope in the tutorial.

var gBrowser = windowUtils.getMostRecentBrowserWindow().getBrowser();

There are probably multiple ways to get a window. I would do this is using the low-level windowUtils API. You could get the most recent one like above with getMostRecentBrowserWindow or more reliable get all currently opened windows with windowUtils.windows() like this:

const windowUtils = require("sdk/window/utils");

for each (let window in windowUtils.windows()) {
    urlListener.init();
    window.addEventListener("unload", function() { urlListener.uninit(); }, false);
}

Just in case you also want to add the listener to all windows opened in the future, you can add them when a new window opens:

const windows = require("sdk/windows");
windows.browserWindows.on("open", domWindow => {
    urlListener.init();
    windowUtils.getMostRecentBrowserWindow().addEventListener("unload", function() { urlListener.uninit(); }, false);
});