Move debugger panel to Sources in Chrome DevTools?

I always have DevTools showing vertically in my browser since I use widescreen. I can no longer make the debugger panel appear below the contents of the source file.

To clarify which panel I have in mind, its Sources tab, then the debugger panel on the right, where you can see the Clock, Call Stack, Sphere, Breakpoints, etc. You know, all the useful stuff: D

This panel will only be displayed vertically next to the source files, not where it was under the source file. This means that I get both source and debugging tools in a very tall thin window, which makes it impossible to use next to the actual viewport.

Any ideas how I can move it back?

Edit: here are the screenshots (I found the old one for the "do"). Pay attention to the panel where you pause, enter on / over, etc.

Before: enter image description here

After: enter image description here

+5
source share
1 answer

Go to DevTools settings, find General > Appearance > Panel layout and change it to "horizontal".

Customize Chrome DevTools dashboard layout

+9
source

Source: https://habr.com/ru/post/1235031/


All Articles