32

If I put the debugger statement in my JavaScript source with the Chrome devtools open, it'll stop execution so I can interactively explore the current context from the console. It's really awesome.

But unfortunately it will also switch to the Sources tab and display the line where the debugger statement happened. Most of the time, I want to type JavaScript commands, so I have to manually switch back to the Console tab.

Can I avoid the tab-switching and stay in the Console tab?

Or am I using it wrong?

Jo Liss
  • 30,333
  • 19
  • 121
  • 170
  • 1
    I think debugger performs the same action every time. But pressing "ESC" shows the console when in Sources. I never find myself using the Console tab, because debugging involves 'stepping' 90% the time anyway. – joecritch Sep 27 '12 at 16:48
  • I gave you my answer, but may I ask you why you use `debugger` instead of a more flexible breakpoint? – MaxArt Sep 28 '12 at 15:31
  • Thanks for your answer, and @joecritch too! I use `debugger` instead of breakpoints because I usually have my source open in my editor (in CoffeeScript actually), so it's easy to add a `debugger` line. I'd have to navigate through the Sources tab to locate the point I'm interested in in order to set a breakpoint, so that takes much longer. – Jo Liss Sep 28 '12 at 16:12
  • 1
    I noticed the same problem and reported it as a "bug" https://bugs.chromium.org/p/chromium/issues/detail?id=609248 – kzahel Mar 21 '19 at 17:53
  • 2
    This is one of the worst design decisions by Google. I'm finding myself constantly switching back and forth between tabs. Like the OP, I just want the tab to stay on 'console'. Please give us the option so we can decide if we want the default behavior or not. – Stack Undefined Aug 07 '20 at 15:14

3 Answers3

31

Right-click on the source-tab and select 'move to bottom'. enter image description here

Shirantha Madusanka
  • 1,461
  • 1
  • 11
  • 16
18

Looks like Chrome added a preference for this in the intervening 9 years: https://stackoverflow.com/a/69216922/66673

Quoting that answer:

I had the same issue and it was driving me nuts! The way I managed it to stop switching was to go to into the DevTools settings -> Preferences.

Under Sources options, uncheck Focus Sources panel when triggering a breakpoint.

Nick Farina
  • 4,470
  • 2
  • 32
  • 30
  • Stupid, annoying default behavior by Chrome--I had no breakpoint, yet it does the dev-tools-tab-focus-to-Sources with every interaction of my UI. Maddening – Lee Cichanowicz Aug 09 '23 at 19:54
-2

There's a reason for that - and is that whenever the code has stopped, because of a breakpoint or a debugger statement, you'd usually want to actually see where the execution has stopped. So, the developer tools switches to the Scripts/Sources tab, and this is a common behaviour among the major browsers, that may also show the local variables, the call stack and so on.

The best thing you can do is to keep the console frame always open, so you're ready to work. Just press Esc or click on the second icon on the lower left corner. That's what I usually do.

Switch to the Console tab when you expect to get a large response from the command you type.

MaxArt
  • 22,200
  • 10
  • 82
  • 81