I have a manifest that looks somewhat like this:

"web_accessible_resources": [
   {
     "resources": [
       "script_injector.html",
       "script2.html"
     ],
     "matches": [
       "<all_urls>"
     ]
   }
 ],
 "content_scripts": [
   {
     "matches": [
       "<all_urls>"
     ],
     "js": [
       "new-content.js"
     ]
   }
 ],

In the new-content.js I have set an iframe:

let ifr = document.createElement('iframe');
ifr.setAttribute('allow', "microphone; camera; display-capture;");
ifr.style.display = 'none';
ifr.src = chrome.runtime.getURL('script_injector.html');
document.body.appendChild(ifr);

Script_injector.html looks like this.

<script src='script_injector.js'></script>

Script_injector.js

This file has data that needs to be saved before the tab containing the iframe is closed. The data is MediaRecorder blobs which is available only when the Mediarecorder is stopped. I need to save the data if the tab is closed and i have tried putting the save data inside the below function :

chrome.tabs.onRemoved.addListener(function (tabId, changeInfo, tab) {
savedata()
})

chrome.tabs.onRemoved is not firing at all when I close the tab. Which means the data that is recorded is lost.

Note that: I cannot use MediaRecorder in service worker in Manifest v3 because Media and Audio APIs are not allowed. So I use it this way. I am unaware about other ways but i think it's the only method.

How do I save the data before the page containing the iframe is closed?