| title | What's new in DevTools (Microsoft Edge 103) |
|---|---|
| description | New node types in the Memory tool. DevTools extension for Visual Studio Code: Right-click an HTML file to launch, and Application tool. Focus Mode bug fixes. 3D View tool responsive layout. Fix: The Close button for DevTools is now accessible in high contrast mode. Welcome tool redesign. And more. |
| author | MSEdgeTeam |
| ms.author | msedgedevrel |
| ms.topic | conceptual |
| ms.prod | microsoft-edge |
| ms.date | 06/23/2022 |
[!INCLUDE Microsoft Edge team note for top of What's New]
In Microsoft Edge 103, when taking a heap snapshot in the Memory tool, there are two new node types:
- BigInt - Used to represent and manipulate values that are too large to be represented by the Number node type. See BigInt.
- Object shape - Refers to the hidden classes and descriptor arrays that V8 (the JavaScript engine of Microsoft Edge) uses to understand and index the properties on objects. See HiddenClasses and DescriptorArrays in Fast properties in V8.
For history, see Issue 12769: Improve categorization of objects in heap snapshots.
See also:
- Constructor (group) entries in the heap profiler in Record heap snapshots using the Memory tool.
To make it easier to start a new embedded instance of Microsoft Edge from within Visual Studio Code, when you right-click an HTML file in the Explorer, there's now an Open with Edge submenu that has the commands Open Browser and Open Browser with DevTools:
You can now also use the Application tool to gain insights into the storage and service worker information of your project, without leaving Visual Studio Code:
See also:
In the new Focus Mode DevTools UI, various bugs affecting controls and keyboard shortcuts for DevTools have been resolved:
- Improved behavior of collapsible panes such as Styles in the Elements tool.
- Fixed some instances in which the name of an open tool wasn't visible.
- Improved reliability of Quick View controls.
- Improved behavior of opening DevTools by using keyboard shortcuts.
- Fixed an issue with navigating to a specific line of code in the Sources tool by using keyboard shortcuts.
- Restored the keyboard shortcut to open Search in Quick View, which is
Ctrl+Shift+F(Windows, Linux) orCommand+Option+F(macOS):
See also:
In previous versions of Microsoft Edge, the 3D View tool didn't display correctly in narrow layouts. The toolbar options were cut off when DevTools was narrow. In Microsoft Edge 103, this issue has been fixed. The toolbar options in 3D View now stack when the width of the DevTools window is decreased:
See also:
In previous versions of Microsoft Edge, the Close button for DevTools didn't render correctly in high contrast mode. In Microsoft Edge 103, this issue has been fixed. The Close (
) button for DevTools is displayed correctly in high contrast mode:
See also:
In Microsoft Edge 103, the Welcome tool has a new, modern design with improved and expanded content. It's easier than ever to find documentation, videos, and information about new features and bug fixes.
-
In the Learn section, use the links to quickly jump to documentation for common tasks in DevTools.
-
In the What's New section, find out about the latest changes, new features, and bug fixes.
-
In both sections, learn about existing and new web development features through our new video series, Videos about web development with Microsoft Edge.
See also:
Microsoft Edge 103 also includes the following updates from the Chromium project: