How to get rid of [VM] line in Chrome console? - google-chrome

Now I can see about VM line in my chrome developer tools like this.
There are some solution that I found,
such as make gray 'pause button'
however, it was already gray in my developer-tool
and it was also not worked for me.
How can I get rid of that VM messages in my console?
Thanks for read my problem.

With the right mouse click on a VM:xxx link select "Reveal in Sources panel", and study the code that causes those console messages.
In my case, I found there this line - original Method(...format WithStyles(args, 'color: ${color}'));, and other lines there revealed that it was referring to React Devtools Extention. So in its "Components" console tab => Settings gear icon => Debugging tab => I checked on the "Hide logs during second render in strict mode" option.
It helped me, but it can be some other extension in your case. Study the source code of a message first.

Open Chrome console, than select All Levels (it may appear like Default, if so, click it.) See in the list if Info is checked. If it is checked, close it. It helped me to get rid of it, hope it will help you to get rid of [VM] line in Chrome console too.
Check the image below:

Related

How to show hidden errors in console on chrome for javascript code?

I'm not able to see the errors during the debug of my app on chrome please help with settings.
Even after checking the 'Errors' under 'Default', I was not able to see the errors in the console.
I then navigated to settings (or press F1) and on the bottom of the page, you will see 'Restore defaults and reload' option.
After restoring to defaults, I am able to see the console errors.
I hope this helps someone. In my case, none of the above solutions helped. The culprit was the filter text field shown in the below image.
Clear the text field and the errors will be shown again.
Solution :-
See The Right Side Of Image
Explanation :-
You Will See A Default Levels Drop down List
Check The List Items According To Your Needs
If none of these solutions work for you, remove the text in the "filter" box.
Select the Verbose option in the Default levels dropdown menu.
I had "18 hidden" in Chrome, but could not inspect what I at the time thought was errors. Turns out I simply had not checked all logging levels. You will of course get more hidden log-messages the fewer logging levels you have checked.
Make sure 'Selected context only' option is deselected.
Chrome creates context not only for current page, but also for embedded iframes and browser extensions. This could narrow visibility of logs. This was the case for me.
devtools screenshot

Can't find the overrides or emulation tabs in chrome 2016?

I'm trying to view the emulation panel but I can't find it anywhere. Everywhere I've looked it says to open an overrides panel to find it but that's missing too. I also can't find any helpful or new answers to my question. Pressing esc only opens up console and there's nothing in settings that seems to help. Can someone please tell me how to reach it?
Instead of emulation in the drawer Device Mode is now offered for emulating other devices. It provides many benefits over the old emulation mode, such as taking into account the meta viewport tag on render. So what you see is much closer to what you'd get in real life.
I'm using 51.0.2704.103 (64-bit) on a Mac.
Cmd-Opt-i to open console.
Click the button with three vertical dots and the very top right of the Developer Tools window.
Select: more tools > sensors:
If the console draw is not already open it will open. Either way there should now be a sensors tab next to the console tab on the console draw. Click this tab and follow your nose from there.
Note that this tab had an x by it. Hitting this will hide the sensors tab and next time you use it you will need to follow the steps above again to reinstate it.

Black-boxing script option in Chrome Developer tool

I have an issue with the Chrome developer tool.
My version is Version 46.0.2490.71 (64-bit)
According to online tutorials, I can go to Sources tab, right-click a script file and there will be Blackbox Script option to choose.
However, I see no option in my chrome. How do I enable that option since I have no knowledge about regex?
Another problem: The scripts still got debugged even though I added them to blackbox list. Weird!!
One more thing i want to ask is how I blackbox an "unlimited" amount of VM files?
Open devtools settings (press F1 once in devtools or open from the menu)
Go to blackboxing (see image below)
Add a pattern, for example:
node_modules
angular
rxjs
It uses regex syntax in case you need something more specific.
The nice part about blackboxing library/framework scripts is that it makes it easier to see in stacktraces from where the error was triggered in your own sources.
EDIT
As other pointed out, since this answer was posted you can directly blackbox a script with a right click on the source file in devtools.
However head off to the blackboxing settings UI for more control.
There's an easier way in Chrome 60 (and possibly older):
Open the source file in Chrome dev tools (in the source tab)
Right Click the column that displays the line numbers
Select "Blackbox Script"
EDIT: As svict4 pointed out, in Chrome 64, you can also right click anywhere on the script
It seems they changed from blackbox to Ignore List.
Also press f1 in devTools and find Ignore List
Not sure if Chrome has changed too, but on Chromium Edge, the option is named "Mark as Library Code" and "Mark as my Code" to disable it. You have to right click on the code and not on the file/tab. Right clicking on Line numbers works too.

