一组新的 Firefox 开发者工具功能刚刚更新到了 Aurora 频道。这些功能现在在 Aurora 中可用，并且将在 10 月的 Firefox 33 版本中发布。此版本带来了许多新功能，尤其是对 Inspector 工具的改进。

事件监听器弹出窗口

任何附加了 JavaScript 事件监听器的节点现在将在 Inspector 中的它旁边显示一个“ev”图标。单击该图标将打开一个包含附加到该元素的所有事件监听器的列表。单击暂停图标将转到 Debugger 中的该函数，您可以在其中设置断点并进一步调试它。 (开发说明 和 UserVoice 请求)

请记住 Debugger 中的事件窗格，它列出了页面上的所有事件监听器。

@media 侧边栏

Style Editor 中有一个新的侧边栏，它显示了一个指向样式表中每个 @media 规则（或您正在编辑的 Sass 源代码）的快捷方式列表。单击一个项目将跳转到该规则。如果媒体查询当前不适用，则规则的条件文本将变灰。这与 响应式设计视图（Opt+Cmd+M / Ctrl+Shift+M）配合使用非常有效，可以用于创建和调试移动布局。 (开发说明)

添加新规则

右键单击 Inspector 的“规则”部分中的任意位置，将获得一个“添加规则”选项。选择此选项将添加一个新的 CSS 规则，该规则预先填充了与当前选定节点匹配的选择器。 (开发说明 和 UserVoice 请求)

编辑关键帧

与当前选定元素关联的任何 @keyframes 规则现在将显示在 Inspector 的“规则”部分中，并且可以编辑。这是更好地调试 CSS 动画 的第一步。 (开发说明)

三次贝塞尔曲线编辑器

为了帮助编辑缓动动画，现在有一个三次贝塞尔曲线编辑器，当您单击 CSS 规则中动画时序函数旁边的图标时，它就会出现。此功能使用了来自 Lea Verou 的 cubic-bezier.com 的开源代码。 (开发说明)

变换高亮显示

有一种新的绝妙方式来可视化元素是如何从其原始位置和形状进行变换的。将鼠标悬停在 Inspector 中的 CSS transform 属性上将显示元素在页面上的原始位置，并绘制映射原始点到其新位置的线条。 (开发说明)

持久禁用缓存

您可以在开发过程中通过在 设置 选项卡中选中“高级设置”>“禁用缓存”来禁用浏览器缓存。现在，此设置将在您下次打开开发者工具时保持不变。与往常一样，当您关闭工具时，该选项卡的缓存将重新启用。 (开发说明 和 UserVoice 请求)

新命令

已向 开发者工具栏（Shift+F2）添加了新命令。

inject

新的 inject 命令让您轻松地将 jQuery 或其他 JavaScript 库注入到您的页面中。使用 inject jQuery、inject underscore 或使用 inject <url> 提供您自己的 URL。 (开发说明)

highlight

highlight 命令接受一个选择器，并突出显示页面上与该选择器匹配的所有节点。 (视频)(开发说明)

folder

folder 命令在您的系统文件资源管理器中打开一个目录。使用 folder openprofile 打开您的 Firefox 个人资料目录。 (开发说明)

编辑器首选项

现在可以在 设置 面板中使用大量编辑器首选项。从这里，您可以更改缩进设置，并将编辑器键绑定更改为 Sublime Text、Vim 或 Emacs。 (开发说明)

WebIDE

名为 WebIDE 的一项重要功能已经发布，但在此版本中被隐藏在一个首选项后面，以便进行更多测试。WebIDE 是一种用于浏览器内应用程序开发的工具。有关更多详细信息，请参阅 WebIDE 在 Nightly 中发布。

其他功能

编辑选择器

单击 Inspector 中任何 CSS 规则的选择器来编辑它。 (开发说明)

黑盒化压缩源代码

具有“min.js”扩展名的 JavaScript 源代码现在会自动 黑盒化。您可以在 Debugger 设置菜单中关闭此选项。 (开发说明)

自定义视窗尺寸

响应式设计视图中的尺寸现在可以编辑，因此您可以输入您想要的内容的精确尺寸。 (开发说明)

特别感谢在本次版本中添加了 所有功能和修复 的 33 位贡献者。

本次版本中的三个功能来自 开发者工具反馈渠道 上的反馈，因此这是一个建议功能的好方法。您也可以在此处评论或将反馈发送到 Twitter 上的 @FirefoxDevTools。如果您想帮忙，请查看 参与指南。