Why does clicking the action icon in chrome not return a result?

I'm developing in chrome and want to console.log when the action icon is clicked. Looking at the console, the first script in my background.js file works (tracking the current URL), however, nothing is returned when the icon is clicked. Any idea what I'm doing wrong? Thanks!

manifest.json

{
  "manifest_version": 3,
  "name": "Chrome Extension with React & Webpack",
  "options_page": "options.html",
  "background": { "service_worker": "background.bundle.js" },
  "action": {
    "default_title": "Click to show an alert"
  },
  "permissions": ["activeTab", "scripting", "tabs"],
  "chrome_url_overrides": {
    "newtab": "newtab.html"
  },
  "icons": {
    "128": "icon-128.png"
  },
  "content_scripts": [
    {
      "matches": ["http://*/*", "https://*/*", "<all_urls>"],
      "js": ["contentScript.bundle.js"],
      "css": ["content.styles.css"]
    }
  ],
  "devtools_page": "devtools.html",
  "web_accessible_resources": [
    {
      "resources": ["popup.html", "content.styles.css", "icon-128.png", "icon-34.png"],
      "matches": [],
       "extension_ids": []
    }
  ]
}

Background.js

//This works
chrome.tabs.onUpdated.addListener(function () {
  console.log("TAB UPDATED")
  getTab().then(url => {
      console.log(url);
  })
})

async function getTab() {
  let queryOptions = { active: true, currentWindow: true };
  let tabs = await chrome.tabs.query(queryOptions);
  return tabs[0].url;
}

//Nothing is console logged
chrome.action.onClicked.addListener(tab => { console.log('test')});