読者です 読者をやめる 読者になる 読者になる

日頃の行い

個人的な日頃の行いをつらつら書いてます\\\\ ٩( 'ω' )و ////

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


って感じに
chrome-extension:// {chrome_id} /popup.html
にアクセスすればpopup.htmlの中身をブラウザで表示できる。