![]() ![]() ![]() The Reporting API defines a new HTTP header, Report-To, that gives web developers a way to specify server endpoints for the browser to send warnings and errors to. You can now view the Cross-Origin Embedder Policy (COEP) and Cross-Origin Opener Policy (COOP) reporting to endpoint under the Security & Isolation section. Use the new resource-type and url keywords in the Network panel to filter network requests.įor example, use resource-type:image to focus on the network requests that are images.Ĭheck out filter requests by properties to discover more special keywords like resource-type and url.Ĭhromium issues: 1121141, 1104188 # Frame details view updates # Display COEP and COOP reporting to endpoint # New resource-type and url filters in the Network panel The Timings section of a Performance recording now marks performance.mark() events. This audit suggests cheaper alternatives to common, large JavaScript libraries like moment.js.Ĭhromium issue: 772558 # performance.mark() events in the Timings section Large JavaScript libraries can lead to poor performance. Audits if a page has valid sourcemaps for large, first-party JavaScript. Validates if all fonts that use font-display: optional were preloaded. Check out the release notes for a full list of changes. The Lighthouse panel is now running Lighthouse 6.4. Toggle the Group checkbox to group/ungroup the CSS properties.Ĭhromium issues: 1096230, 1084673, 1106251 # Lighthouse 6.4 in the Lighthouse panel ![]() On the Elements panel, select an element. With this new grouping feature, it will be easier to navigate in the Computed pane (less scrolling) and selectively focus on a set of related properties for CSS inspection. You can now group the CSS properties by categories in the Computed pane. Click on the button to toggle it.Ĭhromium issue: 1073899 # Grouping CSS properties in the Computed pane The Computed sidebar pane in the Styles pane is collapsed by default. You can now toggle the Computed sidebar pane in the Styles pane. Similarly, you can move any bottom tab to the top by right clicking on a tab and select Move to top.Ĭhromium issue: 1075732 # Elements panel updates # View the Computed sidebar pane in the Styles pane This way, you can view any two tools at once.įor example, if you would like to view Elements and Sources panel at once, you can right click on the Sources panel, and select Move to bottom to move it to the bottom. This makes the debugging experience much easier.Ĭheck out our documentation to learn more about the WebAuthn feature.Ĭhromium issue: 1034663 # Move tools between top and bottom panelĭevTools now support moving tools in DevTools between the top and bottom panel. With the new WebAuthn tab, web developers can now emulate these authenticators, customize their capabilities, and inspect their states, without the need of any physical authenticators. Developers needed physical authenticators to test their web application with Web Authentication API. Prior to the new WebAuthn tab, there was no native WebAuthn debugging support on Chrome. Select More options > More tools > WebAuthn to open the WebAuthn tab. You can now emulate authenticators and debug the Web Authentication API with the new WebAuthn tab. The new Layout pane has a Grid section offering you a number of options for viewing the grids.Ĭheck out the documentation to learn more.Ĭhromium issue: 1047356 # New WebAuthn tab Click the badge to toggle the display of a grid overlay on the page. When an HTML element on your page has display: grid or display: inline-grid applied to it, you can see a grid badge next to it in the Elements panel. DevTools now has better support for CSS grid debugging!
0 Comments
Leave a Reply. |
Details
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |