ignVinayak
ignVinayak

Reputation: 50

Pass element in emit.port for Firefox Extension

I need to pass the element from a function to another function, but only after the web service(AJAX) call is completed.

content script(popup.js):

function runThis(){
 var elem = $(".mainelem");
 var objDetails = {
  element : elem
 }
 self.port.emit("runCall", objDetails);
 self.port.on("callComplete", function(response){
  $(response.element).text("New text entered.");
 });
}

main js(main.js):

main_panel.port.on("runCall", function(obj){
  main_panel.port.emit("callComplete", obj);
});

html file(popup.html):

<div class="mainelem"></div>

But it does not append the text. Also, if try to put console in the function for port.on("callComplete"), it consoles a value like:

{"0":{"query111107803796615637436":15},"context" :{ "query111107803796615637436":15},"length":1}

Can someone help me out on how can I pass the element ? Or if I am trying to get the element in a wrong way?

Upvotes: 1

Views: 49

Answers (1)

CoolCmd
CoolCmd

Reputation: 1046

You cannot emit DOM objects. You can emit only serializeable values.

function runThis(){
 var elem = document.querySelector(".mainelem");
 var objDetails = {
  element : elem.textContent; // Emit string, for example.
 }
 self.port.emit("runCall", objDetails);
 self.port.on("callComplete", function(response){
  elem.textContent = "New text entered.";
 });
}

Upvotes: 1

Related Questions