'Manifest V3 extension: background's ServiceWorker does not unload after sending message to popup

With manifest V3, the background's Service Worker will unload (being inactive) after idling for 30 seconds. When I send a runtime message from popup to background without any further actions, after 30 seconds, the background's Service Worker is unloaded like usual. But when I send a runtime message from background to popup, it is not unloaded when idling anymore until it is forcefully unloaded by 5 minutes.

After it is forcefully unloaded by 5 minutes cap, when the popup is triggered again, message is not successfully passed anymore.

Here are the test codes (no special permissions): manifest.json

{
    "manifest_version": 3,
    "name": "Test sw-pp msg",
    "version": "1.0.0",
    "action": {
        "default_popup": "popup.html"
    },
    "background": {
        "service_worker": "background.js"
    },
    "permissions": [
        "activeTab"
    ],
    "host_permissions": [
        "http://*/*",
        "https://*/*"
    ]
}

popup.js

const lblStatus = document.getElementById('lblStatus');

// send test message from popup to background -> OK
chrome.runtime.sendMessage('to-background', (res) => {
    if (chrome.runtime.lastError) {
        lblStatus.textContent = 'Error';
    } else {
        lblStatus.textContent = 'OK';
    }
});

chrome.runtime.onMessage.addListener(function (msg, sender, sendResponse) {
    if (msg == 'to-popup') {
        lblStatus.textContent = 'Message from background to popup';
        sendResponse(1);
    }
});

popup.html

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
</head>

<body>
    <div id="lblStatus" style="padding: 2em; font-size: 2em;"></div>
    <script src="popup.js"></script>
</body>

</html>

background.js

chrome.runtime.onMessage.addListener(function (msg, sender, sendResponse) {
  if (msg == 'to-background') {
    console.log('Message from popup to background');
    sendResponse(1);

    /* Test sending message from background to popup
    - The first time the message is sent, the background's service worker may still be unloaded like usual
    - The second,... time the message is sent, the background's service worker is not unloaded anymore.
    - Without below code, the background's service worker is unloaded like usual
    */
    setTimeout(() => {
      chrome.runtime.sendMessage('to-popup', (res) => {
        if (chrome.runtime.lastError) {
          console.log('ERR');
        } else {
          console.log('OK');
        }
      });
    }, 2000);
  }
});

So I wonder what is the correct way to send message from background to popup (or options,...) in Manifest V3 extension?

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source

'Manifest V3 extension: background's ServiceWorker does not unload after sending message to popup

Sources

Related Questions