Making chrome extension and chrome.runtime.onMessage isn't receiving the message

Question

Here is the code in my event page:

chrome.runtime.onInstalled.addListener(function (){
    chrome.contextMenus.create
        ({
            "title": "Test",
            "contexts": ["all"],
            "id": "menu"
        });
    chrome.contextMenus.create
        ({
            "title": "Dummy",
            "contexts": ["all"],
            "id": "dummy",
            "parentId": "menu"
        });
});

chrome.contextMenus.onClicked.addListener(onClickHandler);

function onClickHandler (info, tab) {
    if(info.menuItemId == "dummy"){
        chrome.tabs.sendMessage(tab.id, {greeting: "hello"}, function(response) {
            console.log(response.farewell);
        });  
    }
}

And here is the code in my content script straight from the chrome message passing documentation:

chrome.runtime.onMessage.addListener(
  function(request, sender, sendResponse) {
    console.log(sender.tab ?
                "from a content script:" + sender.tab.url :
                "from the extension");
    if (request.greeting == "hello")
      sendResponse({farewell: "goodbye"});
  });

The onClickHandler in the event page is being triggered, but it seems like the sendMessage method isn't working. The onMessage listener isn't receiving any information, so it doesn't log anything to the console or even send a response. This causes the original sendMessage callback to throw an exception because response.farewell isn't even defined. Does anybody know why the code doesn't seem to work.

The error:

Error in event handler for (unknown): TypeError: Cannot read property 'farewell' of undefined

Probably duplicate with this one: http://stackoverflow.com/questions/26296181/simple-message-passing-between-background-js-to-contentscript-js — Dayton Wang, Feb 19 '15 at 22:10
@gui47 Not a duplicate because I already used tabs.sendMessage instead of runtime.sendMessage which is the mistake they made. — m0meni, Feb 19 '15 at 22:21

P Fuster · Answer 1 · 2019-06-06T09:07:01.893

For anybody else having problems, my issue was trying to send a message to a content script with the chrome.runtime API.

In order to send messages to a content script you have to use the chrome.tabs instead like this: chrome.tabs.sendMessage(tabId, message, options, response):

Sending a request from the extension to a content script looks very similar, except that you need to specify which tab to send it to.

Sends a single message to the content script(s) in the specified tab, with an optional callback to run when a response is sent back.

API docs: https://developer.chrome.com/extensions/tabs#method-sendMessage

score 2 · Accepted Answer · edited May 23 '17 at 12:14

2

Turns out there wasn't a problem with the code in the content script or the event page.

This thread: Chrome extension Content Script not loaded until page is refreshed

Helped me realize that the content script wasn't running because of the site I was testing it on, and because it wasn't running it obviously couldn't listen for any events.

edited May 23 '17 at 12:14

Community

1
1

answered Feb 19 '15 at 22:20

m0meni

16,006
16
82
141

1

This is also a good read on the topic: http://stackoverflow.com/a/23895822/934239 – Xan Feb 19 '15 at 23:30
Thanks for linking me, but I already saw it and upvoted it haha. – m0meni Feb 19 '15 at 23:31

score 0 · Answer 3 · answered Sep 25 '21 at 17:32

I was facing an issue in which my working code of sending messages stopped working.

I realized that the issue was with the tabid. There were multiple windows of the browser opened and I was missing the activeWindow attribute to fetch the active tabs.

The following code snippet worked for me.

const fetchTabs = () => {
 return new Promise((resolve, reject) => {
  chrome.tabs.query({ active: true, currentWindow: true }, resolve);
 });
};

Notice the activeWindow attribute.

Making chrome extension and chrome.runtime.onMessage isn't receiving the message

3 Answers3