Is there any way to hide my real version of Google Chrome on Windows and make remote server indetify my browser as mobile browser on android and my OS as Android?
What you are looking for is the changing of your 'User Agent'.
Change User Agent
To do this in Chrome you need to first open up your developer tools. (Ctrl + Shift + I)
Click the three vertical dots in the top right of the DevTools window.
Go to More Tools -> Network conditions.
You can change your user agent from the drop down.
Refresh the page.
Changing Resolution
In Chrome you need to first open up your developer tools. (Ctrl + Shift + I)
At the top of the web page there would be a drop down where you can select what device you want the browser to run as.
I have a web page loaded in a webview element in chrome, but that web page disables the right mouse menu, so I can't launch the debugger.
Is there a way to do this?
I've tried the suggestions the following to no avail :
How can I inspect element in chrome when right click is disabled?
Using Version 37.0.2062.20 beta (64-bit) on Ubuntu 14.04.
Hit F12 on keyboard
Chose magnify icon from development bar
Inspect Elements on webpage
The URL 'chrome://inspect' in chrome/chromium will open a page of 'devtools'. The 'app' item on the menu will list all running apps (and other menu items for other inspectable 'entities' like web pages/apps), and you can launch the debugger that way and get the same tools one would expect from the f12 or 'inspect element' on the right-mouse-button menu.
There are many ways to inspect the page whether the right click is enabled or disabled. This is only for the windows system.
==> When right-click is enabled
Right-click on the web page & you will find the INSPECT option at the end of the list.
Press F12 & direct inspect window will be opened.
Press ctrl + shift + I & inspect window will be opened.
==> When right-click is disabled.
Press F12 & direct inspect window will be opened.
Press ctrl + shift + I & inspect window will be opened.
Press ctrl + shift + J & inspect window will be opened.
I have HTML5 application which opens in a new window by clicking a link. I'm a bit tired of pressing Shift + I each time I want to logging network communication to launch Developer tools because I need it always. I was not able to find an option to keep Developer Tools always enabled on startup.
Is there any way to open Developer tools automatically when new window is opened in Chrome?
On opening the developer tools, with the developer tools window in focus, press F1. This will open a settings page. Check the "Auto-open DevTools for popups".
This worked for me.
There is a command line switch for this: --auto-open-devtools-for-tabs
So, on Windows, for the properties on Google Chrome shortcut, use something like this:
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --auto-open-devtools-for-tabs
Here is a useful link:
chromium-command-line-switches.
As per the DevTools docs, here's the commands for each platform from the command line:
MacOS:
open -a "Google Chrome" --args --auto-open-devtools-for-tabs
Windows:
start chrome --auto-open-devtools-for-tabs
Linux:
google-chrome --auto-open-devtools-for-tabs
UPDATE 2:
See this answer . - 2019-11-05
You can also now have it auto-open Developer Tools in Pop-ups if they were open where you opened them from. For example, if you do not have Dev Tools open and you get a popup, it won't open with Dev Tools. But if you Have Dev Tools Open and then you click something, the popup will have Dev-Tools Automatically opened.
UPDATE:
Time has changed, you can now use --auto-open-devtools-for-tabs as in this answer – Wouter Huysentruit May 18 at 11:08
OP:
I played around with the startup string for Chrome on execute, but couldn't get it to persist to new tabs.
I also thought about a defined PATH method that you could invoke from prompt. This is possible with the SendKeys command, but again, only on a new instance. And DevTools doesn't persist to new tabs.
Browsing the Google Product Forums, there doesn't seem to be a built-in way to do this in Chrome. You'll have to use a keystroke solution or F12 as mentioned above.
I recommended it as a feature. I know I'm not the first either.
On a Mac: Quit Chrome, then run the following command in a terminal window:
open -a "Google Chrome" --args --auto-open-devtools-for-tabs
Under the Chrome DevTools settings you enable:
Under Network -> Preserve Log
Under DevTools -> Auto-open DevTools for popups
With the Developer Tools window visible, click the menu icon (the three vertical dots in the top right corner) and click Settings.
Under Dev Tools, check the Auto-open DevTools for popups option
Answer for 2021:
Open the Developer Tool (CTRL+SHIFT+I on Windows)
Click the "Gear" icon. THe new Settings window will appear.
"Auto-open DevTools for popups" is now under "Preferences" section.
If you use Visual Studio Code (vscode), using the very popular vscode chrome debug extension (https://github.com/Microsoft/vscode-chrome-debug) you can setup a launch configuration file launch.json and specify to open the developer tool during a debug session.
This the launch.json I use for my React projects :
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:3000",
"runtimeArgs": ["--auto-open-devtools-for-tabs"],
"webRoot": "${workspaceRoot}/src"
}
]
}
The important line is "runtimeArgs": ["--auto-open-devtools-for-tabs"],
From vscode you can now type F5, Chrome opens your app and the console tab as well.
F12 is easier than Ctrl+Shift+I
Here's all the DevTools open shortcuts:
OS
Elements
Console
Your last panel
Windows or Linux
Ctrl + Shift + C
Ctrl + Shift + J
F12Ctrl + Shift + I
Mac
Cmd + Option + C
Cmd + Option + J
Fn + F12Cmd + Option + I
Anyone looking to do this inside Visual Studio, this Code Project article will help. Just add "--auto-open-devtools-for-tabs" in the arguments box. Works on 2017.
Use --auto-open-devtools-for-tabs flag while running chrome from command line
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --auto-open-devtools-for-tabs
https://developer.chrome.com/docs/devtools/open/#auto
I came here looking for a similar solution. I really wanted to see the chrome output for the page load from a new tab (a form submission in my case).
The solution I actually used was to modify the form target attribute so that the form submission would occur in the current tab. Then I was able to capture the network request. Problem Solved!
Yep,there is a way you could do it
Right click->Inspect->sources(tab)
Towards Your right there will be a "pause script execution button"
I hope it helps!Peace
P.S:This is for the first time.From the second time onwards the dev tool loads automatically
For Windows:
Right-click your Google Chrome shortcut
Properties
Change Target to: "C:\Program Files\Google\Chrome\Application\chrome.exe" --auto-open-devtools-for-tabs
Click ok
You will need to close all current chrome instances & end chrome processes in Task Manager. Or restart PC.
You can open dock view settings and adjust the window as you want.
Screenshot attached.
You can open Dev Tools (F12 in Chrome) in new window by clicking three, vertical dots on the right bottom corner, and choose Open as Separate Window.
In the Chrome developer panel, this tool...
lets you select elements and go directly to them in the DOM view, and see their CSS attributes.
Safari has the same tool.
Is there a keyboard shortcut to activate that tool (once you have the panel open)?
To open / switch from inspect element mode and browser window, you can do:
On Mac - ⌘ + Shift + C
On Windows / Linux - Ctrl + Shift + C OR F12
For more useful keyboard shortcuts, refer to the developer tools documentation.
The shortcut is Ctrl+Shift+C (source).
You can also right click any element in a web page and click Inspect element.
Ctrl + Shift + C for linux as well.
On Windows & Linux, to bring up the "Inspect element" pane at the bottom:
You can either use: Ctrl+Shift+C
OR you can use: F12
While you can usually right click elements in a web page and click Inspect element, it's useful to know these keyboard shortcuts for when a page has JavaScript to disable right-click in that page.
On a Mac you can use ⌘ + ⌥ + I
This is what works for me.
Here's a resource where you can find all these shortcuts
https://developers.google.com/web/tools/chrome-devtools/shortcuts
I would like to debug my javascript application using Google Chrome 3's developer tools. Everything fine and ok, until I actually want to start debugging. I can set breakpoints etc., but I don't want to debug using a mouse but using keyboard.
In Firefox + Firebug I can use F10, F11 and F8 for stepping over, into and run debugged script.
Are there any keyboard shortcuts in Google Chrome's Javascript console window?
System configuration (if relevant):
Windows Server 2008 R2 (would probably work the same in Windows 7)
Google Chrome 3.0.195.21
Edit
I investigated this issue even further and it turns out to be some sort of a bug, because when I restart Chrome, F8, F10 and F11 work as expected (same as Firebug).
F8 - Run
F10 - Step over
F11 - Step into
Works for me
To see the full list of shortcuts for the currently installed version:
in chrome open the Developer Tools Ctrl+Shift+I and then open shortcut help ?.
Edit: To get list of shortcuts, press Shift + ? when you are in other than 'console' tab, like 'Elements' or 'Resources'
In addition to Chris Tek's answer:
Shift + F11 - Step Out Of
Here is the full list of shortcuts for the latest version of Chrome Developer Tools:
http://code.google.com/chrome/devtools/docs/shortcuts.html
Toggle Breakpoint: Ctrl+B, pretty essential!
https://developer.chrome.com/devtools/docs/shortcuts
A much better reference of Chrome DevTools shortcuts can be found here (https://shortcutref.com/chrome-dev-tools).
This page only shows the relevant shortcuts (level, OS, category) and has short and precise descriptions.