web-dev-qa-db-ja.com

Google Chromeでデバッグするときにスクリプトの実行を終了する方法は?

Google ChromeデバッガーでJavaScriptコードをステップ実行する場合、続行しない場合にスクリプトの実行を終了するにはどうすればよいですか?私が見つけた唯一の方法は、ブラウザウィンドウを閉じることです。

[このページを再読み込み]を押すと、残りのコードが実行され、F8 [続行]を押したようにフォームが送信されます。

UPDATE

スクリプトの一時停止中にF5(更新)を押すと:

  • Google Chrome(v22)はスクリプトを実行します。スクリプトがHTTPリクエストを送信すると、そのリクエストのHTTPレスポンスが表示されます。元のページは更新されません。
  • IE 9はフリーズするだけです。ただし、IEには「Stop Debugging」オプションがあり、これを押すと(以前にF5を押さなかった場合)、デバッガーの外部でスクリプトを実行し続けます。
  • Firebugの動作はChromeと同じです。

ブラウザウィンドウを閉じてから再度開くことは、ブラウザセッション状態を強制終了するため、常に次に簡単な方法とは限りません。これは重要な場合があります。すべてのブレークポイントも失われます。

更新(2014年1月)

デバッグ中に更新:

  • Chrome v31:スクリプトを実行し、さらにブレークポイントで停止します(ただし、ajaxリクエストは送信しません)。その後、更新します。
  • IE 11:更新は何もしませんが、F5を押して続行できます。
  • Firefox v26:スクリプトを実行できますが、それ以上ブレークポイントで停止せず、ajaxリクエストを送信してから更新します。

進歩の種類!

デバッグ中に同じページに移動します。

  • Chrome v31:更新と同じ。
  • IE 11:スクリプトは終了し、新しいブラウザーセッションが開始されます(閉じて再び開くのと同じです)。
  • Firefox v26:何も起こりません。

また、juacalaは効果的な回避策を提案しました。たとえば、jQueryを使用している場合、コンソールからdelete $を実行すると、jQueryメソッドが検出されると実行が停止します。上記のすべてのブラウザでテストし、動作していることを確認できます。

更新(2015年3月)

最後に、2年以上、ほぼ1万回のビューの後、正しい答えがAlexander Kによって与えられました。GoogleChromeには、タブプロセスwithoutタブ自体を閉じ、すべてのブレークポイントおよびその他のものをそのまま保持します。

Chrome v22でテストするためにBrowserStack.comまで行ったところ、その時点でもこの方法で機能していることがわかりました。

Juacalaの回避策は、IEまたはFirefoxでデバッグする場合に引き続き役立ちます。

更新(2019年1月)

最後に、Chrome Dev Toolsは、スクリプトの実行を停止する適切な方法を追加しました(少し隠れていますが)。詳細については、James Gentesの回答を参照してください。

182
srgstm

Chromeには「タスクマネージャ」があり、そこからアクセスできます。 Shift+ESC またはを通して

メニュー→その他のツール→タスクマネージャ

あなたはあなたのページ仕事を選択して、そして「プロセスの終了」ボタンを押すことによってそれを終えることができます。

170
Alexander K

2018年4月、Chromeでは無限ループを止めることができます

  1. ソースパネルを開きます。
  2. 一時停止をクリックします。ボタンがスクリプト実行の再開に変わります。
  3. 保留スクリプト実行の再開を選択し、次に現在のJavaScript呼び出しを停止を選択します。
50
James Gentes

そのための1つの方法は、スクリプトを一時停止し、現在停止している場所でどのコードが続くのかを確認することです。

var something = somethingElse.blah;

コンソールで、次の操作を行います。

delete somethingElse;

次にスクリプトを実行します。somethingElseにアクセスしようとすると致命的なエラーが発生し、スクリプトが終了します。さて、あなたはスクリプトを終了しました。

編集:もともと、私は変数を削除しました。それは十分ではありません。 JavaScriptがプロパティにアクセスしようとしている関数またはオブジェクトを削除する必要があります。

37
juacala

@scottndeckerの回答を参照して、 question を参照すると、chromeはDeveloper Toolsの下に 'disable JavaScript'オプションを提供します。

  • 右上の垂直方向の...
  • 設定
  • そして「設定」の下の一番下にある「デバッガ」セクションに行き、「JavaScriptを無効にする」を選択します。

良い点は、チェック/チェック解除するだけで、停止して再実行できることです。

4

良い質問です。スクリプトの実行を中止することはできないと思います。私はそれを探したことは一度もありませんが、私は仕事でかなり長い間クロムデバッガを使ってきました。私は通常、JavaScriptコードにブレークポイントを設定してから、興味のあるコード部分をデバッグします。そのコードのデバッグが終了したら、通常は残りのプログラムを実行するか、ブラウザを更新します。

スクリプトの残りの部分が実行されないようにしたい場合(たとえば、AJAX呼び出しが行われるため)できることは、削除することだけです。コンソールでそのコードをオンザフライで実行することで、それらの呼び出しが実行されるのを防ぎ、残りのコードを問題なく実行できます。

これが役に立つことを願っています!

