How can I keep the "Console Drawer" hidden by default every time I open Chrome DevTools?

M

14

77

When I have DevTools open, there is a little button that toggles Hide Drawer. and Show Console.. Besides being inconsistently named, the 'drawer' is very annoying to me because it takes up so much of the little screen real estate allotted for devtools (i'm bottom docked). How can I keep this 'drawer' closed permanently? Or if I can't do that, can I at least keep the height of it as low as possible? (it returns to a default height every time I open it)

Manolete answered 28/12, 2013 at 21:40 Comment(12)

Are you using Canary? I think it is a bug in Canary. Stable Chrome has the drawer hidden every time you open the DevTools. – Overdraft 28/12, 2013 at 21:57

Screenshot? Browser version? It's called "Show console" and "Hide console" in my Chromium browser (v31.0.1650.63). – Guernica 28/12, 2013 at 21:59

Version 32.0.1700.41 m Aura – Manolete 28/12, 2013 at 22:44

apparently my chrome install is part of an a/b test? productforums.google.com/d/msg/chrome/zmgiVCv9X0A/HXmhMIYzc1YJ – Manolete 28/12, 2013 at 22:47

I'd be happy not to be part of it - you're right the drawer is very annoying and can't be customised. :/ – Weiler 13/1, 2014 at 12:21

I'm having this exact problem too. Does anyone know the best way to contact the chrome team about this sort of thing? – Paladin 16/1, 2014 at 23:49

This thing making me angry and I cannot do anything about it – Charwoman 17/1, 2014 at 9:30

Same problem here.... so annoying! – Hoopla 17/1, 2014 at 10:37

Darko just added an answer to this question. It worked for me. – Manolete 18/1, 2014 at 4:10

It doesn't remember the size you give it, and it also pops up when it detects an error (not just because of emulation). – Nervine 17/3, 2014 at 15:2

In version 32.0.1700.107, it starts off as "Show drawer.", then cycles between "Hide drawer." and "Show console.". (See inspector.js.) – Anima 31/3, 2014 at 14:9

It seems that a combination of the answers below might be required as was the case for me. – Unholy 1/9, 2014 at 16:23

H

37

I solved same problem removing the flag from "Spoof user agent" option under the "Emulation" tab (I don't even know why it was flagged!).

Hoopla answered 17/1, 2014 at 13:25 Comment(3)

I also had to uncheck 'Emulate Screen' – Rare 27/1, 2014 at 17:59

Under the emulation tab, enabled options are flagged with a blue check on the left side. – Ghost 6/3, 2014 at 14:33

There is no emulation tab. – Noreen 1/11, 2016 at 21:3

N

79

At least you can press ESC to toggle the console area hide and show.

Nominal answered 29/12, 2013 at 21:24 Comment(5)

This is the solution that worked for me! Simple fixes are the best fixes – Saturnalia 30/10, 2015 at 19:7

That's not an answer, it keeps popping out everytime the page is refreshed. – Mentally 18/3, 2016 at 12:5

It's annoying press esc every time that you want to hide the console. Should be a way to have the console hide by default (with or without errors) – Paulie 23/5, 2016 at 10:1

If you get rid of it, how do you get it back? – Allnight 13/12, 2016 at 9:39

Every version of Chrome seems to keep making minor changes. – Overheat 12/1, 2022 at 17:15

E

70

None of the previous answers worked for me. All of my emulation tab options are cleared/reset. I'm not sure if it's new but it turns out that there is a "Toggle emulation" button on the left side, next to the search icon. Mine was blue so I clicked on it to make it non-blue. Screenshot is below. Now, all is happy. That was so frustrating!

"Toggle emulation" button highlighted in red

Embodiment answered 21/8, 2014 at 14:52 Comment(1)

This is the one that fixed my issue. – Chamfron 16/9, 2014 at 18:0

H

37

I solved same problem removing the flag from "Spoof user agent" option under the "Emulation" tab (I don't even know why it was flagged!).

Hoopla answered 17/1, 2014 at 13:25 Comment(3)

I also had to uncheck 'Emulate Screen' – Rare 27/1, 2014 at 17:59

Under the emulation tab, enabled options are flagged with a blue check on the left side. – Ghost 6/3, 2014 at 14:33

There is no emulation tab. – Noreen 1/11, 2016 at 21:3

J

23

Apparently there is a show / hide console button next to the setting button. info and screenshot here - https://developers.google.com/chrome-developer-tools/docs/console#opening_the_console

Jewfish answered 5/3, 2014 at 10:38 Comment(1)

This moved, now you just click the three dots in the upper right and Show/Hide console is a menu option. – Rusert 30/9, 2015 at 1:13

O

21

My problem was that the Console was enabled in the chrome menu, you can turn it off by clicking on the Console option in the dev tools settings:

Octa answered 9/12, 2015 at 13:39 Comment(1)

Hallelujah, out of ALL of the above, this worked for me. – Crosspollination 21/3, 2016 at 4:16

O

9

THIS SOLUTION NO LONGER WORKS WITH NEW CHROME VERSIONS. THE ICON WAS REMOVED. The working solution was pasted above by Sigma. Pressing the ESC key will toggle the visibility of the panel.

I notice the majority of these answers are over a year old. I had a similiar issue and it's August 2015.

I was overlooking a simple icon: The >_ next to the gear.

You can see the video of the window being shown and hidden to confirm this is the same issue: http://www.youtube.com/watch?v=QOC863BxZNM&hd=1

Overheat answered 6/8, 2015 at 3:23 Comment(5)

As of August 2015 (Chrome Version 46.0.2478.0 dev-m (64-bit) on Windows), this solved the issue for me, thanks! – Schiller 15/8, 2015 at 16:24

This is the most up to date answer – Conah 10/9, 2015 at 19:19

I believe the reason the majority of people randomly getting this drawer open is because they are hitting the escape key. The Escape key will toggle this window when the developer console is open. – Overheat 11/9, 2015 at 20:16

That icon is no longer there. – Dvandva 4/3, 2016 at 16:39

For me it seems to want to pop back open every time I refresh the page, it's very irritating because I have the tools docked to the bottom and it blocks out almost the entire area. – Boatman 16/6, 2016 at 21:46

S

6

When the "drawer" is open look into the "emulation" tab, then click on "reset." Close dev tool (F12) and then reopen it (F12). The "drawer" is hidden by default.

My Chrome Version: 32.0.1700.77

The response of Darko works, I propose another way to solve this problem.

I hope this helps someone.

Sauger answered 21/1, 2014 at 15:47 Comment(0)

C

2

click Restore Defaults and Reload in Dev tools Setting right bottom

my chrome version is 37

in my case reset in emulation does not worked although i had tried it recently and it was the root cause

Cascara answered 19/9, 2014 at 16:54 Comment(0)

F

2

In latest chrome there is a "Show What's New after each update" setting (preferences->appearance). Once you untick it, the console finally won't pop up anymore.

Flickinger answered 10/10, 2020 at 19:52 Comment(0)

H

1

It is because Spoof User Agent is enabled in your Emulation-tab in the drawer.

Deselect the options below

The spoof user agent

Hospice answered 24/1, 2014 at 8:38 Comment(0)

P

0

I had the same problem, and also a frame around the page with pixels lenght of page (kind of rulers if you use PSD) with options for device width. I've solved clicking on restore default options. Hope can help someone.

Picador answered 15/10, 2014 at 9:4 Comment(0)

S

0

I had to uncheck that box shown in circle in the newest chrome version (38.*).

Hide console

Stylolite answered 22/10, 2014 at 20:33 Comment(0)

C

0

If you ever right click one of the dev tool tabs and do "move to bottom" then you have just enabled the horrid "console drawer" which is the bottom set of tabs. To fix this open the dev tools (F12), then click the ellipsis (...), then click show console drawer. A second set of tabs opens. Right click all tabs there except for the console and select move to top.

Cnidus answered 28/7, 2023 at 21:24 Comment(0)

E

-1

Chrome (114.0.5735.110): Simply click that x to close the drawer. (See screenshot below)
Edge (114.0.1823.43): Click that collapse button. (See screenshot below)
Last resort (incase none of the above works for you)
1. Click F12 or whatever your shortcut is to toggle devtools.
2. Close all tabs except Console on the drawer.
3. Switch to Console panel at the top.
4. Now when you re-open devtools, the drawer should be minimized by default.

Elfredaelfrida answered 11/6, 2023 at 14:14 Comment(0)

Recommended topics

Hot tags