 Hello. Here's what's new in DevTools in Chrome 80. The console now supports redeclarations of let-in-class statements to make it easier to experiment with new code. In this older version of Chrome, when I declare a local variable called x with a let statement, and then try to redeclar that variable with another let statement, I get an error. In Chrome 80, when I redeclar the local variable, it works. Now to be very clear, the redeclarations only work in the console. It's just a convenience feature to make it easier to experiment. It won't work in your JavaScript files. Moving on, DevTools has started to support the dwarf debugging standard, which means better WebAssembly debugging support. Check out the article called improved WebAssembly debugging support in Chrome DevTools for the full story. Next up, the network panel has a bunch of updates. After logging network activity, when I select a resource now, the resource now gets highlighted with a blue border in the overview. The initiator tab shows you the network activity that caused a resource to be requested as well as any network activity that the resource itself caused. To show the initiator tab, first I select a resource such as firebaseperformance.js, and then I click initiator. In the request initiator chain, the resource that I selected is bold, which is firebaseperformance.js in this example. The resource above it is what caused firebaseperformance.js to get requested. So in this case, it looks like there is a script tag in the HTML document. The resources below firebaseperformance.js were requested probably because of Fetch or XHR calls within the script. You can now show the absolute path or full URL of resources in the network log. Right-click the table header and enable the path option to show the path column, and then right-click the table header again, and enable the URL option to enable the URL column and you'll see the new columns in your log. You can now set custom user agent strings in the network conditions tab. Doing this will change the user agent HTTP header that Chrome attaches to network requests, as well as the value of navigator.useragent. Press escape to show the drawer, click more tools, and then select network conditions to show the tab. Disable select automatically, then enter your custom string in the text box. The audits panel has a couple of updates. After you click audits to open the panel, you'll see that there's a new configuration UI, and you'll also notice this new community plugin section which will eventually be a way to install extra audits through the Chrome extension store. Check out the Lighthouse Evolution post on web.dev for more information about plugins. The coverage tab also has a couple of updates. Check out this find unused JavaScript and CSS code guide if you're not familiar with the coverage tab. The tab has a new dropdown that lets you specify whether coverage should be covered per function or per block. Per block gives you more granular data but has more overhead. Another new change is that code coverage must now be initiated with a page reload. You used to be able to turn it on without a reload, but that feature has been removed because the data it generated was unreliable. Here's a bonus tip. Let's go deep into the matrix and use DevTools to hack on DevTools itself. First, we've got to press Control Shift P or Command Shift P on Mac to open the command menu. Then type undock, then run the undock into separate window command. Now we've got to focus that DevTools window and press Control Shift C or Command Option C on Mac and then, oh my, what is going on here? Why do we have a second DevTools window? Well, DevTools is itself a web application that we can inspect. So in the second window, we're using DevTools to inspect DevTools like any other web page. Let's try logging out all the URLs of the network resources using the new URL column. When we inspect one of the cells, we see that it's a TD element with the class URL column and the URL is the text content, so that should be pretty easy to log out. We'll press Escape to open the drawer and then run this code to get the list of elements and then loop through the array and log each URL and there we have it. Welcome to the matrix. That's all we got. Thanks for watching.