動的に追加されたjavascriptファイルのデバッグ

Question

私はリアルタイムでajaxを使用してオプションを選択することに基づいて、javascriptファイルを動的に追加するWebアプリケーションを持っています。

Google Chromeの開発ツールとFirebugのFirefox用プラグインの両方を試してみましたそれらはブレークポイントなどを追加する。

それでは、動的に追加されたjavascriptファイルをデバッグするための解決策がありますか？

Answer 1

ブレークポイントを設定する動的スクリプトにdebugger;ステートメントを追加できます。デベロッパーツールのUIが開かれている間に実行スレッドがステートメントに達すると、これにより通常のブレークポイントのようにクロムが停止します。

スクリプトを起動して、デバッガにスクリプトが表示され、その後で手動でブレークポイントを設定することもできます。

Answer 2

これは、DevToolsにevalされた文字列を実ファイルとして扱わなければならないことを示す方法です。sourceURLをチェックしてください。それはまさにあなたが探しているものです。

evaledする文字列の終わりに、この形式のコメント残し：クロームデベロッパーツール（とFirebugは）、そこから

//# sourceURL=app/js/myapp.js 

を「本当のファイル」としてこれを扱います。

Much more explanation hereとHTML5岩はan articleとsourceURL demoです。