0

I am trying chrome plugin creation Message Passing. My code is as follows:

manifest.json:

{
    "name": "Sending Messages Test",
    "version": "1.0",
    "manifest_version": 2,
    "description": "Send a Message to background.js from contentscript.js and send reply",
    "background": {
        "scripts": ["background.js"],
        "persistent": false
    },
    "browser_action": {
        "default_title": "That's the tool tip",
        "default_popup": "popup.html"
    },
    // "permissions": ["tabs"],
    "content_scripts": [{
        "matches": ["http://*/*", "https://*/*"],
        "js": ["contentscript.js"]
    }]
}

popup.html:

<script type="text/javascript" src="popup.js"></script>
<div style="width:200px">
    <button id="button">Color all the divs</button>
</div>

popup.js:

window.onload = function() {
  document.getElementById("button").onclick = function() {
    // alert("in popup.js");
    chrome.extension.sendMessage({
      message: "coming from popup"
    });
  }
}

contentscript.js

chrome.runtime.onMessage.addListener( function(request, sender) {
    alert("Contentscript has received a message from from background script: '" + request.message + "'");
    return true;
});

background.js:

var backgroundScriptMessage = " purple monkey dishwasher";

chrome.extension.onMessage.addListener(function(request, sender) {
    alert("Background script has received a message from contentscript:'" + request.message + "'");
    returnMessage(request.message);
});

function returnMessage(messageToReturn) {
    chrome.tabs.query({active: true}, function(tabs) {
      var joinedMessage = messageToReturn + backgroundScriptMessage;
      alert("Background script is sending a message to contentscript:'" + joinedMessage +"'");
      chrome.tabs.sendMessage(tabs[0].id, {greeting: "hello"});
    });
}

When I unpack the plugin in chrome extensions, and click on the generated icon, I see 2 alerts

  1. Background script has received a message from contentscript:'coming from popup'
  2. Background script has received a message from contentscript:'coming from popup' purple monkey dishwasher

and the third popup which is present in the contentscript is never shown. I tried searching for the error but no luck. Does anybody has a solution?

abraham
  • 41,605
  • 9
  • 84
  • 134

1 Answers1

0

When querying current active tab, don't forget to add currentWindow: true

function returnMessage(messageToReturn) {
    chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
      var joinedMessage = messageToReturn + backgroundScriptMessage;
          alert("Background script is sending a message to contentscript:'" + joinedMessage +"'");
      chrome.tabs.sendMessage(tabs[0].id, {greeting: "hello"});
    });
}

And please use runtime.onMessage instead of extension.onMessage.

BTW, you can also use sender.tab.id to get sender tab id in runtime.onMessage listener, then you will not need to query tabs state.

Haibara Ai
  • 9,915
  • 2
  • 23
  • 44
  • He might not know to which tab the needs to send the message to – rafaelcpalmeida Apr 07 '16 at 10:48
  • @gautamscoders, update, the root cause should be you forget `currentWindow` property when querying current tab. – Haibara Ai Apr 07 '16 at 11:09
  • I inserted `currentWindow: true` still it is not working and yes i have used `chrome.runtime` in contentscript.js. – gautam scoders Apr 07 '16 at 11:18
  • @gautamscoders, how come? Make sure your content script in running on the current active page – Haibara Ai Apr 07 '16 at 11:23
  • okay @HaibaraAi here is what i have observed. When i unpack the plugin, switch to a tab and run the plugin, contentscript alert is not shown. Whereas before running plugin & after switching to a tab, if i refresh the tab and than run the plugin, It works perfectly fine. – gautam scoders Apr 07 '16 at 11:41
  • @gautamscoders, that is definitely by design. If you run the extension after the page has been loaded, then by default your content script isn't loaded in that page, which means you can't receive anything in that page. You should refresh that page to force the content script to load, or you can query all tabs then call `tabs.executeScript` to explicitly insert content scripts. – Haibara Ai Apr 08 '16 at 01:02