Firefox附加组件：从选项卡获取文档

Question

I was just trying to get the document of a tab and read information from it, but if I try to read the information on the Add-on-side I get an error "doc.getElementById is not a function". In the content-script it works fine. So is there a problem with passing whole objects through self.port?

var tabs = require('sdk/tabs');
var myTab;
var myScript = "self.port.on('getDocument', function() {" +
               "  var doc = window.document;" +
               "  console.log(doc.getElementById('lga').style.height);" +
               "  self.port.emit('answer', doc);" +
               "})";

for each (var tab in tabs) {
    if (tab.url == "https://www.google.com/") {
        myTab = tab;
    }
}

worker = myTab.attach({
    contentScript: myScript 
});

worker.port.emit("getDocument");

worker.port.on("answer", function(doc) {
  console.log(doc.getElementById('lga').style.height);
});

Answer 1

You can only pass values via a message that could be serialized to JSON. doc , being a document, cannot be passed.

In your message, you could pass the actual value of the style instead:

self.port.emit('answer', doc.getElementById('lga').style.height);

Answer 2

Rather than try to import the document into main.js , create a new Javascript file in the data folder, ContentScript.js . Inject it with contentScriptFile into the page like so:

worker = myTab.attach({
    contentScriptFile: require('sdk/self').data.url('ContentScript.js')
});

Meanwhile, in ContentScript.js

var doc = window.document;
//Now have your way with the document

Then if you ever need any variables in main.js, do what @nmaier said.

I realize that this may be obvious, but this is the intended behaviour, and it means you don't have to write a script as a string and provides more detailed logging.