pageMod doesn't seem to be working

Question

I'm currently making a Firefox extension, however I'm unable to get the function to run when I browse to a specific url.

In my chrome.manifest I have overlay chrome://browser/content/browser.xul chrome://boxcutter/content/overlay.xul and content/ in the actual filesystem is located at chrome/content/ (I used the extension generator).

So I assumed that I can then use a script tag in my overlay.xul to reference to my main.js file which contains my pageMod function.

My pageMod function is (I've probably stuffed something up here, and its why this isn't working):

(function() {
    var pageMod;
    pageMod = require('page-mod');

    new pageMod.PageMod({
        include: ["http://battlelog.battlefield.com/bf3/*"],
        contentScriptFile: data.url('boxcutter.js')
    });
}).call(this);

This should call my boxcutter.js file when the user goes to Battlelog, however nothing seems to happen. At one point I thought it was my JS that I had in boxcutter.js that wasn't working properly however upon adding alert('test'); and refreshing the page, nothing happened.

This lead me to believe that I had done something wrong with my overlay.xul file however I was able to call jQuery functions via Firebug on the Battlelog site (Which I know for a fact does not have the jQuery library, because I checked).

So I assume its something wrong with my pageMod script (above) that isn't working correctly or that I have done something wrong when I wrote the pageMod script.

Answer 1

page-mod is a module provided by the Firefox Add-on SDK - this is a framework for building extensions. If you don't use that framework (and given that you are talking about chrome manifest and overlays you apparently don't) then you obviously cannot use its features. If you want to stay with classic extensions then you probably want to add a handler for the DOMContentLoaded event in your overlay, check whether the page matches your criteria and do something with it then.