IT戦記

Firebug に一行追記して右クリックで XPath をコピペ出来るようにする。

JavaScript

この XPath 使いたい＞＜

って思うことよくありませんか？

サイト見てて、あ、このボタンにグリモンであんな機能やこんな機能付けたい＞＜！って思うこととかありますよね！

そんなときに、いちいち要素の位置とか考えずに右クリックで XPath をコピペできたら嬉しいですよね＞＜

ってことで

作ってみた

イメージはこんな感じです。

これをクリックすると、右クリックされた要素の XPath がクリップボードにコピーされます。

この機能を Firebug に実装する手順

1. Firefox のプロファイルディレクトリに行く

環境	プロファイルディレクトリ
WinVista	C:\Users\[ユーザ名]\AppData\Roaming\Mozilla\Firefox\Profiles\[ランダムな文字].default\
WinXP	C:\Documents and Settings\[ユーザ名]\Application Data\Mozilla\Firefox\Profiles\[ランダムな文字].default\
Mac	~/Library/Application Support/Firefox/Profiles/[ランダムな文字].default/
Unix系	~/.mozilla/firefox/[ランダムな文字].default/

2. 以下のファイルを zip で解凍

extensions/firebug@software.joehewitt.com/chrome/firebug.jar

3. 解凍したら firebug.jar に入っていた以下のファイルを開く

content/firebug/browserOverlay.xul

4. 以下のような個所を探す（66行目くらい

<popup id="contentAreaContextMenu">
  <menuseparator/>
  <menuitem id="menu_firebugInspect" label="&firebug.InspectElement;" oncommand="Firebug.showBar(true); FirebugChrome.select(document.popupNode);"/>
</popup>

5. 以下のように一行追加

<popup id="contentAreaContextMenu">
  <menuseparator/>
  <menuitem id="menu_firebugInspect" label="&firebug.InspectElement;" oncommand="Firebug.showBar(true); FirebugChrome.select(document.popupNode);"/>

  <!-- 以下の行を追加 -->
  <menuitem id="menu_copyXPath" label="Copy XPath" oncommand="FBL.copyToClipboard(FBL.getElementXPath(document.popupNode));"/>

</popup>

6. 元のように全体を zip でかためて元の場所に戻す

extensions/firebug@software.joehewitt.com/chrome/firebug.jar

7. はい完成

わーわー。ぱちぱち

まとめ

これマジで便利ー。

自分の Firebug は改造しまくってるので、時間があるときにでも Firebug ハッキング Tips を纏めたい。

追記

cho45 が書いた uc.js のやつ とか teramako さんが書いた uc.js のやつとかがもっと便利そうです＞＜

ツイートする

Permalink | コメント(0) | トラックバック(0) | 16:12