2009-02-27

最近記憶力の低下が著しいkusagayaです。

最近は専らJavaScriptを書くことが多いんですが、皆さんどのようなデバッグツールを使っていますか? FirefoxであればFirebugというのが一般的だと思いますが、 IEで一般的なデバッグツールと言えば?と言われると、ちょっと答えられないです。 そこでIEで使えるデバッグツールをいくつか紹介したいと思います。

DebugBar
・DOMのInspectやJavaScript、CSSのソース、レイアウトなどを見ることが可能(Iframe内までInspectできるのは多分これだけ)
・HTTP Requestが見れる
・JavaScriptのコンソールがあるので、アドレスバーから実行する必要がない

CompanionJS
・Firebugのコンソール機能のみを再現しているようなもので、Firebug同様にconsole.logが使える(但しObjectの中身は見れない)
・Jsのエラーが出ているファイルと何行目の部分がエラーになっているかが分かる。(あくまで目安程度ですが・・・)

Internet Explorer Developer Toolbar
・DOMのInspectができる(但しIframe内は不可)
・CSSの修正をブラウザ上からすることが可能
・Web DeveloperのようにCSS切ったりできる

Firebug Lite
・インストール不要でIE、Safari、Opera、chromeで使える
・DOMの検索が意外といい感じ

と、大体こんな感じです。

やはりFirebugに比べるとかゆいところに手が届かない感じはありますが、 併用することで何とか実用に耐えるといった感じですので、 全てのツールをインストールしておいて、状況に応じて使い分ける。 私はこれが一番いいと思います。

DOMのInspectをする場合はDebugBar、JSのデバッグをするのであればCompanionJS、 CSSを修正したいならInternet Explorer Developer Toolbar、簡単に確認したいのであればFirebug Lite といったような使い分けで使っています。

そもそもFirebugのIE版が出れば、こんなことをする必要もないんですが・・・。