CODEWITHSUNDEEP
javascriptgoogle-chrome-extension
Siniša Knežević
Siniša Knežević

Reputation: 11

Chrome Extensions: More than one page created

I'm still learning coding in javascript and I'm not familiar with Chrome extensions as well. I try to develope one extension that would transfer selected text or image to another web page. Everything works fine for sending image, and for text also. But, with text are occured issues when I use the extension more than once. If I use it 3 time,for example, it opens three times the same tab with web page where the information are sent. I thing the issue could be with content script which is injected every time when is clicked. But I am not sure for that, and don't know solution.

Here is background file:

function getClickHandler() {
   function getPageDetails(callback) {
    // Inject the content script into the current page
    chrome.tabs.executeScript(null, { file: 'content.js' });
    // Perform the callback when a message is received from the content script
    chrome.runtime.onMessage.addListener(function(message)  {
        // Call the callback function
        callback(message);
    });
};
function onPageDetailsReceived(details) {
      transfer1= details.summary;
       transfer2= details.url;
       transfer3= details.title;
     page = " http://www.example.com/testing.php?trans1=" + transfer1+"&trans2="+transfer2+"&trans3="+transfer3;
      chrome.tabs.create({"url": page});


}
  return function(info, tab) {

    // The srcUrl property is only available for image elements.
    var url = info.srcUrl;
    if (url == null)
    {
    getPageDetails(onPageDetailsReceived);

    }
    else
    {
        page = " http://www.example.com/testing.php?trans4=" + url;
      chrome.tabs.create({"url": page});
      }
  };
};


chrome.contextMenus.create({
 title : "testing",
  type : "normal",
  contexts : ["image","selection"],
   onclick: getClickHandler()
  });

And here is content.js:

chrome.runtime.sendMessage({
    'title': document.title,
    'url': window.location.href,
    'summary': window.getSelection().toString(),
         });

Thanks for help and advices!

Upvotes: 1

Views: 82

Answers (1)

Xan
Xan

Reputation: 77521

Every time that chrome.runtime.onMessage.addListener is called, it adds another listener, all of which keep firing on every message.

If your intention is to only invoke a particular handler once, you need some self-deregistering logic by calling removeListener with a reference to the handler.

If you only ever need one handler that doesn't change (which seems to be your case), you need to take care to call addListener only once.

From the look of your current code, you can take chrome.runtime.onMessage.addListener on the top level:

chrome.runtime.onMessage.addListener(function(message)  {
    onPageDetailsReceived(message);
});

and then remove it from getPageDetails. I understand the intention to make callback configurable, but you don't need it here, or at least you need to make sure the listener is only registered once.

Upvotes: 1

Related Questions