Google Chromeでデバッグするときにスクリプトの実行を終了するにはどうすればよいですか?


210

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

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

更新

スクリプトの一時停止中にF5(更新)を押すと、次のようになります。

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

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

更新(2014年1月)

デバッグ中に更新:

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

進歩のようなもの!

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

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

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

更新(2015年3月)

最後に、2年以上、ほぼ1万回の表示の後、正しい答えがAlexander Kによって与えられました。GoogleChromeには独自のタスクマネージャーがあり、タブ自体閉じずにすべてのブレークポイントやその他のものをそのままにして、タブプロセス強制終了できます。

私はBrowserStack.comまでChrome v22でテストしましたが、そのときでもこれがこのように機能していることがわかりました。

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

更新(2019年1月)

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


12
タイプdebugger;のdevのツールのコンソールに、それはすぐにデバッガに物を置くと、スクリプトを停止します。
ジェイク

3
ジェームス・ジェンテスの答えは、2019年にはより良い解決策のようです
Spikolynn

1
なぜ皆が台本を止めることについて話しているのですか?これは、今後発生するすべての「後続の/スケジュールされた」コードを終了/破壊することです。
Andre Elrico

回答:


188

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

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

「プロセスの終了」ボタンを押すと、ページタスクを選択して終了できます。


4
chrome 48これは、Devツールを閉じるだけで、終了せず、再度tried setInterval()
開き

11
[その他のツール]の下に[タスクマネージャ]が表示されず、shift + escが何もしない...(Chrome 50、OSX)Shift / ESCはChrome / Windowsでも機能します...
Michael

2
うわー、私はこれをずっとずっと欲しがっていました、そしてそれは何年もそこにありました!これは、私が一年中見てきた中で最も役立つStackOverflowの回答です。
Michael Scheper

4
Macintosh(Chrome v.63)では、このオプションは3番目のグループの[ウィンドウ]メニューに表示されます。明白なキーボードショートカットはありません。
アポロ

2
これによりタブが
強制終了され

105

のとして2018年4月には、Chromeで無限ループを停止することができます

  1. 開発者ツールでソースパネルを開きます(Ctrl+ Shift+ I**)。
  2. [ 一時停止 ]ボタンをクリックして、スクリプトの実行一時停止します

また、ショートカットキーにも注意してください:F8およびCtrl+\

ここに画像の説明を入力してください


そのUIのそのような隠された宝石。
ノーバート

回答者は宇宙の秘密の鍵を持っています。
サム

ショートカットは、コンソールをチェックするために停止したいスクリプトを無限に実行している場合に特に便利です。ありがとう。
アレクセイ

@DanDascalescu Chrome 80.0.3987.149を使用していますが、外観は同じです
James Gentes

たぶん、実行状態の異なるボタンを見ているのでしょうか。私の場合は、bodyここで要素をSOで選択し、「ブレーク->サブツリーの変更」を設定して、どこでもクリックしたということです。ボタンは私が投稿したスクリーンショットのように見えます。
Dan Dascalescu

37

これを行う1つの方法は、スクリプトを一時停止することです。たとえば、現在停止している場所で次のコードを確認します。例:

var something = somethingElse.blah;

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

delete somethingElse;

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

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


3
you have to delete a function or an objectそのような厄介なハック!(UIで、[ すべて殺す ]ボタンと同じようにうまく適合ます)
Mars Robertson

それはかなり厄介ですが、私は別の方法を考えることはできません。
juacala 2015年

一年後、私は同じ質問に戻ります...そして、私はそれを理解することができません!より一般的にする方法はありますか?
Mars Robertson、

スクリプトの実行を終了する方法がわかりませんか?私はいつもこれをすることができました。この方法でスクリプトを強制終了できない例はありますか?
juacala 2015

1
@ハシム、あなたは関数内にブレークポイントを置くことができる必要があります。したがって、関数の内部が関数定義とは別の行にあることを確認してください。あなたのケースでは、コンソールで停止する必要があります。一時停止したら、「document.getElementById( 'see_older')。parentNode.removeChild(document.getElementById( 'see_older'));」と入力します。これは、JavaScriptで中断するものがないためです。残念ながら、これによりHTMLも変更されます。コードを「var el = document.getElementById( 'see_older'); \ n el.getEl ...」に変更できる場合は、単に「delete el;」を実行できます。そしてそれはそれを止めるでしょう。
juacala、2015年

11

2020年4月の更新

Chrome 80以降、現在の回答はどれも機能しません。表示されている「一時停止」ボタンはありません。停止アイコンにアクセスするには、「再生」ボタンを長押しする必要があります。

Chrome DevToolsでスクリプトの実行を停止する


2
ああ、助かった!OPの質問に対する実際の回答。
user1023110

1
@ user1023110:私は神については知りませんが、どういたしまして:)
Dan Dascalescu

5

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

debugger;

...次に、jsランタイムが生成されるか、次のブレークが発生するまで、ページは永久に実行し続けると思います。エラー時の中断モード(一時停止アイコンの切り替え)を使用している場合、次のようにすることで中断が発生することを確認できます。

debugger;throw 1;