P.S:次のようなチュートリアル/ガイドで実行を終了するオプションを見つけようとしましたが、見つかりませんでした。前述したように、おそらくそのような選択肢はないでしょう。

http://www.codeproject.com/Articles/273129/Beginner-Guide-to-Page-and-Script-Debugging-with-C

http://www.nsbasic.com/app/tutorials/TT10.htm

debuggerステートメントの使用中にこれに遭遇した場合は、

debugger;

...そして、私は、jsランタイムが降りるまで、または次の改行まで、ページは永遠に実行され続けると思います。ブレークオンエラーモード(一時停止アイコンの切り替え)になっていると仮定すると、代わりに次のようにしてブレークを確実に実行できます。

debugger;throw 1;

あるいは、存在しない関数を呼び出すこともできます。

debugger;z();

(もちろん、これは関数をステップ実行しようとしている場合には役に立ちませんが、おそらくソースパネルでthrow 1またはz()またはsomesuchを動的に追加し、ctrl-Sを保存してからctrl-Rを更新します。しかしこれは1つのブレークポイントをスキップするかもしれませんが、あなたがループしているならうまくいくかもしれません。)

ループを実行していて、debuggerステートメントをもう一度トリガーすることを期待している場合は、代わりにthrow 1を入力することができます。

throw 1;

それからctrl-Rを打つと、次のスローが打たれ、ページが更新されます。

(2017年4月頃、Chrome v38でテスト済み)

3
ninjagecko

それはできますが、最初にコードを準備する必要があります。

Googleでスクリプトの実行を停止する手順Chrome Dev Tools:

(1)global変数を作成して、最初にコードを準備します。

var devquit=0;
$(document).ready({
    //the rest of your code

(2)終了したい任意の場所で、この変数の値をテストします。

//Lotsa code
if (devquit > 0) return false;

(3)上記のテスト行の前または前にスクリプトの実行を一時停止します

(4)コンソールへの切り替え

(5)タイプ:

> devquit
0
> devquit=1   <=== only this line is necessary
> devquit
1

(6)スクリプトの実行を継続します。スクリプトは、上記のステップ(2)からテストを実行するとreturn falseします


ノート:

(A)このトリックはグローバル変数とオブジェクトで機能しますが、ローカル変数では機能しません。 これに注意してください:
newVar = 'never used before';
ウィンドウオブジェクトの新しいプロパティを作成します(上記のトリックで動作します)、
var newVar = 'never used before';
ローカル変数を作成します(上記のトリックでは動作しません!)

(B)したがって、すでに実行中のコードifでこのトリックを使用できますグローバル変数、または指定された値がある場合にfalseを返すオブジェクト。

(C)ピンチでは、juacalaのトリックを使用して、DOM(要素タブ)からjavascriptエラーを引き起こす要素を削除できます。たとえば、コードがvar cartype = $('#cartype').val();の場合、コードのその行の前にID = cartypeの要素を削除すると、jsはその行で中断します。 ただし、コードを再実行しようとすると、要素は失われます。トリック上記の説明により、コードを無限に実行および再実行できます。


その他のメモ:

(a)コードにブレークポイントを挿入します。1行にdebugger;と入力するだけです。 DevToolsが開いている場合、スクリプトはその時点でデバッガーにジャンプします。 DevToolsが開いていない場合、コードはステートメントを無視します。

(b)コードをデバッグするときにjQueryライブラリにジャンプしないようにしたいですか?それをブラックボックス。 Chromeのブラックボックスの手順 -または- Firefoxの場合 を参照してください。


感謝(訪問して賛成してください):

Google Chromeを使用して行ごとにJavascriptをデバッグする

Google Chromeでデバッグ中にJavaScript変数値を変更することは可能ですか?

2
cssyphus

不正なループがある場合は、Google Chromeデバッガでコードを一時停止します([Sources]タブにある間は小さい「||」ボタン)。

Chrome自体に戻り、[タスクマネージャ](Shift + ESC)を開き、タブを選択して[プロセスの終了]ボタンをクリックします。

Aww Snapメッセージが表示されたら、リロードできます(F5)。

他の人が指摘したように、一時停止の時点でページをリロードすることは不正なループを再起動することと同じであり、デバッガもロックすると厄介なロックアップを引き起こす可能性があります。でもPC)。デバッガには「停止」ボタンが必要です。 Nb:受け入れられた答えは時代遅れで、そのいくつかの側面は明らかに間違っています。あなたが私を投票した場合、plsは説明しています:)

1
www-0av-Com

この記事で前述したように、この問題には適切な解決策が多数ありますが、スクリプトに挿入したり、Chromesコンソール(デバッガ)に貼り付けたりしてそれを実現できる小さなハックを見つけました。

jQuery(window).keydown(function(e) { if (e.keyCode == 123) debugger; });

F12を押すと実行が一時停止します。

0
Murtaza Hussain

「開発者ツール」のソースタブを開き、実行中のスクリプトの行番号をクリックすると、ブレークポイントが作成され、デバッガはそこでブレークします。

0
Todd

あなたは私がこれらの種類のシナリオをデバッグする間非常に役に立つと思うどんなXHRパターンでも一時停止することができます。

たとえば、 "/"を含むURLパターンにブレークポイントを設定しました

enter image description here

0
Abhi