Home/ Questions/Q 7875661
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-03T03:01:22+00:00

I have an extension, with a background script: background: { scripts: [scripts/background.js] }, and

  • 0

I have an extension, with a background script:

"background": {
    "scripts": ["scripts/background.js"]
  },

and a content script:

"content_scripts": [
    {
      "matches": ["*://*/*"],
      "js": ["scripts/content_script.js"]
    }
  ],

a popup window (popup.html), and a popup script (popup.js). popup.js is not registrated into manifest,and it deals with popup.html look, and listen for user actions made in popup.html, such as clicking a button.

I want to make an extension, what emails the current tab’s page, and for this, I need to get the page DOM with the content_script, pass data (DOM) to the background script. After this, when the user triggers an event in popup.html, popup.js catches this event, and I want popup.js to be able to get the passed data(DOM) from background.js. How could I make this? So, my question is, how could I communicate between background.js and popup.js?

I found an answer to my own question:

Thanks Elvis, I think I solved the problem; I only need to get the DOM of site in content script, but my question’s solution was this:

content_script.js

 // SEND DOM structure to the background page
    chrome.extension.sendRequest({dom: "page DOM here"});

background.html

<html>
<head>
<script>
chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
    if(request.dom != "")
        var theDOM = request.dom;
        console.log(request.dom); // page DOM here -> works
        chrome.extension.sendRequest({theDOM: theDOM}); // theDOM : "page DOM here"
});
</script>
</head>
<body>
</body>
</html>

popup.js

var dom;
chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
    if(request.theDOM != ""){
        console.log("popup request: "+request.theDOM);
        dom = request.theDOM;
    }
});

// HANDLE TAB_1 REQUESTS (EMAIL PAGE)
// ---------------------------------
$("#send").click(function(){
    console.log(dom); // page DOM here
}

Thanks for the help 😉

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You can do Message Passing. From the documentation:

    Use this in your content script:

    chrome.extension.sendRequest({greeting: "hello"}, function(response) {
  console.log(response.farewell);
});

    It sends {greeting: "hello"} to the background. Notice the callback specified

    The background page can listen to these requests using:

    chrome.extension.onRequest.addListener(
  function(request, sender, sendResponse) {
    if (request.greeting == "hello")
      sendResponse({farewell: "goodbye"});
  });

    The arguments to the sendResponse function will be passed to the callback

    • 0