あるいは、存在しない関数を呼び出すかもしれません:

debugger;z();

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

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

throw 1;

次に、ctrl-Rを押すと、次のスローが行われ、ページが更新されます。

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


3

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

残りのスクリプトが実行されないようにする場合(たとえば、実行されるAJAX呼び出しが原因で)、実行できる唯一のことは、その場でコンソールからそのコードを削除して、これらの呼び出しを防ぐことです実行されないようにすると、残りのコードを問題なく実行できます。

これが役に立てば幸いです!

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

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

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


手伝った?終了オプションはないようですが、次のコードの実行を防ぐために、前にコメントするか、次のコードを削除するか、Chromeデバッガー内で「ライブ」を呼び出すことができます(この後者のオプションは[続行]ボタンを作成します)ターミネートのように動作します)。私はそれらが理想的な解決策ではないことを知っていますが、私はそれらが最も受け入れられる解決策だと思います。コメントは?
–RoménRodríguez-Gil2012

1
多くの場合、実行を防止する必要があるコードは、コールスタック(現在の関数が戻った後に制御を取得する関数)です。もちろん、私は関数を呼び出しスタックまで上に移動して編集してから、非同期に呼び出される可能性のあるすべての関数を見つけて編集できます。ページ更新ボタンが押されたときに一時停止されていた場合、ブラウザがスクリプトを一時停止状態のままページを更新するのは簡単なことです。また、どのブラウザーでも予想される動作になるはずです(残念ながら、そうではありません)。
srgstm 2012年

2
実際、スクリプトの実行を終了するための回避策を見つけました!:Chromeでデバッガーを開いてアプリケーションの1つをデバッグし、ブレークポイントを設定しました。ページを実行します。実行はブレークポイントで一時停止します。次に、問題を調べて、バグの原因を理解します。実行を終了するには、URLの横にあるXボタンをクリックして(ページの読み込みを停止します)、スクリプトを続行すると(F8)、スクリプトが終了します。それを達成するためのかなり簡単な方法だと思います。これについてどう思いますか?
–RoménRodríguez-Gil2012

ChromeのXボタンは、ページの読み込み後に[更新]ボタンに置​​き換えられるため、後でXを押す方法はありません(Xを常に使用できるIEでも試しましたが、常にフリーズします)。ページの読み込み中に提案をテストしたところ、Xキーを押してからF8キーを押してもスクリプトが終了しないことがわかりました。Xが押されたときにブラウザーにまだ読み込まれていないスクリプトは後で読み込まれない可能性がありますが、それは明らかです。
srgstm 2012年

ああ、そうです、それは簡単なテストであり、代表的ではありませんでした...そして、解決策はないようです。
–RoménRodríguez-Gil2012

3

次の質問に対する @scottndeckerの回答を参考にして、Chrome は開発者ツールの下に「JavaScriptを無効にする」オプションを提供するようになりました。

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

良い点は、チェックを入れたり外したりするだけで、停止して再実行できることです。


1
あなたが開発者ツール]メニューとChromeメニューの間で混乱しているので、あなたはdownvote場合、それは:(非常に悲しいです
theFreedomBanana

私のために働いていませんでした。[JavaScriptを無効にする]ボックスをオンにしましたが、スクリプトは実行を続けます。
ポールゴルバス

1

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

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

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

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)スクリプトの実行を続行します。スクリプトはreturn false、上記のステップ(2)のテストを実行すると


ノート:

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

(B)だから、あなたはまだ、すでに実行中のコードでこのトリックを使用することができた場合、あなたがグローバル変数か、与えられた値を持っている場合はfalseを返しますオブジェクトのいずれかを持っています。

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


その他のメモ:

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

(b)コードのデバッグ時にjQueryライブラリにジャンプしないようにしたいですか?ブラックボックス。参照してくださいChromeのブラックボックスの指示を -か- Firefox用


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

Google Chromeを使用したJavascriptデバッグ行

Google Chromeでデバッグ中にjavascript変数の値を変更することはできますか?


2
Any place where you may wish to quit, test the value of this variableひどい!私がたまたま踏んでいるところはどこでもやめたいのですが、それがどこにあるのかは事前にわかりません!
マイケル

コード側で作業を行う場合は、スクリプトの実行を停止しようとするクライアントにとって、これが最もユーザーフレンドリーです。
グース

??? グローバル変数は必要ありません。ただ、このボタンをクリックしてください
Dan Dascalescu

0

これらの種類のシナリオのデバッグ中に私が非常に役立つと考えるXHRパターンで一時停止できます。

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

ここに画像の説明を入力してください


0

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

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

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

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


1
もっと良い方法があります。
Dan Dascalescu

-1

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


-1

この投稿で前述したように、この問題には適切な解決策がたくさんありますが、スクリプトに挿入するか、Chromeコンソール(デバッガ)に貼り付けてそれを達成できる小さなハックを見つけました:

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

これにより、を押すと実行が一時停止しますF12


(うまくいけば)jQueryを使用しないとどうなりますか?
Dan Dascalescu

その後、...のkeydownイベントを取得するには... document.addEveneListnerのように、純粋なJavascriptを使用
マータザ・フセイン
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.