DevTools (Microsoft Edge 95) 中的新增功能
若要检查 Microsoft Edge DevTools 的最新功能以及 Microsoft Visual Studio Code 和 Visual Studio 的 Microsoft Edge DevTools 扩展，请阅读这些公告。
若要随时了解最新并获取最新的 DevTools 功能，请下载 Microsoft Edge 的预览体验成员预览版。 无论你使用的是 Windows、Linux 还是 macOS，都应考虑使用 Canary (或其他预览频道) 作为默认开发浏览器。 Microsoft Edge 的 Beta 版、Dev 版和 Canary 版本作为单独的应用运行，与 Microsoft Edge 的稳定发布版本并排运行。 请参阅 Microsoft Edge 预览体验成员频道。
有关最新公告， 请在 Twitter 上关注 Microsoft Edge 团队。 若要报告 DevTools 问题或请求新功能，请在 MicrosoftEdge/DevTools 存储库中提交问题。
从 Visual Studio Code 扩展中的“样式”工具同步实时更改
适用于 Visual Studio Code 的 Microsoft Edge DevTools 扩展现在具有名为 CSS 镜像编辑的试验。 使用此功能，可以使用样式工具调整 CSS，并且应用的更改会自动添加到Visual Studio Code编辑器中的 CSS 源文件。 可以打开和关闭此功能。
有关详细信息，请参阅从“样式”选项卡中更新.css文件 (CSS 镜像编辑) 。
若要提供反馈，请在Visual Studio Code活动栏中单击“Microsoft Edge 工具”，然后在“CSS 镜像编辑”部分中，单击“在此处留下反馈”链接。
控制台中的所有错误和警告消息现在都有搜索 Web 图标
“在 Web 上搜索此消息 ”图标现在可用于 控制台中的所有错误和警告。 以前，此图标仅针对某些常见错误和警告出现。 现在，图标已添加到剩余的错误和警告上。 单击“ 在 Web 上搜索此消息” 图标，使用相关的错误或警告字符串搜索 Web。
有关详细信息，请参阅 在 Web 上搜索控制台错误。
另请参阅：
- 在 Web 上搜索控制台概述中的控制台错误消息字符串。
改进了用于定义 User-Agent 客户端提示的键盘访问
从 Microsoft Edge 版本 92 开始，可以指定 User-Agent 客户端提示。 可以在以下两个位置之一指定 User-Agent 客户端提示：
在版本 95 之前的 Microsoft Edge 中，添加从“设置”的“设备”部分模拟的自定义设备时，使用键盘选择“用户代理客户端提示”按钮会导致激活不正确的 UI 项。 它选择了“添加”按钮，而不是展开“用户代理客户端提示”部分进行填充。 使用 用户代理客户端提示 部分中的空字段立即添加你开始定义的设备。
在 Microsoft Edge 版本 95 中，此问题已修复。 现在，使用键盘选择 “用户代理客户端提示 ”按钮会展开一个窗体，你可以在其中为自定义设备指定客户端提示。
若要详细了解 User-Agent 客户端提示，请参阅 从网站检测 Microsoft Edge。
若要在Chromium开源项目中查看此功能的历史记录，请参阅问题1243827：用户代理客户端提示表单辅助功能。
如果筛选器与组标题匹配，控制台筛选器现在会显示分组消息
可以使用 console.group() 标记一组消息并为控制台消息提供一些组织。 在早期版本的 Microsoft Edge 中，尝试在控制台中筛选分组消息时存在几个问题。 筛选到组标签时，控制台不会在组内显示单个消息。 此外，即使标签与筛选器不匹配，筛选也不会隐藏组标签。
在 Microsoft Edge 版本 95 中，已修复这些问题。 筛选到标签后，现在会显示组标签和组内的各个消息。 当筛选器与组标签不匹配时，将隐藏整个组。
当筛选器字符串与组标签匹配时，将显示组及其成员：
如果筛选器字符串与组标签不匹配，则不会显示组及其成员：
另请参阅：
- 控制台对象 API 参考中的组。
若要在Chromium开源项目中查看此功能的历史记录，请参阅问题363796：☂控制台筛选器不恰当地隐藏分组内容，并且不隐藏组标题。
Chromium项目的公告
以下是 Microsoft Edge 版本 95 中为开源Chromium项目贡献的一些附加功能。
改进了属性的显示
DevTools 通过以下方式改进了属性的显示：
- 始终首先在控制台、源工具中和元素工具的“属性”选项卡中加粗和排序自己的属性。 (自己的属性 是直接在 object 上定义的属性。)
- 平展“属性”窗格中显示 的属性 。
例如，下面的代码片段 创建一个 URL 对象，该对象 link 具有两个自己的属性： user 和 access，然后更新继承的属性 search的值：
const link = new URL('https://blogs.windows.com/msedgedev/');
link.user = { id: 1, name: 'Amelie Garner' };
link.access = 'admin';
link.search = `?access=${link.access}`;
在 控制台中输入上述代码后，请尝试记录 link。 自己的属性现在为粗体，在排序顺序中处于第一位。 通过这些更改，可以更轻松地发现自定义属性，尤其是 Web API (，例如 URL 具有许多继承属性的) ：
在“元素”工具的“属性”窗格中，现在将平展属性列表，以便在调试 DOM 属性时获得更好的体验，尤其是对于 Web 组件：
另请参阅：
有关此功能的历史记录，请参阅1076820和 1119900Chromium问题。
代码片段现在在“源”面板中排序
在“源”工具的“代码段”选项卡中，以前未对代码段进行排序。 代码片段现在按字母顺序排序：
另请参阅：
有关此功能的历史记录，请参阅Chromium问题：1243976。
改进了 DevTools 命令菜单的 UI
命令菜单已得到增强，以便更轻松地搜索文件。 在 Windows 和 Linux 中按 Ctrl+P 或在 macOS 中按 Command+P 时， 命令菜单 现在以粗体显示文件名以及指示文件类型的图标：
另请参阅：
有关此功能的历史记录，请参阅Chromium问题1201997。
注意
此页面的“Chromium项目的公告”部分是基于 Google 按网站策略创建和共享的工作的修改，并根据 Creative Commons 署名 4.0 国际许可中所述的术语使用。 Chromium 项目的公告的原始页面是 DevTools (Chrome 95) 中的新增功能，由 Google Chrome DevTools 开发人员大使 Jecelyn Yeen 创作。
