TypeError: Cannot read properties of undefined (reading 'network') when using chrome.devtools.network API in my chrome extension

Question

I'm creating a chrome extension, which captures files which are being attached when writing emails, and I cannot figure the right usage of the chrome.devtools.network API since it gives me this error above. Does anyone know if you can actually capture the raw data, or have a solution or a different approach?

**manifest.json**

{
    "manifest_version": 3,
    "permissions": [
        "activeTab", 
        "tabs", 
        "storage"
    ],
    "background": {
        "service_worker": "background.js"
    },
    "content_scripts": [
        {
          "matches": ["<all_urls>"],
          "js": ["content.js"]
        }
    ],
    "action": {
        "default_popup": "index.html"
    },
    "devtools_page": "background.js"

}

**background.js**

chrome.devtools.network.onRequestFinished.addListener(
    function(request) {
      console.log(request)
    }
);

Answer 1

It can be used only inside devtools_page, which is html:

<script src=devtools.js></script>

This script will run automatically when devtools is opened. The page itself isn't shown anywhere, but you can inspect it via devtools-on-devtools, also via chrome://extensions -> details for your extension -> Inspect views link, which will be shown when devtools is opened on a normal web page, i.e. not chrome://.

You can't load the same script also as service_worker as these are entirely different contexts. There's also no need for service_worker here.