I cannot for the life of me figure this out. I am trying to use chrome.tabs.query on my background page to get the current tab to perform an action on a button click. The tab call produces the following error Error handling response: TypeError: Cannot read properties of undefined (reading 'id') From my understanding the return value is undefined. My question is how do I get the tab value? Can I send the tab value through popup.js message?

popup.js

document.addEventListener("DOMContentLoaded", function() {
    setOptions();

    document.getElementById("buttonScan").addEventListener("click", function() {
        loadOptions();
        chrome.runtime.sendMessage({
            "message": "getWords",
            "remove": true,
        });
    });
});

background.js

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    
    if ("getWords" == request.message) {
            chrome.tabs.query({
                    "active": true,
                    "currentWindow": true
                },
                function(tabs) {

                        chrome.tabs.sendMessage(tabs[0].id, {
                            "message": "returnWords",
                            "remove": request.remove,
                            "keywords": chrome.storage.local.get("keywords"),
                            "foreground": chrome.storage.local.get("foreground") || "red",
                            "background": chrome.storage.local.get("background") || "#lightblue",
                        });
                }
            );
    }
});