0

I am building a browser extension, and I want it to respond to only a specific list of urls - at the moment, I am just testing it with one URL, and I am trying to get an icon to change from white to green when a specific website is visited. (I want a browser action, not a page action).The icon is currently not changing colour when I visit the sample URL.

So, to be precise, the question is: how can I get a Chrome extension to respond to a specific collection of URLs, by changing it's icon colour?

This is the code I have written/tweaked:

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 based the above code on the question How to change the color of icon according to user login, which is related to my problem.

Update [25/10/15] - the code below shows a green icon in the search bar when one of the URL's listed is visited (currently only Cadbury). But what I want is an icon on the tool bar - that is, a browser action, (not a page action) and for that icon to change colour when a specific website is visited.

 // When the extension is installed or upgraded ...
  chrome.runtime.onInstalled.addListener(function() {
 // Replace all rules ...
 chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
// With a new rule ...
// This makes green icon show in search bar...
chrome.declarativeContent.onPageChanged.addRules([
  {
    // That fires when a page's URL contains a 'cadbury.co.uk' ...
    conditions: [
      new chrome.declarativeContent.PageStateMatcher({
        pageUrl: {urlContains: 'cadbury.co.uk' },
      })
    ],
    // And shows the extension's page action.
    actions: [ new chrome.declarativeContent.ShowPageAction() ]
  }
 ]);
 });
 });

I think I need to be using a browserAction though.

And this code resembles the behaviour I'm looking for, but rather than the icon changing colour when it is clicked, I want it to change colour when specific urls are visited.

var min = 1;
var max = 5;
var current = min;

function updateIcon() {
chrome.browserAction.setIcon({path:"icon" + current + ".png"});
current++;

if (current > max)
current = min;
}

chrome.browserAction.onClicked.addListener(updateIcon);
updateIcon();
Community
  • 1
  • 1
CodeMaster
  • 31
  • 5
  • 1
    Take a look at this: [Can't pass arguments to chrome.declarativeContent.SetIcon](http://stackoverflow.com/q/28750081) and a sample extension: [Page action by URL](https://developer.chrome.com/extensions/samples#search:page%20action%20by%20url) – wOxxOm Oct 24 '15 at 17:51
  • Sadly, `declarativeContent` can't be used to change the browser action. (I recommend editing your question to include proper terms "browser action" and "page action" for the two icons) – Xan Oct 25 '15 at 19:57

0 Answers0