I get "No matching signature" error in my background.js

Question

I get the error "Uncaught TypeError: Error in invocation of scripting.executeScript(scripting.ScriptInjection injection, optional function callback): No matching signature." in my console. I have no idea what's wrong, someone please help me, I really appreciate it.

Here is the background.js code:

var Tabclicked = false;
disableBrowserAction();


function disableBrowserAction(tabId) {
    chrome.scripting.executeScript(tabId, { file: 'jquery.js' }, function() {
        chrome.scripting.executeScript(tabId, { file: 'CloseRuler.js' });
    });
}

function enableBrowserAction(tabId) {
    chrome.scripting.executeScript(tabId, { file: 'jquery.js' }, function() {
        chrome.scripting.executeScript(tabId, { files: 'Ruler.js' });
    });
}

function updateState() {
    if (Tabclicked == false) {
        Tabclicked = true;
        enableBrowserAction();
    } else {
        Tabclicked = false;
        disableBrowserAction();
    }
}

//chrome.pageAction.onClicked.addListener(updateState);

chrome.action.onClicked.addListener(function(tabId) {
    updateState(tabId);
    alert('File test alert');

});

alert('File test alert');

Here is my manifest:

{
    "name": "Physics Ruler",
    "description": "Position the ruler and measure the objects!",
    "version": "1.0",
    "manifest_version": 3,
    "permissions": [
        "activeTab",
        "scripting"
    ],
    "background": {
        "service_worker": "background.js",
        "type": "module"
    },
    "action": {
        "default_icon": "icon.png",
        "default_title": "Ruler",
        "name": "Physics Ruler"
    },
    "content_scripts": [{
        "js": ["jquery.js"],
        "matches": ["*://*/*"]
    }],
    "host_permissions": [
        "*://*/*"
    ]
}

Answer 1

So, I have found the answer, and the documentation was kind of not help full, I have just tried different things until it worked.

We have to make this function with chrome tabs:

chrome.tabs.query({ currentWindow: true, active: true }, function(tabs) {

in that function then we can use "tabs[0].id" to get the id.

for example:

function enableBrowserAction(tabId) {
chrome.tabs.query({ currentWindow: true, active: true }, function(tabs) {
    chrome.scripting.executeScript({ target: { tabId: tabs[0].id }, files: ['jquery.js'] }, function() {
        chrome.scripting.executeScript({ target: { tabId: tabs[0].id }, files: ['Ruler.js'] });
    });
});

}