chrome extension functionality not working properly after manifest version change from version 2 to version 3

I have created chrome extension for translating text from one language to another language , for that we are using the context-Menu API. When I have select some text on any web-page and after opening context-Menu when I click on particular option the pop-up for translation get's open,but as I have converted this extension from manifest version 2 to manifest version 3 the pop-up opens for only one or two times. I need to click on extension to work the pop-up again

Translation POP-UP when we clicked on context-Menu selection

Background.js

chrome.contextMenus.onClicked.addListener(function (info, tab) {
  if (info.menuItemId == translateSelectionMenuId){
    let queryOptions = { active: true, currentWindow: true };
    chrome.tabs.query(queryOptions, (tabs) => {
      setTimeout(()=>{
        chrome.tabs.sendMessage(tabs[0].id, {
          op: "translateSelection",
          selectedText: info.selectionText,
        });
      },0)
    })
  }
});

Content.js

chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
  if (request.op === "translateSelection") {
    translateSelection(request.selectedText);
  }
});

function translateSelection(txt) {
  var translateDialog = document.getElementById("awsAIExt_translate");
  console.log("translateDialog: ", translateDialog);
  if (translateDialog == null) {
    translateDialog = document.createElement("div");
    $(translateDialog).load(
      chrome.runtime.getURL("translate.html") + " #awsAIExt_translate",
      function () {
        $(translateDialog).dialog({
          title: "Translate Buddy",
          width: 700,
          height: 600,
          zIndex: 3999,
          create: function (event, ui) {
            $("#awsAIExt_translateBtn").click(translate);
            $("#taskusLogo").attr(
              "src",
              chrome.runtime.getURL($("#taskusLogo").attr("src"))
            );
            $("taskusLogo").width(200).height(150);
            $("#translateBuddyLogo").attr(
              "src",
              chrome.runtime.getURL($("#translateBuddyLogo").attr("src"))
            );
            $("translateBuddyLogo").width(200).height(150);
            $("#awsAIExt_inputText").val(txt);
          },
          open: function (event, ui) {
            if (
              translatePreferences &&
              translatePreferences.sourceLangCode &&
              translatePreferences.targetLangCode
            ) {
              $("#awsAIExt_inputLang").val(translatePreferences.sourceLangCode);
              $("#awsAIExt_outputLang").val(
                translatePreferences.targetLangCode
              );
            }
            translate();
          },
        });
        let ele = document.getElementById("ui-id-1");
        ele.style.display = "contents";
      }
    );
  } else {
    $("#awsAIExt_inputText").val(txt);

    $(translateDialog).dialog({
      title: "Translate Buddy",
      width: 700,
      height: 600,
      zIndex: 3999,
      open: function (event, ui) {
        if (
          translatePreferences &&
          translatePreferences.sourceLangCode &&
          translatePreferences.targetLangCode
        ) {
          $("#awsAIExt_inputLang").val(translatePreferences.sourceLangCode);
          $("#awsAIExt_outputLang").val(translatePreferences.targetLangCode);
        }
        translate();
      },
    });
    let ele = document.getElementById("ui-id-1");
    ele.style.display = "contents";
  }
}