Chrome Extensions: More than one page created











up vote
0
down vote

favorite












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!










share|improve this question


























    up vote
    0
    down vote

    favorite












    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!










    share|improve this question
























      up vote
      0
      down vote

      favorite









      up vote
      0
      down vote

      favorite











      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!










      share|improve this question













      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!







      javascript google-chrome-extension






      share|improve this question













      share|improve this question











      share|improve this question




      share|improve this question










      asked Nov 19 at 13:07









      Siniša Knežević

      11




      11
























          1 Answer
          1






          active

          oldest

          votes

















          up vote
          0
          down vote













          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.






          share|improve this answer





















            Your Answer






            StackExchange.ifUsing("editor", function () {
            StackExchange.using("externalEditor", function () {
            StackExchange.using("snippets", function () {
            StackExchange.snippets.init();
            });
            });
            }, "code-snippets");

            StackExchange.ready(function() {
            var channelOptions = {
            tags: "".split(" "),
            id: "1"
            };
            initTagRenderer("".split(" "), "".split(" "), channelOptions);

            StackExchange.using("externalEditor", function() {
            // Have to fire editor after snippets, if snippets enabled
            if (StackExchange.settings.snippets.snippetsEnabled) {
            StackExchange.using("snippets", function() {
            createEditor();
            });
            }
            else {
            createEditor();
            }
            });

            function createEditor() {
            StackExchange.prepareEditor({
            heartbeatType: 'answer',
            convertImagesToLinks: true,
            noModals: true,
            showLowRepImageUploadWarning: true,
            reputationToPostImages: 10,
            bindNavPrevention: true,
            postfix: "",
            imageUploader: {
            brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
            contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
            allowUrls: true
            },
            onDemand: true,
            discardSelector: ".discard-answer"
            ,immediatelyShowMarkdownHelp:true
            });


            }
            });














            draft saved

            draft discarded


















            StackExchange.ready(
            function () {
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53375335%2fchrome-extensions-more-than-one-page-created%23new-answer', 'question_page');
            }
            );

            Post as a guest















            Required, but never shown

























            1 Answer
            1






            active

            oldest

            votes








            1 Answer
            1






            active

            oldest

            votes









            active

            oldest

            votes






            active

            oldest

            votes








            up vote
            0
            down vote













            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.






            share|improve this answer

























              up vote
              0
              down vote













              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.






              share|improve this answer























                up vote
                0
                down vote










                up vote
                0
                down vote









                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.






                share|improve this answer












                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.







                share|improve this answer












                share|improve this answer



                share|improve this answer










                answered Nov 19 at 13:28









                Xan

                53k10101128




                53k10101128






























                    draft saved

                    draft discarded




















































                    Thanks for contributing an answer to Stack Overflow!


                    • Please be sure to answer the question. Provide details and share your research!

                    But avoid



                    • Asking for help, clarification, or responding to other answers.

                    • Making statements based on opinion; back them up with references or personal experience.


                    To learn more, see our tips on writing great answers.





                    Some of your past answers have not been well-received, and you're in danger of being blocked from answering.


                    Please pay close attention to the following guidance:


                    • Please be sure to answer the question. Provide details and share your research!

                    But avoid



                    • Asking for help, clarification, or responding to other answers.

                    • Making statements based on opinion; back them up with references or personal experience.


                    To learn more, see our tips on writing great answers.




                    draft saved


                    draft discarded














                    StackExchange.ready(
                    function () {
                    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53375335%2fchrome-extensions-more-than-one-page-created%23new-answer', 'question_page');
                    }
                    );

                    Post as a guest















                    Required, but never shown





















































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown

































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown







                    Popular posts from this blog

                    "Incorrect syntax near the keyword 'ON'. (on update cascade, on delete cascade,)

                    Alcedinidae

                    Origin of the phrase “under your belt”?