Chrome 72 开发者工具更新

性能指标的可视化

在记录页面加载信息之后，开发者工具在“Timings”中显示诸如“DOM content loaded”或“First MeaningfulPaint”等指标。

高亮文本节点

当鼠标悬停育一个DOM树种的文本节点上面时，开发者工具将为你高亮显示文本。

拷贝JS路径

假如你在写自动测试，其中包括点击某个节点的操作，所以你想快速得到那个DOM节点的引用。普通的方式是去元素面板右键点击节点然后选择“Copy --> Copy selector”，然后使用拷贝出来的css选择器。但如果节点 在“shadow DOM”里面的话，这办法就行不通了。
现在你可以右键点击节点然后选择“Copy --> Copy JS path”，开发者工具将在剪贴板中放入一个“document.querySelector()”的表达式。这种方法在Shadow DOM的时候也好使。

审查面板更新

审查面板现在支持Lighthouse 3.2了。

---

本文翻译自https://developers.google.com/web/updates/2018/11/devtools