chrome developer tools does not display? - google-chrome

I'm using Version 80.0.3987.116 (Official Build) (64-bit) on Microsoft Windows [Version 10.0.17134.1304]. The Chrome Developer Tools simply do not appear for me no matter which way I try to access them:
ctrl+shift+i
f12
ctrl+shift+j to open the last used panel
ctrl+shift+c to open the elements panel
right click on a web page and select inspect from the popup
menu dots menu -> more tools ->
developer tools
I've restarted my computer. I've gone into settings -> advanced settings and restored all settings to their original defaults, then restarted chrome. This disables all extensions, so even with all extensions disabled it still didn't display. I've cleared the cache.
It was all working last Friday, but not when I tried Monday.
Has anyone seen this or have any other troubleshooting ideas? The only other thing I can think of is uninstall with something like Revo Uninstaller to scrape the registry and filesystem, then in my profile zip up then delete %userprofile%\AppData\Local\Google and %userprofile%\AppData\Roaming\Google. That seems extreme if there's an easier way.
Anyone seen anything similar?
Thanks!

I feel stupid figuring this out so quickly after posting the question. But if anyone else finds this, here's what worked for me.
ctrl+t to open a new tab
enter chrome://flags/ in the address bar
click reset all to default
let chrome restart
I'm not sure which flag was set that caused this. When I searched for devtools, there were three available settings, and they were all set to either disabled or default. And that's what they were after I did a reset all too. So whatever broke it was some other setting.

Related

Chrome Dev Tools Snippets - AUTOSAVE

Is it possible to enable autosave on snippets in chrome dev tools?
It is infuriating when i accidentaly close a tab that dev tools was attached to where i had my snippets open and when i open dev tools again i've lost alot of work!
Are there any flags i can set to enable autosave or somehow get it to save when i run the snippet?
Just to be clear i am talking about the snippets under Sources/Snippets.
I know i can "just" use the shortcut ctrl-s to save however that is simply not good enough, i would atleast expect a recovery like all modern editors deliver.
Incase this cannot be achieved please point me the in direction where i can submit a feature request to the Chrome Dev Team
Select Tools > Developer Tools. The Developer Tools window opens as a docked panel at the side or bottom of Google Chrome. Click the Network tab. Select Preserve log.
Also, go to Settings in devtools, which is a little screw on the top-right corner, find the Console section under Preferences, and click on Preserve log upon navigation.
This has worked for me.

Chrome extension added but not in extensions list

I created and uploaded a Gmail extension to the Chrome Store and have been trying to test it. I deleted it from my extensions list in Chrome and when I went to go re-download it from the Web Store it said "Added to Chrome" and would not let me re-download it. I found a few solutions that described how to delete cached data on a PC, but I'm using a Mac. Any ideas?
I'm a total newbie at this so any help would be appreciated. Also not a very strong Mac user. Thanks!
Try to restart your Chrome browser, if the extension still not exist, reset the chrome settings to default, you need to do this if apps or extensions you installed changed your settings without your knowledge. Your saved bookmarks and passwords won't be cleared or changed.
Open Chrome.
In the top right, click the icon menu
Click Settings.
At the bottom, click Show advanced settings.
Under the section "Reset settings,” click Reset settings.
In the box that appears, click Reset. ​

How can I change icon for Chrome Developer Tools?

