0

In my Chrome Extension, I want the following steps to execute:

  1. Upon clicking the extension icon which triggers a popup, a message is sent using chrome.runtime.sendMessage.
  2. The message is received by a listener in the background script using chrome.runtime.onMessage.addListener. This triggers a message to be logged to the console

NOTE: If I add a console.log command in the background.js script outside of the listener, I DO see the message logged in the dev tools.

However, my console.log message inside the listener is not logged, which leads me to believe the message is not being received.

Am I missing something in my scripts?

Code:

manifest.json

{
    "name": "xxx",
    "version": "1.0.0",
    "description": "xxx",
    "manifest_version": 3,
    "author": "xxx",
    "action":{
        "default_title": "xxx",
        "default_popup": "index.html"
    },
    "permissions": [
        "activeTab",
        "scripting"
    ],
    "background": {
        "service_worker": "background.js"
    }
}

background.js

chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
  console.log("listener");
});

script.js

chrome.runtime.sendMessage({message: "xxx"}, function(response) {
  console.log(response)
});

Melissa Guo
  • 948
  • 9
  • 32
  • Please post the contents of `index.html`, I suspect that's where the problem is. – Thomas Mueller Sep 30 '22 at 12:40
  • Sounds like you load background.js in your html, which is a mistake because it should be loaded only in manifest.json. The background script has [its own devtools console](/a/10258029). Note that the popup is a separate window so it has its own separate devtools: right-click inside the popup and select "inspect" in the menu. – wOxxOm Sep 30 '22 at 18:57

0 Answers0