Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Devtools of Chrome/Edge are "jumping" to the sources tab

One thing is annoying me already a longer time and I could not find out how to change this. Whenever I am developing my web apps, the dev tools of Chrome always jump to the "sources" tab automatically (in german: "Quellen" like in my gif animation.)
This tab is not interesting for me, because I am debugging with VS Code already.
I want to see the output of the console or the network tab all the time.

But the browser always jumps there and I always have to go back to my wanted tab if I am reloading the page.

I demonstrated this behaviour here with a gif animation:

enter image description here

Any idea how to change this annoying behaviour? Or is there a good reason for this?

like image 765
David Mason Avatar asked Sep 06 '25 21:09

David Mason


2 Answers

I had the same issue. Solved doing : DevTools options -> sources -> uncheck "Focus Sources panel when triggering a breakpoint"

like image 117
Devip Avatar answered Sep 09 '25 13:09

Devip


Even though @Devip answer fixed the annoyance of source tab automatically being focused, it did not fix actual issue - source tab would still automatically open and close files.

In my case the issue was that I had breakpoints set in VSCode itself, rather than DevTools. (not sure if it's relevant, these breakpoints were unbound because I was working on a userscript, which can't be mapped to the browser). The DevTools would simply flash debugger paused message for a split of a second and open a file in the source tab. In some cases it would open and immediately close files. I couldn't figure out why these files were opened...

My solution was to remove ALL breakpoints in VSCode and restart debugger session.

like image 39
vanowm Avatar answered Sep 09 '25 13:09

vanowm