2

I have been through the webextension documentation on MDN. I do know the Messaging Api used to communicate from content_script to background script. However, I want to communicate from popup script to background script.

My use case is:

How to communicate to background script from a script associated to popup.html page.

Let's say , manifest.json is

  {

   "description": "Demonstrating toolbar buttons",
   "manifest_version": 2,
   "name": "button-demo",
   "version": "1.0",
   "permissions" : ["activeTab","currentWindow"],//
   
   "background": {
        "scripts": ["background.js"]
    },

   "browser_action": {
   "browser_style": true,
   "default_popup": "popup.html",
   "default_icon": {
   "16": "icons/page-16.png",
   "32": "icons/page-32.png"
   }
 }
}

background.js

//background script is listening to 
browser.runtime.onMessage.addListener((sentMesssage) => 
{ 
    console.log('got the message: ',sentMessage.actualMessage);
});

popup.html is

   <html>
   <body>
     <script src = 'popup.js'></script>
   </body>
   <html>

popup.js

My question stands here. Which method to use from the below options:

 browser.runtime.sendMessage({"actualMessage":"some message"});

OR

var tabQ = browser.tabs.query({
   currentWindow: true,
   active: true
});

tabQ.then( (tabs)=>{
 browser.tabs.sentMessage(tab[0].id , {'actualMessage' : "some message"});
});
Irshad
  • 1,016
  • 11
  • 30
  • 2
    Possible duplicate of [Communicate between scripts in the background context (background script, browser action, page action, options page, etc.)](http://stackoverflow.com/questions/41420528/communicate-between-scripts-in-the-background-context-background-script-browse) – Makyen Mar 27 '17 at 06:30
  • Please [edit] the question to be on-topic: include a [mcve] that duplicates the problem. For Chrome extensions or Firefox WebExtensions this almost always means including your *manifest.json* and some of the background, content, and/or popup scripts/HTML. Questions seeking debugging help ("why isn't this code working the way I want?") must include: (1) the desired behavior, (2) a specific problem or error and (3) the shortest code necessary to reproduce it *in the question itself*. Please also see: [What topics can I ask about here?](http://stackoverflow.com/help/on-topic), and [ask]. – Makyen Mar 27 '17 at 06:30
  • Your question is too broad. You are covering multiple issues in one question, Stack Overflow is focused more on one issue per question. Your post has general questions, multiple debugging questions for which you did not provide a [mcve], and some more specific questions. Please focus your Question on one thing. – Makyen Mar 27 '17 at 06:33
  • @Makyen , I am sorry about the generic question provided before. I have however, provided the code example and a basic structure of the use case I wanted to ask. Could u please give your inputs. Thanks – Irshad Mar 27 '17 at 18:04
  • `tabs.sentMessage()` sends messages to content scripts, *not* scripts in the background context. It will not work to send a message from a popup to the background script. That is clearly stated in the proposed duplicate. Please read it. If you have questions after reading that answer, I'm happy to address them. – Makyen Mar 27 '17 at 18:12
  • @Makyen thankyou. I have been through the duplicate and everything started to make sense. Sorry for a delayed Thankyou. :) – Irshad Apr 14 '17 at 19:09
  • The function is called `tabs.sendMessage()` not `tabs.sentMessage()`. – Alien426 Jun 01 '17 at 12:29

2 Answers2

0

My question stands here. Which method to use from the below options:

You use browser.runtime.sendMessage({"actualMessage":"some message"});

erikvold
  • 15,988
  • 11
  • 54
  • 98
  • 2
    **From review queue**: May I request you to please add some more context around your answer. Code-only answers are difficult to understand. It will help the asker and future readers both if you can add more information in your post. – RBT May 13 '17 at 09:33
0

For a popup script (as opposed to content script - the thing you might run in the host tab window) ;

You can just put functions or variables in the background script and call/set/read those from the popup via a ref to the background window object.

background-script.js

let item = null ; //private to background script
function setItem(i){item = i;}
function getItem(){return item;}
var anotherItem ; // publicly available on background window object

var popUpEar ; // if you need to initiate communication from background - set in popup

function talkToPopUp(){
    popUpEar("listen to this!") ;
}

then in your popup you can do (using async/Promises)

function earToTheBackground(msg){
    console.log(msg);
}
async function f(){
    let backgroundWindow  = await browser.runtime.getBackgroundPage();

    let local_item = backgroundWindow.getItem();
    backgroundWindow.setItem("something else");
    let local_anotherItem = backgroundWindow.anotherItem ;
    backgroundWindow.anotherItem = "something else again";

    backgroundWindow.popUpEar = earToTheBackground ;
}
Bob
  • 1,589
  • 17
  • 25