Manifest v3 inject script from popup.js

Question

In manifest v2 this code worked and injected the script when button was clicked:

popup.js v2 (works)

document.addEventListener('DOMContentLoaded', function () {
// Get button by ID
var button = document.getElementById('btnScan');

// Define button on click action
button.onclick = function () {
    chrome.tabs.executeScript(null, {
        file: 'Scripts/script.js'
    });
    window.close();
    }
});

Now in manifest v3, chrome.tabs.executeScript is replaced with chrome.scripting.executeScript.

scripting permission is added in manifest.json.

popup.js v3 (not working)

document.addEventListener('DOMContentLoaded', function () {
// Get button by ID
var button = document.getElementById('btnScan');

// Define Scan button on click action
button.onclick = function () {
    chrome.scripting.executeScript
        (
        {
            target: { tabId: null}, // ???????
            files: ['Scripts/script.js']
        }
        );
    window.close();
    }
});

The problem is that chrome.tabs.executeScript requires tabId value as one of the parameters. How can I get tabId value in popup.js or convert the manifest v2 version javascript so that it works the same?

Answer 1

Thanks to @wOxxOm who posted a link as a comment.

The solution was to get the active tab and use its tabId.

document.addEventListener('DOMContentLoaded', function () {
    // Get button by ID
    var button = document.getElementById('btnScan');
    button.onclick = injectScript;
});

async function injectScript() {
    const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
    await chrome.scripting.executeScript({
    target: { tabId: tab.id },
    files: ['Scripts/script.js']
    });
    window.close();
}