3

I'm developing a Firefox extension which places a button in the status bar. When the button is clicked, the extension injects some Javascript into the current page. This Javascript has a function that I would like to invoke with some parameters. I've managed injecting the code, I've inspected the page through Firebug and verified that the JS has been injected. How can I call a Javascript function in the page from my extension?

--More information

Here's the code that I'm using to inject my Javascript:

var doc = window.content.document;

//Add the script
var visibilityJS = doc.createElement("script");
visibilityJS.setAttribute("type", "text/javascript");
visibilityJS.setAttribute("charset", "UTF-8");
visibilityJS.setAttribute("src", "chrome://visibility/content/scripts/visibility.js");
head.appendChild(visibilityJS);

//Call the function
alert("Executing testfunction");
window.content.document.defaultView.testFunction();

..and the code inside my JS file that i'm going to inject. i.e. visibility.js

window.testFunction = function() {
    alert("Message");
}

Thanks.

Mridang Agarwalla
  • 43,201
  • 71
  • 221
  • 382

2 Answers2

4

This worked. I don't know the technicalities. I got part of the solution from Felix and part of it from here.

window.content.document.defaultView.wrappedJSObject.testFunction();
Community
  • 1
  • 1
Mridang Agarwalla
  • 43,201
  • 71
  • 221
  • 382
2

If you declare a global variable in your injected code (or explicitly set a property of the window object), then one way do get a reference to this element from your extension, is via the gBrowser object:

gBrowser.contentDocument.defaultView.yourObject
          ^-- HTML document  ^
              object         |-- window object

Be careful though, when you use window and document inside your code. Depending on the context it might refer to the Firefox window or the website window object.

Felix Kling
  • 795,719
  • 175
  • 1,089
  • 1,143
  • Hi Felix. I couldn't quite figure out what you meant. I tried reading the documentation too i.e. the page that you pointed out, but i still couldn't quite get it. I tried `window.content.document.` but that didn't work. Would you happen to have a simple example or something? Thanks. – Mridang Agarwalla Nov 18 '10 at 20:38
  • @Mridang Agarwalla: You are close. `window.content.document` should give you the same as `gBrowser.contentDocument`. But this gives you the `document` object of the website. Global variables are always properties of the `window` object of the website. `document.defaultView` should give you that object. Try `window.content.document.defaultView.`. – Felix Kling Nov 18 '10 at 23:08
  • Hi again Felix. I still can't seem to access it. I get the following error — `window.content.document.defaultView.testFunction` is not a function. I tried invoking `testFunction` from the JavaScript console and it worked but the extension is still unable to access it. Do I add something or modify my injected Javascript code in any way? Thanks again. – Mridang Agarwalla Nov 19 '10 at 07:47
  • @Mridang Agarwalla: If you define the function with `function testFunction(){}` then it won't work. But if you define it with `window.testFunction = function() {}` then it should... – Felix Kling Nov 19 '10 at 09:44
  • Hi Felix. I've modified the function as you instructed. I'm able to invoke it through the Javascript console but I still get the same error as earlier when my extension tries to invoke it. I've edited my original question be more clear in how I'm going about this. Something amiss? – Mridang Agarwalla Nov 19 '10 at 10:36