how to dynamically change chrome extension icon

Question

I am developing a chrome extension. The scenario is kind of

When i click on the icon extension send POST request to server and on basis of the GET response it procceds on any of 3 different if/else if/ else statement. I am using page action to show the icon next to address bar. I want my extension icon to change dynamically on each if/else if /else statement.

this is my backgound.js to make the icon visible next to address bar.

    chrome.runtime.onInstalled.addListener(function() {
  chrome.declarativeContent.onPageChanged.removeRules(undefined, function() {
    chrome.declarativeContent.onPageChanged.addRules([
      {
        conditions: [
          new chrome.declarativeContent.PageStateMatcher({
          })
        ],
        actions: [ new chrome.declarativeContent.ShowPageAction() ]
      }
    ]);

}); });

this is my manifest.json

"page_action" :
{
"default_icon" : "icon-191.png",
"default_title" : "xxx",
"default_popup": "popup.html"

},

Any suggestion how can i change extension toolber icon dynamically on diffetent statement? Thanks In Advance!

Answer 1

Well, it's there in the docs.

declarativeContent API can only execute a very limited number of actions instead of arbitrary code.

Thankfully for you, chrome.declarativeContent.setIcon is an action that does exactly what you need. Use it just like the one you're using already, except it expects a parameter.

And give that docs page a read in general.