FireFox Add-on "document" not defined

Add-ons Development
#1

I am working on a add-on project for FireFox using SDK (JPM) and when I run the code in JPM I get “document is not defined”

My index.js file has the following which this error refers to:

var insecure = document.querySelectorAll(’[src^=“http://”],[href^=“http: //”],[img^=“http://”]’);

Any help would be great as I have tried so many things

Thanks

#2

The index.js script has no access to any document or any window object. index.js is the main add-on or background script. Its execution environment and context are very specific to the addon SDK.

Therefor, your piece of code should take place in a content script (which “share” the DOM of the Web pages you want to deal with). The SDK provide the module page-mod to load such scripts: https://developer.mozilla.org/en-US/Add-ons/SDK/High-Level_APIs/page-mod.

Also, see this documentation page to learn more about those two types of scripts: https://developer.mozilla.org/en-US/Add-ons/SDK/Guides/Two_Types_of_Scripts

N.B.: this separation does exist on Chromium add-ons as well. However, a Chromium background page is actually a virtual sort of Web page (with its own DOM). As a matter of fact, on such scripts, this is actually a window object; so you can pretty much access to every standard APIs you’ll find on any Web page. However, you’ll never access directly to the DOM of a Web page the user is browsing from a background script.

#3

Thanks for this. I am now looking at content scripts and the “worker” aspect, the “message system” between the scripts. I am having trouble with that though.

All I need to do now is pass this value “document.querySelectorAll(’[src^=“http://”],[href^=“http: //”],[img^=“http://”]’);” from the content script to the add-on script. Not quite got the hang of it yet.

#4

Unfortunately, you can’t pass a Javascript Object (a node List in your case) through the port API. Only JSON-serializable objects are valid.

See those pages for learning more about the port API:

Note that it might be easier to move most of your code to the content script. :wink:

#5

Thanks.It would be better to have the code on the content script but then I can’t use the different mods “require(“sdk/notifications”);” within the content script?

Sorry still learning :wink:

#6

It really depends of what you want to achieve. Try to design your code architecture with a strong separation of concerns (DDD can help https://en.wikipedia.org/wiki/Domain-driven_design). Eventually, each component of your application will communicate with simple commands or simple data structures.

For instance, you probably just need to pass a string to the background for showing up the notification, don’t you?

#7

Yes, so basically I am looking for any any HTTP within the page. So the add-on script will have an if condition which would then call the content script in order to search for mixed content. The content script would then pass this data back to the add-on for evaluation.

#8

i am trying to develop an addon for my visa application website. I am getting following error like There was an error during installation: Extension is invalid

#9

That seems like a different issue. Do you want to start a new thread?