I have a long task that is running in background.js, and I want to send a message to popup.js upon pletion. However, if the page action has not been clicked when the message is sent, the listener in popup.js will not yet have been registered, and the message will not be received.

I could instead send a message from popup.js and request the background task's result in response. However, there is no guarantee that the task will have finished at that point in time.

The only solution I see is a bination of the two: setting up a listener in both files and sending messages back and forth, saying things like: "Here's the result if you can hear me!" and "I can hear now! Send me a result if you're finished." However, this solution seems overly plex for such a simple task.

So, isn't there some place where background.js can place the result for popup.js to retrieve at its own leisure?

I have a long task that is running in background.js, and I want to send a message to popup.js upon pletion. However, if the page action has not been clicked when the message is sent, the listener in popup.js will not yet have been registered, and the message will not be received.

I could instead send a message from popup.js and request the background task's result in response. However, there is no guarantee that the task will have finished at that point in time.

The only solution I see is a bination of the two: setting up a listener in both files and sending messages back and forth, saying things like: "Here's the result if you can hear me!" and "I can hear now! Send me a result if you're finished." However, this solution seems overly plex for such a simple task.

So, isn't there some place where background.js can place the result for popup.js to retrieve at its own leisure?

• javascript
• google-chrome
• google-chrome-extension
• listener
• message-queue

1 Answer 1

1. store it an a global variable in a persistent background page, the use of which is officially discouraged for the obvious reason of memory efficiency.

   background.js:

   var status;
   

   popup.js, method 1, asynchronous, preferred:

   chrome.runtime.getBackgroundPage(function(bg) {
       displayStatus(bg.status);
   });
   

   popup.js, method 2, synchronous:

   if (chrome.extension.getBackgroundPage().status) {
       displayStatus(bg.status);
   });
   

2. use chrome.storage API or localStorage API (the latter stringifies everything but your code will be a little bit more concise due to being synchronous).

3. use the normal sendMessage munication, there's nothing overly plex in it:

   background.js:

   var taskCompleted = false;
   
   chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
       if (message.request == "checkStatus") {
           sendResponse({done: taskCompleted});
       }
   });
   
   .................
   
   if (taskCompleted) {
       chrome.runtime.sendMessage({done: true});
   }
   

   popup.js:

   chrome.runtime.sendMessage({request: "checkStatus"}, function(response) {
       if (response.done) {
           doSomething();
       }
   });
   
   chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
       if (message.done) {
           doSomething();
       }
   });