What's New In DevTools (Chrome 82)
Emulate vision deficiencies
Open the Rendering tab and use the new Emulate vision deficiencies feature to get a better idea of how people with different types of vision deficiencies experience your site.
DevTools can emulate blurred vision and the following types of color vision deficiencies:
- Protanopia. The inability to perceive red light.
- Protanomaly. A reduced sensitivity to red light.
- Deuteranopia. The inability to perceive green light.
- Deuteranomaly. A reduced sensitivity to green light.
- Tritanopia. The inability to perceive blue light.
- Tritanomaly. A reduced sensitivity to blue light (extremely rare).
- Achromatopsia. The inability to perceive any color except for shades of grey (extremely rare).
- Achromatomaly. A reduced sensitivity to green, red, and blue light (extremely rare).
The -anomaly forms are the (rare) extreme versions of the -ia forms. Every person
with an -ia vision deficiency is different and might see things differently (being able
to perceive more/less of the relevant colors). The DevTools emulations are just a visual
approximation of how someone might experience one of these vision deficiencies. Although the
approximation should be good enough for you to identify and resolve issues, there's no way
to simulate exactly what a given person would experience.
Send feedback to Chromium issue #1003700.
Cross-Origin Opener Policy (COOP) and Cross-Origin Embedder Policy (COEP) debugging
The Network panel now provides Cross-Origin Opener Policy and Cross-Origin Embedder Policy debugging information.
The Status column now provides a quick explanation of why a request was blocked as well as a link to view that request's headers for further debugging:
The Response Headers section of the Headers tab provides more guidance on how to resolve the issues:
Send feedback to Chromium issue #1051466.
Dock to left from the Command Menu
Open the Command Menu and run the Dock to left
command to move DevTools to the left of your viewport.
Note: DevTools has had the Dock to left feature for a long time but it was previously only accessible from the Main Menu. The new feature in Chrome 82 is that you can now access this feature from the Command Menu.
Send feedback to Chromium issue #1011679.
The Audits panel is now the Lighthouse panel
The DevTools and Lighthouse teams frequently got feedback from web developers that they would hear that it's possible to run Lighthouse from DevTools, but when they went to try it out they couldn't find the "Lighthouse" panel, so the Audits panel is now the Lighthouse panel.
Delete all Local Overrides in a folder
After setting up Local Overrides you can now right-click a folder and select the new Delete all overrides option to delete all Local Overrides in that folder.
Send feedback to Chromium issue #1016501.
Updated Long tasks UI
A Long Task is JavaScript code that monopolizes the main thread for a long time, causing a web page to freeze.
You've been able to visualize Long Tasks in the Performance panel for a while now, but in Chrome 82 the Long Task visualization UI in the Performance panel has been updated. The Long Task portion of a task is now colored with a striped red background.
Send feedback to Chromium issue #1054447.
Maskable icon support in the Manifest pane
Android Oreo introduced adaptive icons, which display app icons in a variety of shapes across different device models. Maskable icons are a new icon format that support adaptive icons, which enable you to ensure that your PWA icon looks good on devices that support the maskable icons standard.
Enable the new Show only the minimum safe area for maskable icons checkbox in the Manifest pane to check that your maskable icon will look good on Android Oreo devices. Check out Are my current icons ready? to learn more.
Note: This feature launched in Chrome 81. We're covering it here in Chrome 82 because we forgot to cover it in What's New In DevTools (Chrome 81).
<<../../_shared/devtools-feedback.md>>
<<../../_shared/canary.md>>
<<../../_shared/discover.md>>