
Updates to DevTools in Chrome 62 - nickwanninger
https://developers.google.com/web/updates/2017/08/devtools-release-notes
======
wluu
I actually prefer the Firefox dev tools these days. One thing that I really
like is the edit and resend functionality[0]. Quite useful when quickly
testing API calls. I know you can use other tools in Chrome to do the same,
but I like that it’s built in. Good to see improvements in the Chrome dev
tools nonetheless!

[0] [https://developer.mozilla.org/en-
US/docs/Tools/Network_Monit...](https://developer.mozilla.org/en-
US/docs/Tools/Network_Monitor#Edit_and_Resend)

~~~
alt2501
I like Firefox too, but chrome still displays JSON objects in the console very
nicely. I haven't found a good way to do this in FF yet. Do you know of a way?

~~~
samtoday
If it is a GET request, just open it in a new tab. Firefox has a built-in json
viewer (no extensions required).

Eg. open this in a new tab: [http://httpbin.org/get](http://httpbin.org/get)

------
joshribakoff
Cool but I really wish they'd add more keyboard shortcuts. Like ability to use
arrows and keyboard to select a network request and replay it. Or to drill
down a deeply nested json without having to make a series of precise mouse
clicks

------
zspitzer
They still haven't reverted the dropdown filtering UI for the console, the old
style quick access toolbar, like the network panel. It used to be really
useful, yet since the change, I barely use it anymore.

There's a long thread about it here, but the chrome developers haven't really
engaged with the community feedback

[https://groups.google.com/forum/#!topic/google-chrome-
develo...](https://groups.google.com/forum/#!topic/google-chrome-developer-
tools/kH3FiDLlsFg%5B26-50%5D)

The dev tools console has also become a dumping ground for repeated browser
warnings and the option to turn them off isn't even persistent.

~~~
indigo0086
Yup, worst decision ever. I’ve been using Firefox but performance drastically
drops when debugging so I go back to using chrome. I just prefix my logging
and filter.

~~~
zspitzer
I filed a bug about that too, feel free to vote for it :)
[https://bugzilla.mozilla.org/show_bug.cgi?id=1389864](https://bugzilla.mozilla.org/show_bug.cgi?id=1389864)

------
dzhiurgis
Hey fellow HN'ers, I recently discovered you can select source in this
(windows) terminal-like fashion by holding alt (i.e.
[https://imgur.com/a/XnCSd](https://imgur.com/a/XnCSd)).

Does anyone know what is the purpose of this feature? I always disliked how
difficult is to select something on windows cmd, this seems like anti-feature
for me, but obviously I am missing something.

~~~
noway421
many text editors have that feature, while might be not that widely used or
useful, it's still ported and implemented in many of them

------
nofilter
I see myself using the Block-level code coverage quite often.

~~~
styfle
Could be used to generate automated code coverage in headless mode?

~~~
nofilter
Ah, didn't even think of that, would be awesome!

------
petval
I continuously struggle with debugging aspx with embedded JavaScript.
Breakpoints can't be set on any line and I still haven't figured out the logic
why and when stepping through the highlighted line is never the one that is
actually running. Even after expanding the code with the { } button. It's just
simple JS so no code maps should be needed.

------
bennettfeely
Starting to think maybe it would be good to have a "DevTools" lite, now that
there are literally dozens of tabs and pages. Is there a shortcut to just
bring up the console?

~~~
ehsankia
ctrl+shift+j goes directly to console.

I believe ctrl+shift+i goes to whatever tab you were at last, and ctrl+shift+c
goes to the element tab and enables the element selector.

I don't know if there's any other shortcuts but these are the one I use most
often. You can also drag the various tabs to order them the way you like.

~~~
kaycebasques
Correct, Control+Shift+J (Windows, Linux) or Command+Option+J (Mac) opens
DevTools and focuses the Console panel.

------
heavymark
CMD+Shift+4 has always allowed you to take screenshots of any parts of your
screen, (including your devtools), so curious why this is a feature in Chrome?
Unless it's meant for Windows maybe where it's harder to take screenshots?

~~~
0x0
You can hit printscreen in windows to take screenshots (1 key instead of 3,
even easier than mac).

I could imagine it would be useful in remote debugging sessions (such as when
inspecting android webviews over USB).

~~~
simlevesque
Those are two totally different things. Windows take a screenshot of
everything visible. Cmd+shift+4 on a Mac allows to select a region to save as
a screenshot. Finally, if you are on Mac, this update provides node level
acreenshot, allowing you to save an image of a HTML node with just one click,
no need to drag the cursor. This is especially useful if the node takes more
space than the viewport since before you had to stitch screenshots together.

~~~
nolok
> Windows take a screenshot of everything visible.

For the record, it's still not a region selector but there is also alt +
printscreen to take only the visible windows.

~~~
ZenoArrow
There's also the built-in Snipping Tool, which allows you to take a screenshot
of a selected region. I use it a lot at work.

Apparently, Windows 10 Creators Update comes with a shortcut to capture a
region, Ctrl + Shift + S.

[http://www.thewindowsclub.com/snipping-tool-capture-
screensh...](http://www.thewindowsclub.com/snipping-tool-capture-screenshots-
windows-8-tips)

