This is a minor annoyance but I can't seem to find any solution.
I don't really like the console "drawer" (the console you see when you hit "Esc") and prefer to use the tab/page as I don't have a lot of space to devote to the developer tools. When you load a page with errors or warnings there's little icons on the far right that indicate counts of each, but when you click on that it always opens the "drawer" version of the console instead of the tab/page version. Is there any way to change this? (I vaguely recall that it used to always open the tab/page version before)
No, there is no way to customize such behavior. One thing you could do to slightly speed up things is to re-arrange panels in DevTools so that it is easier for you to get into "Console".
Related
EDIT: Please stop suggesting to clear the cache. That will obviously not solve anything for the users who may have visited the site before.
I know how to force the browser to use the latest CSS version. This is not what I'm asking.
I also know how to clear the cached images on the browser. This is also not what I'm asking.
I also know this could be solved by changing the name of the image. I don't want to do that.
It surprises me not being able to find an answer to this issue anywhere since I came across this problem multiple times.
When replacing an image such as a logo that's on every page of an old website, you may want to simply replace the image without changing its name so you don't have to change the image name on every HTML page.
The problem is that Chrome continues to show the old version of that image no matter how many times you refresh the page.
It's the only browser I know that does this. It's incredibly annoying.
Isn't there a way to force Chrome to show this change, or even request Google to update the image that has been replaced?
Thanks.
ctrl shift i (to open the developers tool)
click network
check the disable cached data from the top of the window
or u can use the shortcut i think ctrl R (i am not sure of it) but using the developer tool ->network ->disabling cache then refreshing the page works fine 100%
I'm working on debugging the script of a page I visit (I'm looking to modify its functionality with Tampermonkey) and I am trying to set breakpoints on some code. This code was minified, so I clicked the "prettify" button and now I can use a formatted version of it instead for debugging.
The first breakpoint was able to be set at the right line, but the next would not stick and would instead appear about a hundred lines further down. This seems to be a bug that has been plaguing Chrome Developer Tools for a while and complaints keep on popping up about it. How can I get it to set breakpoints where I want them to be set?
ETA: The breakpoint goes back to the right place when it is DISABLED, then goes back to the wrong when it is re-enabled.
Minifiers apply various optimizations on your code, such as combining concatenated statements into a single expression using the Comma Operator. If you try to break in the middle of that expression, the debugger will jump to the next statement instead. See the example below from a script on this page.
There is some discussion on implementing sub-expression breakpoints into V8 here, but this hasn't been implemented as of yet.
I usually have three chrome windows open. To easily distinguish my work chrome from the personal chrome window, I would like to set a theme to one window, and another theme to other windows.
I figure out how to change the theme globally, wondering whether its possible to it per window.
Use different profiles. You can do this in chrome by clicking the Proflile icon in the top-right of any window. It'll ask you to log in with your Google account but you're able to make a local account with any name.
I use one for personal (personal google account), one for work (work google account), and a third with no google account for risky or other website browsing (which has more aggressive blocking rules)
I do have in mind 2 options, since I really want to easily identify them.
You can add name to your window, not so noticeable since only shows on hover on mac.
You can also group all the tabs in that window, to give it a bit of a different color
which you can see here. blue and red. Bit noticeable.
for windows users, can you try this options, it might be better there.
I did some research into this issue, and it seems the only way to do this is to open different browsers e.g - firefox for presonal stuff, chrome for work etc...
will be happy to see a better solotion though...
Google chrome dev panel has many nice shortcuts and I've got used to them a lot.
There is almost only one thing what bothers me a lot and makes cry every time I have to do it:
I need to use mouse to switch state of all debug points at once.
For this I use now a button as shown on the following screenshot:
I wonder. Is there any other way to active/deactivate this button without mouse?
P.S.
Also this question is more about usage rather than programming I decided to ask it here because it's more likely to be answered by programmers.
Thanks.
On Mac you can toggle breakpoints with ⌘+F8
You must be able to toggle between enable/disable all the breakpoints (debugging rather) using Ctrl+F8 on any windows machine with Chrome as the browser of choice.
First of all, I'm swiss, so forgive me if I mistake; My english is not so rich.
In tiapp.xml file I can see this directive <chrome scrollbars="true">true</chrome>.
It means that tideSDK uses Google Chrome? Or what else?
In other words: there is the possibility of missing functionalities depending the final user's configurations(Google Chrome not installed)?
Excuse me for the stupid question but I did not understand.
Chrome means the look - the outer decoration of the window. Another word might be "skin".
Enabling/disabling tells the framework to add the OSes native window decoration to a window - scaling borders on each side, a title bar with the window name, as well as min/max/close buttons - all this is part of the window chrome.
If you want to create 100% custom looking windows, you have to disable the window chrome.
Heads up! Scaling and moving of the window is automatically handled by the window chrome. If you disable it, you have to handle that functionality by yourself.
This is in no way related to Google Chrome :)