How can you get a Chrome extension to detect specific URLs, and respond by changing the colour of it's tool bar icon?

See more:

Javascript

JSON

extension

browser

, +

I am working on a browser extension, and the first problem I'm trying to resolve is:

How can you get a browser extension to detect specific URLs, and respond by changing the colour of it's tool bar icon? Also, would 'pageAction' be more appropriate?

I have tested this code, and the icon does not turn green (as required) when I visit the url: "https://www.cadbury.co.uk/".

I looked this problem up on Stack Overflow, and found some useful code, and tweaked it like so:

/*There will eventually be a list of urls in a database for the extension to check through*/
var url = "https://www.cadbury.co.uk/"; 

/* Listen for external messages (messages from web-pages) */
chrome.runtime.onMessageExternal.addListener(function(url, sender) {
if (sender.url == url) {

    chrome.browserAction.setIcon({ path: "green.png" });
}

else {
    chrome.browserAction.setIcon({ path: "white.png" });
}

});

(I am initially working with Chrome, but want it to be compatible with Safari and Firefox eventually too). I based the above code on the following Stack Overflow answer, which is a little related to my problem: How to change the color of icon according to user login

Some hints in the right direction would be much appreciated.