I'm building my first extension which searches a site, Craigslist for example, page by page (with about a 5 second delay between moving to the next page) looking for certain titles/text, etc.

When I turn my extension on and the tab is at the right URL, it starts to go page to page as expected. The issue is when I open a new tab, if I'm looking at the new tab at the time the next page is loading for my extension (on a different tab), it loads the next page in whatever tab I'm focused on at that moment.

I want the extension to grab the tab ID of the tab I'm viewing at the time I hit enable in my extension, then only update that tab going forward if its still open. Then maybe if that tab gets closed, the extension switches to disable automatically.

I use:

var myNewUrl = "https://example-site-url.com/?page=" + slice; //slice is the page number
chrome.tabs.update ({url: myNewUrl});

to update the URL, which works fine.

Here is my enable option/button I use in background.js

chrome.runtime.onMessage.addListener(end => {
    myButton = () => {
        enabled = !enabled;
        myButton.textContent = enabled ? 'Disable' : 'Enable';
        chrome.storage.local.set({enabled:enabled});
    };
});

The enable/disable works as expected too.

When I set it to enabled, can I grab the tab ID there in that function? Then call it in the chrome.tabs.update ({url: myNewUrl});?

I have the following in my manifest file which I believe is necessary:

  "permissions": [
    "activeTab",
    "tabs",

I looked through the Chrome Tabs documentation (https://developer.chrome.com/docs/extensions/reference/tabs/) and I primarily don't understand it. I tried using the Get the current tab code to return tab unsuccessfully. All my attempts pretty much crash the extension and it does not move forward at all.

My entire background.js

chrome.runtime.onMessage.addListener(slice => {
    var myNewUrl = "https://example-site.com/?page=" + slice;
    chrome.tabs.update ({url: myNewUrl});
});

chrome.runtime.onMessage.addListener(end => {
    myButton = () => {
        enabled = !enabled;
        myButton.textContent = enabled ? 'Disable' : 'Enable';
        chrome.storage.local.set({enabled:enabled});
    };
});

Almost all of the rest of my code is in the content-script.js, which sounds like it is not proper from what I'm reading elsewhere.

There, in the content-script, most of my code is under this, which is controlled by the enable/disable button:

chrome.storage.local.get("enabled", (data) => {
  if (data.enabled) {