CODEWITHSUNDEEP
javascriptgoogle-chromegoogle-chrome-extension
Aero
Aero

Reputation: 127

Sending requests from Popup.html to Listener.js

I have the following:

popup.html:

        <!DOCTYPE html> 
    <html>
    <head>
    <style>
      body { width: 700px; }
      textarea { width: 250px; height: 100px;}
    </style>
    <script>
        function sendMessage(){
            chrome.tabs.getSelected(null, function(tab) {
                chrome.tabs.sendRequest(tab.id, {method: "fromPopup", tabid: tab.id});});
    }
    </script>
    </head>
    <body>
    <button onclick="sendMessage(); ">Test</button>
    </body>
    </html>

manifest.json:

        {
    "manifest_version": 2,
    "name": "ROBLOX Hub",
    "version": "1.1",
    "description": "A compilation of scripts to interact with the ROBLOX site.",
    "browser_action": {
        "default_icon": "icon.png",
        "default_popup": "popup.html"
    },
    "permissions": [
        "tabs",
        "<all_urls>"
     ],
    "content_scripts": [
    {
        "matches": ["<all_urls>"],
        "js": [ "jquery.min.js", "listener.js"],
        "run_at": "document_start",
        "all_frames": true
      }]
    }

listener.js:

chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
if (request.method == "fromPopup") {
alert("I DID IT MOM")
});

However, when I hit "test" it doesn't seem to alert("I DID IT MOM"). Am I doing this correctly? I am guessing not as my script is not working. Basically it's supposed to send a message to the content script, "listener.js". Listener.js is running on all pages (as seen in manifest) and popup.html should be able to send the request to it, triggering the alert of "I DID IT MOM". What is wrong with my script? Thanks for your help in advance.

Upvotes: 0

Views: 354

Answers (1)

Dayton Wang
Dayton Wang

Reputation: 2352

Since CSP policy, inline Js is not allowed in Chrome extension. Instead of doing that, you should reference your js code in html like <script src="popup.js"></script>, modify your button tag: <button>Test</button> and put code below into your popup.js.

document.addEventListener('DOMContentLoaded', function () {
  document.querySelector('button').addEventListener('click', clickHandler);
  sendMessage();
});

Also keep in mind that chrome.tabs.sendRequest and chrome.extension.onRequest were deprecated and use chrome.runtime.sendMessage and chrome.runtime.onMessage instead.

Upvotes: 1

Related Questions