How do I get a Chrome Extension PageAction icon to appear in the address bar?

Question

I'm trying to build a Chrome Extension that appears as an icon in the address bar which, when clicked, sets contenteditable=true on all elements on the page, and then when clicked again sets them back to contenteditable=false.

However, I'm falling at the first hurdle... The icon isn't even showing up in the address bar.

Here's my manifest file:

 {
  "name": "Caret",
  "version": "1.0",
  "description": "Allows you to edit the content on any webpage",
  "page_action": {
    "default_icon": "icon.png"
  },
  "content_scripts": [
    {
      "matches": ["http://*/*"],
      "js": ["jquery.js", "caret.js"]
    }
  ],
  "permissions" : [
    "tabs"
  ]
}

and here's the caret.js script:

    chrome.browserAction.onClicked.addListener(function(Tab) {

    $("*").attr("contenteditable",true);

}); 

This is my first attempt at an extension, so it's quite probably a newbie mistake, but I'd really appreciate any help or advice!

Answer 1

Ok, turns out I needed to use chrome.pageAction.show(tab.id);, which meant I needed to get the ID of the current tab, which is achieved with:

chrome.tabs.getSelected(null, function(tab) {

    chrome.pageAction.show(tab.id);


});

BUT it turns out you can't use chrome.tabs within a content script, so I had to switch to using a background page instead.

Answer 2

This is no longer possible as of last release.

Chrome extension page action appearing outside of address bar

https://groups.google.com/a/chromium.org/forum/#!searchin/chromium-extensions/upcoming/chromium-extensions/7As9MKhav5E/dNiZDoSCCQAJ