The Google Chrome team announced new updates and changes to the Chrome DevTools in Chrome 71, today. The latest update explores features such as hovering over a Live Expression to highlight the DOM node, storing DOM nodes as global variables, Initiator and priority information in HAR imports and exports, and Picture-in-Picture breakpoints among others.
Let’s discuss these features in the latest update to DevTools in Chrome 71.
Hovering over Live Expression to highlight DOM node
Now when an Expression evaluates to a DOM node, hovering over the Live Expression will result in highlighted DOM node in the viewport.
Storing DOM nodes as global variables
You can now store DOM nodes as a global variable. All you need to do is run an expression in the console that evaluates to a node. Then right-click the result and select Store as the global variable. Alternatively, you can also right-click the node in the DOM Tree and then select Store as a global variable.
Initiator and priority information available in HAR imports and exports
DevTools now comprises initiator and priority information in the HAR file on exporting a HAR file. Once done importing the HAR files back into DevTools, the Initiator and Priority columns gets populated.
The _initiator field offers information behind the cause of the requested resource. The _priority field states the priority level that the browser assigned to the resource.
Accessing Command Menu from the Main Menu
Command Menu provides a fast way to access DevTools panels, tabs, and features. Now, you can open the Command Menu directly from the Main Menu. Click the main button on the main menu and select Run command.
“Add to homescreen” now called “Trigger beforeinstallprompt”
There’s an Add to homescreen button on the Manifest tab which is renamed to Trigger beforeinstallprompt as it is more semantically accurate.
For more information, check out the official update notes.
Read Next
Chrome 69 privacy issues: automatic sign-ins and retained cookies; Chrome 70 to correct these
Google announces Chrome 67 packed with powerful APIs, password-free logins, PWA support, and more