As you probably know, Chrome Dev Tools has the same icon as browser itself. In order, to increase productivity I would like to change it's icon, so it will be easier to find it in the taskbar.
Thanks in advance.
Give this a try:
Open up Chrome and then open up developer tools in another window so that you have two Chrome icons on your taskbar. Right click the devtools one and Pin to taskbar.
Right click on the newly pinned icon, right click on Google Chrome (2) and properties.
Under Shortcut->Change Icon, pick something else. Then 'OK' out.
You'll need to restart explorer.exe, so open Windows Task manager, kill explorer.exe and restart it.
You'll now see two different icons.
Do this: Start regular Chrome. Then CTRL+Shift+i and it should open devtools as the new icon.
Unfortunately, clicking the devtools icon initially will not open devtools on startup. Supposedly you can change the properties to start using chrome.exe --args --auto-open-devtools-for-tabs but I was unable to make that work.
YMMV with your operating system but this works with Windows 7. Hope that helps.
Note: If you're using Windows 10, you won't see explorer in the task manager by default, you have to click "More details" on the bottom and switch to the "Details" tab.
Alternatively, open PowerShell and type:
Get-Process explorer -ErrorAction SilentlyContinue | Stop-Process
This will kill explorer, and windows will automatically restart it
This answer may be a nice work around for non-Windows users who are debugging from Visual Studio Code. It uses Chrome's Canary build for debugging. It has a different icon so telling it apart from regular Chrome should be easy.
This answer talks about setting the executable to Canary which is easily distinguishable from regular Chrome. You will need to download the Canary version of Chrome first.
settings.json:
"runtimeExecutable": "canary"
How to configure Visual Studio Code debugger to use Chrome Canary?

Chrome dev tools settings: where is the Experiments tab to Allow custom UI themes?

I am using chrome version 36+
according to this page, I should be able to allow custom themes using the following instructions:
Installation Instructions
Add this theme
Goto chrome://flags and Enable Developer Tools experiments.
Open developer tools settings, select Experiments tab, and check 'Allow custom UI themes'.
Reload devtools.
I do not see such a tab in the dev tools settings. I see only 'general', 'workspace', and 'shortcuts'
These are some simple steps to follow, hope it will be helpful.
Open a new chrome tab, type chrome://flags
Find, "Enable Developer Tools experiments." using ctrl/cmd+f or simply searching for it by scrolling down the page.
Click the "enable" link
Click on "Relaunch Now" at the bottom of the page.
After restarting Chrome, open DevTools, DevTools settings, and select the experiments tab.
Now select the experiment you want (e.g. "Allow custom UI themes").
You need to reload devtools after: Alt-R will reload devtools itself, or you can just close and reopen it.
To get to the Dev Tools Experiments area you have to click on the gear icon in the inspector.
If still not working you should go to:
chrome://extensions/
And click the 'Enable' checkbox for the DevTools extension you wish to enable.
Had the same issue,
I found I was going to browser settings which is NOT where you should be going to ,
You need to go to developer setting .
i.e right click>inspect element> dev tools
You need to restart the browser after changing the flag at chrome://flags
I found it. There is a checkbox under experiments tab:
Allow custom UI themes
Restart chrome just not means to close the chrome and then open it. you should click the 'Relaunch Now' button of the flags tab. and then it's work for me.
loislo's answer is absolutely right (You need to restart the browser after changing the flag at chrome://flags). But notice that your chrome can work in the background. Go to the tray, look for the chrome icon and exit.
Navigate to chrome://flags/
Find and enable Developer Tools experiments Mac, Windows, Linux, Chrome OS
Relaunch Chrome, open develop tool, setting, you will see experiments tab.
My Chrome version: Version 61.0.3163.100
2022 update: There doesn't seem to be any option in chrome://flags but there is an option:
devtools > settings > experiments > Allow extensions to load custom stylesheets

Chrome Developer Tools window not appearing

I'm having an issue with getting Chrome's Developer Tools to work on my machine.
I've tried both Chrome Version 37.0.2026.0 canary and Version 35.0.1916.114 m and both have slightly different problems - I'm using Windows 8.1.
In the standard installation of Chrome, the Developer Tools options are greyed out. I've searched this everywhere and there is a Google post saying to enable it in your registry settings. When I go into my registry, there is nothing relating to Google in the path they've specified - [http://www.chromium.org/administrators/policy-list-3#DeveloperToolsDisabled][1]
In the Canary version of Chrome, the Developer Tools options appear and are not greyed out or anything, but absolutely nothing appears when I click it (no window, no error, nothing).
Anyone have any ideas? I've tried restarting the machine, clearing my cache, reinstalling Chrome but no solution..
I'll keep looking for a solution and post it if I find anything!
Thanks in advanced.
Ohhhh! I went through my Chrome settings again and noticed that Javascript was being "enforced by my administrator"
I figured out what it was (so stupid): We use Google Apps where I work and it's been disabled in the Admin Console. You definitely pointed me in the right direction though!