Error in Chrome DevTools

I have recently started to see a frequent error in Chrome Dev Tools when right clicking on an element for the purposes of selecting "Inspect Element" - instead of selecting the element on the "Elements" tab the error "Uncaught Error: Parameter 2 (message) is required." appears in the "Sources" tab for a virtual "extensions:: schemaUtils" script.
The error occurs in the function "validate" as per the screenshot below.
This error seems to occur since installing the "OneTab" extension, and indeed goes away when I disable it. I have reported it to the extension author, so far without response. Unfortunately as work have seen fit to issue me with an underpowered machine, removing OneTab is not an option as memory otherwise runs in extremely short supply.
The issue is easy to replicate, within Stack Overflow itself click on the "StackExchange" icon top left, and then right click on one of the "Your Communities" items. The context menu does not open and the above error appears. This also affects the pop-out menus on the primary product I am working on.
This error only occurs in a single instance of Chrome, which happens to be my primary developer machine, and does not occur on Chrome Canary on the same computer, and with the same extension installed.
Chrome 37.0.2024.2m on a Windows 7 Professional, Service Pack 1, x64 laptop.
Do I have a corrupted copy of Chrome? Can other users replicate this error (with or without the OneTab extension)? Is there anything short of removing the extension permanently that I can do to restore essential "Inspect Element" functionality?
I have already tried resetting Chrome within the settings menu.
The problem you're experiencing is that a breakpoint is triggered for (uncaught) errors.
To stop this from happening, open the Sources tab of the developer tools, and make sure that the circle with the two stripes in it is GREY, not blue. This circle means "Pause on exception" and is the right-most icon in the next picture.
Just stating more clearly : if you are ok with that, just disable the OneTab Chrome extension.
de-activating and re-activating breakpoints in the devtools solved my issue
The breakpoints icon is in Developer Tools, on the Sources tab, the icon left of the pause button.
I also use OneTab, am on OSX 10.10.5, Google Chrome Version 46.0.2490.71 (64-bit) - other extensions I have installed are LastPass, Xdebug helper, JetBrains, Postman, DevTools Theme: Zero Dark Matrix, Google Docs (and similar)
The breakpoints solution was suggested here https://stackoverflow.com/a/25623760/1875965
You started the validation at i + 1, it should be i.
Change:
var message = "Invalid Argument for " + (i + 1) + ".";
Into:
var message = "Invalid Argument for " + (i) + ".";

Auto-scrolling Chrome's DevTools console

Since its inception few years back, Chrome has become a de-facto IDE for web development. I've been using it's Canary(Version 28.0.1464.0) channel for quite a bit and been happy as a clam.
Only issue that keeps bothering me is the lack of ability to have the DevTools console pane, auto scroll to the last message added. I understand that many folks would prefer to have the current behavior. However I was wondering: Does anyone knows how (if even possible with the current release) to flip the switch and have the console auto-scroll?
Thanks.
Clearing the console and scrolling the bar down to the bottom didn't work for me.
The problem was that I had zoomed out DevTools.
Solution:
Focus the DevTools, e.g. by clicking on the console's > prompt
Hit Ctrl-0 (zero) on Windows, or Cmd-0 (zero) on OS X, to restore the default font-size
Hopefully then auto-scroll to bottom will start working again!
Thanks to this guy for pointing it out:
http://code.google.com/p/chromium/issues/detail?id=161646#c5
One Reason why it's happening:
Logging of HTML elements into the console makes the console view lose the last console message.
How to solve it:
Instead of doing something like this:
console.log("Some logging message:", html_element)
try this (wrapped the messages with brackets)
console.log(["Some logging message:", html_element])
It drove me crazy too and I found the solution here:
Google Chrome follow developer console logging
With the console open, drag the scroll bar down to the bottom of the
window and release it. It should tail the output for you.
It does not matter if you have the console docked or not.
Working for me on a osx 10.8.5 and chrome 31
In Chrome version 29.0.1547.76 m, it auto-scrolls when you undock the console. It stops auto-scrolling if you click on the console, then you'll have to clear the console before auto-scroll will be ready to start again.
The "Undock into separate window." button is the bottom-left most button of the console.
For me I've noticed that the autoscroll stopped when the console showed a warning so I've filtered out the warnings and all is good:
For me the only solution that worked was:
click F1 (settings)
At the bottom restore defaults and reload.
None of the above worked.
I found this solution in Chrome 49+
Go Dev-tools/ Settings /
"Console tab"
x Preserve log upon navigation.
Done!