Unable to set badge on chrome extension after opening tabs

I am writing a chrome extension which has a button on popup window. When the button is clicked, it fetches all text present on the page and finds the text containing the sub-string "IP-", appends that to a base url and opens that url in a new tab. Usually 8-10 tabs open.

This is working as expected.

However, after opening all tabs, I want the number of tabs opened in the process to be displayed as a badge on extension icon which I am not able to do. Here is the code that I am using but no badge is displayed on the icon.

Not sure if it has something to do with the content of each tab being loaded. If I place the code for setting a badge on a different place in my popup.js file and give it a hard-coded text, it works.

EDIT - Added the working code

popup.js

document.getElementById("btn").addEventListener("click", function(){
  chrome.tabs.query({active: true, lastFocusedWindow: true}, tabs=> {
   chrome.scripting.executeScript(
    {
      target: {tabId: tabs[0].id, allFrames: true},
      func: openlinks,
      })
    });
  })
  
})

function openlinks(){
   var all_text = document.body.innerText;
   all_text = all_text.split("\n")
   let counter = 0
   for(let i = 0; i < all_text.length; i++){
     if (all_text[i].includes("IP-")){
        counter++
        url = "base-url-goes-here"+all_text[i]
        window.open(url)
       }
   }
   chrome.runtime.sendMessage(counter)
}

default_settings.js (service_worker)

chrome.runtime.onMessage.addListener((request) => {
    chrome.action.setBadgeText({text: request.toString()});
});

manifest.json

{
    "name": "Name",
    "version": "1.0.0",
    "description": "Description",
    "author": "Author Name",
    "permissions": ["storage", "tabs", "scripting", "activeTab"],
    "background": {
        "service_worker": "default_settings.js"
      },
    "action": {
        "default_title": "Title",
        "default_popup": "src/popup.html"
      },
    "manifest_version": 3
}