I'm trying to build a chrome extension where when the button is pressed it sends a request. This works fine when I try it using a website format. When I turn it into a chrome extension it doesn't work however. Here is my popup.js

function myFunction() {
  var x = document.getElementById("inp").value;
  /*console.log(x)*/
  const req = new XMLHttpRequest();
  const url='https://*****.****.**/doctorapi/'+x;
  /*console.log(url)*/
  
  req.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
       //The responseText property
       //returns a text string
        document.getElementById('answer').innerHTML= req.responseText;
       //Do some stuff
    }
};
req.open("GET", url, true);
req.send();
  
}

and my manifest.json

{
  "name": "DoctorBotTheExtension",
  "description": "DoctorBot Web API fit into an extension",
  "version": "1.0",
  "manifest_version": 3,
  "background": {
    "service_worker": "background.js"
  },
  "permissions": ["storage","webRequest"],
  "action": {
    "default_popup": "popup.html",
    "default_icon": {
        "16": "/images/icon16x16.png",
        "32": "/images/icon32x32.png",
        "48": "/images/icon48x48.png",
        "128": "/images/icon128x128.png"
    }
  },
  "icons": {
      "16": "/images/icon16x16.png",
      "32": "/images/icon32x32.png",
      "48": "/images/icon48x48.png",
      "128": "/images/icon128x128.png"
  }
}

When I run this my web server gets no request. How do I fix this?