問題タブ [firefox-developer-tools]

OS:ウィンXP

Chrome 開発者ツール - タイムライン - 読み込み時間をグラフとして表示するのと同じことができる FF3 用のプラグインはありますか? 互換性の問題により、完全な機能を確認するには FF3 でデバッグする必要があります。アドバイスしてください、ありがとう。

1 か月も経たないうちに、Firefox にデフォルトでインストールされている便利なツールを偶然発見しました。名前は覚えていませんが (おそらくコード インスペクターなど)、Ctrl+Shift+I (ツール -> Web 開発者 -> ツールの名前) ショートカットを使用して実行しました。

ツールは何でしたか？このツールは、Web ページのある場所にマウスを置くと、ツールのウィンドウにその場所の HTML コードが表示されるように機能しました。現在、システムが更新されており、このツールはブラウザから消えています。私は非常に失望しています。私が探しているツールを知っている人はいますか？

前もってありがとう、
クバ

Firebugは職場でブロックされているので、誰かがその代替案を提案できますか？

デフォルトの Firefox Web 開発者ツールを使用しています。Firefox 20.0、Mac OS X 10.7。

開発者ツールのデバッガー パネルを開いている (フォーカスしていない) 場合、ページを更新すると、更新されたページではなくデバッガー パネルにフォーカスが移動します。代わりに、更新されたページに移動するようにフォーカスを設定できますか?

代わりに Web コンソール パネルを開いた場合、フォーカスが奪われることはありません。理想的には、デバッガーを同じように動作させたいと考えています。

私のプログラムはドキュメントkeyupとkeydownイベントを使用しており、これらが機能するにはページにフォーカスが必要です。毎回ページをクリックしなければならないのは、驚くほど面倒です (ほんの小さなことですが、更新のたびに必要な作業量が 2 倍になります!)。

開発者ツールをFirefoxまたはChromeで使用する場合、開発者ツールのスタイルシートに変更を加えた後、実際のスタイルシートを修正するときに後で参照できるようにそれらの変更を保存する方法はありますか?

Chrome のインスペクターには、コンソールで使用するフレームを選択するセレクターがあることを知っています。Firebug にも同様のコマンドがありcd(window.frames[number])ます。Firefox Devtools に似たようなものはありますか? frame.window.eval は機能すると思いますが、クロスドメインでない場合に限ります。

また、Web コンソール コマンドの結果を検査するハイライターがあるかどうかも疑問に思っていましたdocument.getElementsByClassName(...)。ただし、少なくとも要素のスタイルをプログラムで変更して「見る」ことができます。

Firefox 開発ツールに「html の編集」ボタンを追加しようとしています。chrome://browser/content/devtools/inspector/inspector.xul には次のものがあります。

この chrome.manifest でオーバーレイを追加しようとしています:

私の inspectorOverlay.xul:

スタイル css は機能しており、このオーバーレイは組み込みのインスペクター パネルにメニュー項目を追加する 必要がありますが、何もしていないように見えます。このオーバーレイに問題がありますか、それともインスペクターの変更に何らかの制限がありますか?

webconsole.jsが Firefox Devtools にどのようにインポートされるかを理解しようとしています。toolbar.xul にインポートする必要がありますが、DOM インスペクターまたは Venkman JS デバッガーのいずれにもインポートされていることがわかりませんでした。

JSTerm.execute(command, callback)より具体的に言うと、Web コンソールで何かを入力したときに起こるのと同様に、inspector.xul コンテキストから呼び出そうとしています。これらのオブジェクトはインスペクターの親ウィンドウ (開発ツールのメイン ツールバー) にあるはずですが、参照が見つからないようです。

Firefox コンソールがネットワーク情報ダイアログをポップアップする方法を改善したいと考えています。オーバーレイを試しました：

しかし、うまくいかないようです。ソースを調べたところ、ファイルには要素を表示するコードがないように見えます。別のフォームがそれを呼び出しているに違いありません。Firefox 拡張機能から、このポップアップ ウィンドウに機能を追加する簡単な方法があるかどうか疑問に思っています。

- アップデート -

NetworkPanel.jsm で関連するコードをいくつか見つけました。

残念ながら、アドオン コードからこのようなリスナーを作成する簡単な方法はないようです。store-original-function-and-replace トリックを実行しようとしましたが、実行されましたが、何らかの形で正しいコンテキストで元の関数を呼び出していないようです:

^ 私は元々 と を試していまし.call(WebConsoleFrameた.call(WebConsoleFrame.prototype。通常、これは機能するはずですが、クロムコードの特別な状況である可能性がありますか?

上記のこのコードは、このオーバーレイで動作しています:

強調表示機能を Firefox DevTools デバッガーに追加しようとしてきたので、[HTMLAnchorElement] などを表示するだけでなく、要素を強調表示します。someElement.style.border='1px solid blue'時計のように設定または類似することができ、要素を強調表示するので、それが可能であることはわかっています. では、現在の境界線を保存し、 を使用してマウスオーバーで表示し、element.style.border='1px solid blue'マウスアウトで復元してみませんか?

Firefox devtools でデバッグしているときに、右側のウォッチ パネルの要素に変数名の行があることに気付きました。実際には、「document.getelementsbytagname('a')36」ID の親要素の下に、「46439」のような奇妙な ID が与えられています。これらの ID は何を意味しますか? 表示要素をページ内のターゲット要素にマップできますか? Venkman から試しwindow.DebuggerView.WatchExpressions.getItemForElementましたが、null が返されます。このソース ファイルから、デバッガー ウォッチのターゲット要素を提供する別の関数はありますか?

理想的にはdocument.getElementsByTagName('a')、デバッグ コンテキストで、またはローカル変数などのアイテムを「監視」し、Chromium/Firebug などのページ内のアイテムを強調表示できるようにする必要があります。しかし、Firefox 拡張機能からこの機能を追加する方法がわかりません。

更新：

さらに作業を進めると、 を使用しDebuggerView.StackFrames.evaluateて、ブレークポイントで停止している間にコードを実行することが可能になるようですchrome://browser/content/devtools/debugger-controller.js。残念ながら、ブレークポイントで停止したときにこのコードを実行しDebuggerView.StackFrames.evaluate、[void] voidVenkman にいます。この評価コマンドは何らかの形で非表示または非公開ですか、それとも初期化されていませんか?