3

このインラインスクリプトを含むWebページがあるとしましょう。

<script>
(function () {
    var script = document.createElement('script');
    script.src = 'http://remote.com/external.js';
    document.body.appendChild(script);
}());
</script>

ご覧のとおり、外部スクリプト、external.jsがページに追加されています。

その外部スクリプトの開始時に実行を一時停止したいと思います。その外部スクリプトを編集できません。(もしそうならdebugger;、そのファイルの先頭にステートメントを挿入するだけです。)

私は現在、(上記のスクリプトの)このステートメントで一時停止しています:

document.body.appendChild(script);

このページには他のSCRIPT要素がないため、実行を再開すると、次に実行されるステートメントは外部スクリプトの最初のステートメントになります。

次のステートメントで実行を一時停止するようにChromeの開発ツールに指示するにはどうすればよいですか?「ステップオーバー」コマンドは、同じコールスタック内でのみ機能します。

これが必要な理由:(これは単なる背景です。これを読む必要はありません。)W3CのHTML5 404ページには、ページの読み込み時に呼び出される関数を含むスクリプトが含まれています。fixBrokenLink次に、この関数はfragment-links.jsスクリプトをページに動的に追加します。そのスクリプトをステップスルーしたいと思います。私の目標は、そのスクリプトが「壊れたリンクを修正する」方法を理解することです。もちろん、そのスクリプトを静的に分析することもできますが、実行中にコードをステップ実行することで、開発ツールを介してライブで実行したいと思います。それが可能だと思わなければ、私はわざわざこの質問をすることはありません。


ソリューション:

受け入れられた答えから明らかでない場合は、document.body.appendChild(script);ステートメントをステップオーバーするだけで、最後の括弧で実行が一時停止され}ます(上記のコードを参照)。その時点で、Chromeは外部スクリプトをバックグラウンドでロードするため、最終的には開発ツールに表示されます。完了したら、そのスクリプトにブレークポイントを設定し、そのブレークポイントまで実行を再開できます。

4

4 に答える 4

4
  1. 最初のスクリプト (ここでは) で、行の直後にlink-fixup.jsブレークポイントを追加します。(したがって、ここでは、 の最後の閉じ括弧行に.)appendChild(script)link-fixup.js

  2. Devtools の左上隅をクリックして、[ソース] ペインでナビゲーターを開きます。ブラウザーがスクリプトの読み込みを完了すると、読み込まれたスクリプトが一覧表示されます。

  3. ナビゲーターで、読み込まれたスクリプト (ここではfragment-links.js) を [ソース] ペインで開き、ブレークポイントを配置します。

  4. ブレークポイントに進みます。あなたは終わった!

于 2012-12-12T20:41:32.293 に答える
1

1 つのアプローチ:

コードを見て、プロパティ アクセスの 1 つを でオーバーライドしますdefineGetter。DevTools Lead の Pavel と話をしたwindow.jQueryところ、最初の JS 行についてインターセプトすることを勧められました。古いjQueryの値を保存_defineGetter_し、function() { debugger; return null; }

以下も参照してください。

しかし、私たちがそれに取り組んでいる間に、JS を評価しようとしているときに appendChild にステップインできるようにしたいというバグを報告できますか? また、Opera の「新しいスクリプトの最初のステートメントで中断する」についても言及してください。これは非常に便利です。Chrome DevTools eng チームは、このユースケースについて適切なサポートを提供したいと考えています。

于 2012-12-12T21:27:59.220 に答える
0

これは私の知る限りまだ実装されていません。ただし、専用のバグhttp://code.google.com/p/chromium/issues/detail?id=156556で投票またはコメントできます。

于 2012-12-13T17:27:22.063 に答える