title: chrome.browserAction.setIcon not doing anything
body: <p>I am making a chrome extension, and the extension has two modes: always on (<code>alwaysOn</code>), or only when the user clicks it (<code>onClick</code>). I want to change the icon to be blue or red depending on the user's mode, so they can see it at a glance. However, after adding the <code>chrome.browserAction.setIcon()</code> line, the icon still doesn't change when it needs to. It just stays on the default logo.</p>
  
  <p>Here is my background.js:</p>
  
  <pre><code>// Get the behavior of the plugin; the default is set to "onClick", the other option is "alwaysOn"
  chrome.storage.sync.get({
      extensionBehavior: 'onClick'
  }, function(items) {
      if(items.extensionBehavior == 'onClick'){
        chrome.browserAction.setIcon({path: "blue-logo.png"});
        chrome.browserAction.onClicked.addListener(function() {
          // When the extension icon is clicked, send a message to the content script
          chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
            chrome.tabs.sendMessage(tabs[0].id, {"message": tabs[0].url}, function(response){});
          });
        });
      }
      else {
        chrome.browserAction.setIcon({path: "red-logo.png"});
        chrome.tabs.onUpdated.addListener(function (tabId, changeInfo, tab) {          
          if (changeInfo.status == 'complete') {
             // When the HTML loads, send a message to the content script
             chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
               chrome.tabs.sendMessage(tabs[0].id, {"message": tabs[0].url}, function(response){});
             });
          }
        });
      }
  });
  </code></pre>
  
  <p>Everything else runs perfectly, and the console.log() doesn't show any errors. Is there any reason javascript would be "skipping over" these particular lines of code? ("These particular lines of code" being <code>chrome.browserAction.setIcon({path: "blue-logo.png"});</code> and <code>chrome.browserAction.setIcon({path: "red-logo.png"});</code>) The images in question are in the same folder as my background.js, content_script.js, etc. so I'm not sure if the path is just being read wrong or what.</p>
  
  <p>EDIT: I opened the console and I get the message "Unchecked runtime.lastError while running browserAction.setIcon: Icon invalid." What does this mean? If I specify the full path starting from C:\Users...\blue-logo" I get the error message could not find.</p>