Chrome Extension でデバッグを行う

chrome 拡張機能でデバッグを行うためのメモ！
右上のあのアイコンをクリックしたときに現れるhtmlファイルをページで見ること出来るみたいです。

/path/to/popup.html
ってやつを表示する設定
つまり

{
  "manifest_version": 2,
  "name": "My First Extension",
  "version": "1.0",
  "description": "The first extension that I made.",
  "browser_action": {
    "default_title": "My First Extension",
    "default_icon": "icon.png",
    "default_popup":"popup.html"
  }
}

みたいになっているとき
popup.htmlの挙動をみることが出来ます。

方法は、

chrome-extension:// {chrome_id} /popup.html
っていうところにアクセスすればいいんですが、この
{chrome_id}
っていうのが
chrome://extensions/
にあるMy First Extension (デバッグ用のアプリ)のIDに書いてある文字列！
以下の画像を参考！

f:id:arata3da4:20130907033800p:plain