Firefox 29 刚刚升级到 Aurora 发布渠道。这意味着现在是时候报告在这个版本中您将在开发者工具中看到的一些重大更改了。
更美观的工具
除了新功能外,我们一直在更新暗色和亮色主题的外观。亮色主题已完全重新设计,并且两种主题在整个工具箱中都具有更一致的设计。您可以在 工具箱设置 中更改当前主题。 (开发笔记)
网络监视器
网络监视器现在会显示浏览器加载页面不同部分所需的时间。这将有助于测量应用程序的网络性能,无论是在首次运行还是在缓存预热的情况下。 (开发笔记)
要打开性能分析工具,请单击网络面板中的秒表图标。有关更多信息,请观看下面的屏幕截图或 在 MDN 上阅读更多内容。
您现在可以将图像请求复制为 Data URI。只需右键单击图像请求,从上下文菜单中选择该项,Data URI 就会出现在您的剪贴板中。 (开发笔记)
检查器
我们 更新了检查器高亮显示行为,以使高亮显示功能更符合其他工具。 (开发笔记)
CSS 变换预览工具提示已添加到 CSS 规则视图中。现在,如果您将鼠标悬停在 CSS 变换上,您将获得一个带有变换可视化的工具提示。获取 Firefox Nightly 或 Aurora 的下载版本,并在一些 实况 CSS 变换示例 上试用。 (开发笔记)
CSS 规则视图现在支持一次粘贴多个 CSS 声明,例如 background: #ccc; color: red
。 (开发笔记)。
就像在网络面板中一样,您现在可以将 <img>
元素复制为 Data URI。 (开发笔记)
样式编辑器
CSS 源代码映射支持已添加到样式编辑器中。 (开发笔记),并且 CSS 属性和值现在将在样式编辑器中自动完成。 (开发笔记)
想了解更多?我们发布了一篇关于 在 DevTools 中使用源代码映射实时编辑 Sass 和 Less 的文章。
调试器
我们在调试器中添加了一个经典的调用堆栈列表,位于源代码列表旁边。 (开发笔记)
调试器中有一个新的“启用/禁用所有断点”按钮。这将一次切换所有现有断点的活动状态,以允许快速在正常使用和调试之间切换。 (开发笔记)
您现在可以从调试器中突出显示和检查 DOM 节点。如果您将鼠标悬停在变量列表中的 DOM 节点上,它将在页面上突出显示,如果您单击检查图标,该节点将在检查器选项卡中打开。此功能也可在控制台输出中使用。 (开发笔记)
漂亮打印现在保留代码注释。我们正在使用开源 pretty-fast 美化器,因此它应该相当快。如果不是,请务必告知我们。 (开发笔记)
控制台
console.trace
改进。调用堆栈与其他输出内联显示,并包含指向调试器中每行的链接。 (开发笔记)
我们还改进了控制台对象输出,以根据对象类型显示更多信息。 (开发笔记)
代码编辑器
代码编辑器可以在整个工具中看到,例如在 Scratchpad、样式编辑器和调试器中。以下是在此版本中您将看到的一些更新
- 编辑器中的代码折叠。 (开发笔记)
- Emacs 和 VIM 键绑定现在可在代码编辑器中使用。要启用它们,请打开 about:config,并将“devtools.editor.keymap”设置为“vim”或“emacs”,然后重新启动 DevTools。 (开发笔记)
- ES6 语法高亮支持 (开发笔记)
衷心感谢所有为本版本贡献 DevTools 的人(43 人)!这是一个 针对 Firefox 29 解决的所有 DevTools 错误列表。
您有反馈、错误报告、功能请求或问题吗?像往常一样,您可以在此处评论或通过 @FirefoxDevTools 与团队联系。
关于 Brian Grinstead
关于 Robert Nyman [荣誉编辑]
Mozilla Hacks 的技术布道者和编辑。发表有关 HTML5、JavaScript 和开放网络的演讲和博客。Robert 是 HTML5 和开放网络的坚定支持者,自 1999 年以来一直在从事网页前端开发工作 - 在瑞典和纽约市。他还定期在 http://robertnyman.com 上发表博客,喜欢旅行和结识新朋友。
38 条评论