I'm learning Chrome extension development and want to update the content of my popup whenever theres change to the URL (Not a tab change!).

My content script is basically accessing the DOM and grabs some text to set as a name within Chrome localStorage. popup.js then retrieves the name from localStorage and outputs within the pop.up.

Problem: How can I re-run the content script whenever the current pages URL changes? I think I would need to use chrome.tabs.onUpdated.addListener but unsure of how to implement. How can I best implement this functionality?

So far I have the following:

contentScript.js

// Store name in localStorage
chrome.storage.local.set({ name });

popup.js

// Get name from localStorage and set as some state
useEffect(() => {
    chrome.storage.local.get('name', (data) => {
        setName(data.name);
    });
}, []);

manifest.json

"permissions": ["storage", "tabs"],
"content_scripts": [
    {
        "matches": ["https://site.storm.com/*"],
        "js": ["contentScript.js"]
    }