I'm learning about browsers extensions and I've read that I need to implement the scripting permissions to be able to execute scripts. I've done that but I still have the same error: TypeError: Cannot read properties of undefined (reading 'executeScript')

This is my manifest:

{
  "manifest_version": 3,
  "name": "UnderLined Traductor",
  "version": "1.0",
  "author": "Angel Acedo Moreno",
  "description": "Underlined Traductor allows you to traduce automatically underlined texts",
  "permissions": [
    "scripting",
    "activeTab",
    "tabs"
  ],
  "background": {
    "service_worker": "./app/background.js"
  },
  "action": {
    "default_icon": {
      "16": "assets/img/icon.png",
      "24": "assets/img/icon.png",
      "32": "assets/img/icon.png"
    },
    "default_title": "Coolest extension",
    "default_popup": "./app/popup.html"
  }
}

and this is my js:

const getHightLightedText = () =>
{
    document.addEventListener('mouseup', event =>
    {
        if (window.getSelection().toString() != "")
        {
            console.log(window.getSelection().toString());
        }
    });
};



async function tabAddDiv()
{
    console.log(chrome.scripting)
    const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
    await chrome.scripting.executeScript({
        target: { tabId: tab.id },
        func: getHightLightedText(),
    });
}
tabAddDiv()

Thanks for your help :)

CodePudding user response：

The solution was to:

1. Reload the extension on chrome://extensions page when you edit manifest.json,
2. remove () in func: getHightLightedText(),
3. make sure you open the popup by clicking the extension icon, not as a http page or file:// URL

Thanks for the help :D