0

I am writing a Chrome extension for which I need to read the selected text from the webpage. Here are the relevant pieces of my code:

manifest.json:

{
"name": "XXX",
"version": "1.0",
"manifest_version": 2,
"description": "XXX",
"icons": {
"128": "images/icon.png"
},
"browser_action": {
  "default_icon": "images/icon.png",
  "default_popup": "popup.html"
},
"permissions": [
  "activeTab",
  "tabs"
],
"content_scripts": [{
  "matches": ["<all_urls>"],
  "js": [ "content_script.js" ],
  "run_at": "document_start",
  "all_frames": true
}],

}

content_script.js:

chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
    if (request.method == "getSelection") {
        var sel = window.getSelection();
        var selectedText = sel.toString();
        console.log("getSelection requested, sending \""+selectedText+"\"")
        sendResponse({data: selectedText})
    }
});

popup.html

<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <script type="text/javascript" src="popup.js"></script>
  </head>
  <body>
  </body>
</html>

popup.js:

  chrome.tabs.query( {active:true, windowId: chrome.windows.WINDOW_ID_CURRENT}, 
    function(tabs) {
      chrome.tabs.sendMessage(tabs[0].id, {method: "getSelection"}, 
        function(response){
          console.log("getSelection method returned - " + response.data)
        });
    });

This works perfectly on simple pages like Wikipedia; however it does not work on pages with lot of dynamic content like say cnn.com

The console log below shows messages generated on one click of extension. They seem to indicate that message is sent to multiple elements in the page or its received multiple times (though in popup.js its only sent once). Some return " whereas some return the correct selection.

getSelection requested, sending ""      selection.js:26 
getSelection requested, sending ""      selection.js:26 
getSelection requested, sending ""      selection.js:26 
getSelection requested, sending ""      selection.js:26 
getSelection requested, sending ""      selection.js:26 
getSelection requested, sending ""      selection.js:26 
getSelection requested, sending "Trump" selection.js:26 
getSelection requested, sending ""      selection.js:26

I am trying to figure out:

  • What's going on here?
  • What's the right way to get selected text?
user1200373
  • 181
  • 6
  • 1
    Sounds like your content script is injected into all iframes of the page so simply skip the empty responses in your popup script. – wOxxOm Jul 03 '17 at 20:36
  • Ah! I should have thought of this. It solves my problem.Still I could not understand if the message is broadcasted to all the iframes, each one should call the callback. However the extension console logs seem to indicate the callback is called only once. – user1200373 Jul 03 '17 at 21:05
  • 1
    Please [edit] the question to be on-topic: include a [mcve] that duplicates the problem. For Chrome extensions or Firefox WebExtensions this almost always means including your *manifest.json* and some of the background, content, and/or popup scripts/HTML. Questions seeking debugging help ("why isn't this code working the way I want?") must include: (1) the desired behavior, (2) a specific problem or error and (3) the shortest code necessary to reproduce it *in the question itself*. Please also see: [What topics can I ask about here?](http://stackoverflow.com/help/on-topic), and [ask]. – Makyen Jul 03 '17 at 21:18
  • 1
    Related: [Get the Highlighted/Selected text](https://stackoverflow.com/a/5379408) – Makyen Jul 03 '17 at 21:24

0 Answers0