問題タブ [firefox-developer-tools]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - デバッグ用に JavaScript ファイルを変更する方法は?
理由 :
1 つのページに多数の iframe で構成される複雑な Web アプリケーションがあります。ページ全体をリロードすることなく、iframe 内のページをデバッグおよびリロードできるように、このように設計されています。残念ながら、JSD2 実装以降、iframe は Firebug のスクリプトパネルまたは Firefox 開発者ツールのデバッガパネル内で適切にリロードされません。
上記の問題が修正されるのを待つのをやめるか、単一のページ形式に変更して、各パネルの HTML、CSS、および JavaScript を動的にリロードする必要があるかどうか疑問に思っています。
これで私が抱えている問題は、<script>
要素をリロードすることです。<script>
既にファイルを含む要素にさらにコードをロードすることはできないようです。要素を削除して、新しい要素を作成する必要があります。これにより、ブレークポイントが失われ、デバッガー/スクリプトパネルのソース リストに無効なリストの長いリストが表示されます。
質問 :
ページ全体をリロードしたくない場合に、改訂された JavaScript ファイルをページにリロードする最良の方法は何ですか?
css - Firefox Devtools に新しいルールを追加できない
.entry-content a
上記の gif では、 Firefox DevTools を使用して新しいルールをスタイルに追加する際に問題が発生していることがわかります。私の人生では、このフローを機能させることができませんでした:
- 右クリック > 新しいルール
- タイプ
.entry-content a
- タブを押す
- CSSの追加を開始
足りないものはありますか?Chrome から移行してから数か月間、Firefox を開発ブラウザーとして使用しており (ここでは説明しません)、それが私が慣れ親しんでいる環境です。
javascript - Firefox デバッガーを使用して jQuery イベントをデバッグするにはどうすればよいですか?
私はこれについて頭を悩ませてきましたが、私の人生でそれを理解することはできません.
この議論のために作成したテストページを次に示します。
このページは非常に複雑で、私が作成したわけではなく、ユーザーが [実行] をクリックしたときに実行されるコードを確認しようとしているとします。デバッガーを開き、サイド ペインを開いて [イベント] をクリックします。ボタンであるクリックイベントにチェックマークを付け#execute
ます。
ボタンをクリックすると、コードがブレークポイントにヒットします。しかし奇妙なことに、「Bob」という名前はすでに入力されているため、明らかに実際のコードを通り過ぎて、ここにたどり着きました。
ここで何が起こっているのかわかりません。そこで、Firefox の新機能で、便利かもしれないと思った別のことを試してみました。コードを調べると、特定の DOM 要素に「ev」タグがほとんどありません。おそらく、それらをクリックしてコードを表示できます。
まあ、それは無駄でした。jQuery イベントをデバッグする方法と、実行される実際のコードを確認する方法を教えていただければ、私は永遠に感謝します。ありがとう!
firefox - Firefox Devtools のキー バインディングを編集する
Firefox 33 以降、エディターでさまざまなスタイルのキー バインディングを使用するための GUI オプションが開発ツールにありました。これは素晴らしいことですが、機能はこれで終わりです。エディターの特定のキー バインドを編集するにはどうすればよいですか?
私は Sublime キー バインドを使用していますが、新しいタブを開く代わりにcmd/ctrl+をキャプチャして文字を入れ替えてしまうことが 1 つの厄介な点です。これは信じられないほど面倒で、FF ソース コードからこのファイルTを編集する方法を探していましたが、どこにも見つかりません。FF のソース コードをダウンロードして編集し、独自のビルドを作成することはできません。
css - Firefox Developer Edition Inspector ツールから CSS を編集する
Firefox Developer EditionのInspector タブで行った CSS の変更を保存しようとしています。
私の知る限り、css は Style Editor タブでのみ保存できますが、 Inspector Tool で行った変更は反映されません。
インスペクタータブからスタイルエディターでcssを編集する方法はありますか?
google-chrome - chrome/firefox 開発者ツールでイベント リスナーに関する役立つ情報を確認する方法はありますか?
jQuery を使用してクリック イベントにバインドしているため、そのコードがアプリケーション内のどこにあるかを把握するのは非常に困難です。
Chrome のイベント リスナー パネルは次のようになります。
ただし、定義をクリックすると、jquery に移動します。jquery スクリプトをブラックボックス化しても、jQuery に送信された関数を特定する方法はありません。
Firefox 開発者版では、似たようなものが見られます:
firefox - Firefox 開発者版 TypeError
新しいFirefox開発者版をインストールしただけで、機能の1つが別のブラウザーでWebサイトをリモートでチェックしています。それで、私は自分のウェブサイトを開き、firefox の新しいコマンド ライン「ios」を入力して safary でテストしましたが、エラーが発生しましTypeError: response is null
た。
誰かがすでに試しましたか?これを機能させる方法はありますか?ありがとう