chrome dev tools resource view little numbers - google-chrome

When I open the developer tools in chrome and go to the "Resources" tab, sometimes there are resources which have a red circle with a number to the right of the resource name.
What is that number? You can see it at this site: http://www.realclearpolitics.com/?state=noad

There are some notes that depend from the color.
The red is for errors. Open the console to see the errors, then in the resource is trying to tell you where they found.
Then if you go to the resource with this red sign and move down you see the error line.
The yellow are messages.
The blue is for the search results.
The number is the times that this found.

It shows the number of errors on the resource.
In the specified case, there is one error: an unmatched span close tag.

Related

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

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:

What is the exact meaning of the candlestick chart on the network download of performance monitor of the chrome devtools?

I'm watching Network performance on the chrome devtool.
I notice that I don't know the exact meaning of the chandlestick chart on it. I've searched the document pointing it out, but I didn't find it.
My question is following:
What is indicated by the leading thin line?
What is indicated by the continuing fat line with light color?
What is indicated by the continuing fat line with dark color?
What is indicated by the continuing thin line at the end?
You can find the document here: https://developer.chrome.com/docs/devtools/evaluate-performance/reference/#network
The left line is everything up to the Connection Start group of events, inclusive. In other words, it's everything before Request Sent, exclusive.
The light portion of the bar is Request Sent and Waiting (TTFB).
The dark portion of the bar is Content Download.
The right line is essentially time spent waiting for the main thread. This is not represented in the Timing tab.

Viewing errors in PhpStorm 6.0.3

I am using PhpStorm 6. It is showing me error counts as shown below:-
Can someone let me know where and how can I view the actual errors?
Just click on such red marker on a scroll bar (as per your screenshot) to navigate to the line with error.
You can use Navigate | Next Highlighted Error (F2) and Navigate | Previous Highlighted Error (Shift + F2) to navigate between all the warnings and errors (this will exclude minor notices, spell checker marks etc)
Use Code | Inspect Code... to inspect current file (or whole folder) -- it will list ALL found issues in hierarchical view and will provide fixes to some of them (depends on actual Inspection).
Please note that this tool window does not update automatically -- you need to re-run inspection manually to see updated results.
General info: https://www.jetbrains.com/help/phpstorm/2016.3/code-inspection.html
The line where the error occurred is red, so you just pass your mouse on top of the red dot in the scroll bar.

How do you see what the firebug errors are?

I'll be working on a page and the firebug icon will have a red circle with an error count in it. If I click it, nothing happens. How do you see what the errors are? On the firebug website it tells you to click the icon.
Thanks!
Click on Firebug Icon, top right, under X button, go to "Console" tab first, check if there are any errors (red lines), go to "Net" tab next, check again for errors (404). You might have a image missing on the website or some external css/js file that dosen't exist or you have a javascript error.
Most common causes are 404 errors or javascript errors.

Chrome debugger shows warnings count without details

Sorry for such a basic question, but I cannot figure it out:
The Google Developper Tool shows me a warning icon on the bottom left, but when I click on it, no warnings are displayed.
How can I display these warnings ? Is there a setting that is wrong or is Chrome just messed up on my machine ?
In this example I see that there are 12 warnings, but non of them is showing, no matter if I filter by all, warnings or any other.
Thanks for your help!
Check if you have no any filter active on the search field just over that icon.