开发者工具摘要,2016 年 10 月

您好!我是 Kayce,又到了向您汇报最新动态的时间了。下面将介绍上个月以来 DevTools 中的新变化。

管理中心的新功能

在目前处于 Canary 版阶段的 Chrome 56 中,开发者工具控制台由 CodeMirror 提供支持。这将启用一系列新功能,例如:

输入内容时突出显示语法。以前,DevTools 只能在代码块经过评估后突出显示语法。

突出显示匹配的圆括号 / 方括号 / 大括号。如果您多加了圆括号、方括号或大括号,DevTools 会将其突出显示为红色。

括号不匹配

匹配的圆括号、方括号或花括号时,如果光标位于其中一个内容旁边,则会以灰色突出显示。

匹配的圆括号

智能退货。现在,当您输入多行代码块时,DevTools 会知道每次按 Enter 键时是创建新行还是执行代码。例如,假设您要在控制台中评估以下 for 循环:

for (var i = 0; i < 5; i++) {
  console.log(i);
}

以前,在输入第一行代码后按 Enter 键会导致 DevTools 对该行代码进行求值,从而导致错误。如需将代码块续写到新行,您必须先按住 Shift,然后再按 Enter。与之相反,现在,DevTools 会在您按 Enter 键后,自动在新行继续输入代码块,就像您预期的那样。

多个光标。按住 Command 键 (Mac) 或 Control+Alt 键 (Windows、Linux),然后点击相应的过滤器。

多个游标

Canary 现在会以红色突出显示非顶级情境

如果您最近在控制台中工作,可能遇到过一个棘手的小 bug,它会将执行上下文选择器设置为 top 以外的值。

该 bug 现在应该已在稳定版中修复,但为安全起见,Canary(Chrome 56)中的 DevTools 现在会通过将选择器突出显示为红色来警告您未处于 top 上下文中。

非顶级情境突出显示为红色

新用户代理:UC 浏览器

现在,您可以从网络状况 抽屉式标签页中选择适用于 iOS、Android 或 Windows Phone 的 UC 浏览器。

UC 浏览器用户代理

分享即关爱

一如既往,我们非常期待收到您对任何与开发者工具相关的反馈或想法。

  • 如需提交简短的问题或反馈,或分享新想法,请在 Twitter 上与我们联系(网址:ChromeDevTools)。
  • 对于更深入的讨论,邮寄名单Stack Overflow 是最佳选择。
  • 如有任何与文档相关的问题,请在我们的文档代码库中提交问题
  • 您可以随时直接在 Crbug 上向该团队提交 bug 或请求功能。

祝好 下个月见

Kayce