Firefox Tools Adapter

Firefox Tools Adapter 是这样一个插件,它使得 Firefox Developer Tools 可以来调试更多浏览器,而不仅仅是基于 Gecko 的 Firefox、Firefox Android 版和 Firefox OS 浏览器。

它调试的目标是 Android 下的 Chrome 和 IOS Safari。

这个工具仍是非常早期的版本,仅是预览版。我们并不推荐将其用作日常调试工具。

安装和配置

安装Valence

如果你安装了 Firefox Developer Edition 或 Firefox 37 以上版本, Valence 扩展已经自动安装, 当你打开 WebIDE 的时候, 所以你可以跳过这步.

否则,从这里下载.

注意: 如果调试目标不在 WebIDE 中, 确保 Valence 没有被禁用. 你可以在扩展管理器中找到它.

Android 下 Chrome 的配置

这个 Adapter 要求安装 Chrome 37.0 或更高 版本(如果你已同时安装并运行了 Chrome 和 Chrome Beta,这时 使用 Firefox Developer Tools 连接到你的设备,你将只能看到其中一个浏览器的所有标签)。

你将需要开启开发者模式,且同时开启 USB 调试。请参照  这些示例 来开启开发者模式。

iOS 下 Safari 配置(仅适应 Linux / Mac)

这个 Adapter 是面向 iOS 7 下的 Safari 开发的。不过我们也做了一些简单的测试试图支持 iOS 8。

你将需要在你的设备上开启开发模式(developer support)。请参照 这个页面(在 "To enable Web Inspector on iOS" 这部分)。

为支持 iOS 这个工具使用了 Google 的 ios-webkit-debug-proxy。在这个工具被直接构建到 Adapter 内之前,你需要自己安装和运行 ios-webkit-debug-proxy 这个工具:

  • Mac:更用命令行工具 brew install ios-webkit-debug-proxy
  • Linux:对于这个预览版你需要自己从源代码中构建(build)一个。 操作方法详见 ios-webkit-debug-proxy  的 github 页面

运行 Adapter

调试工具被内置到已经被用来连接 Firefox OS WebIDE 窗口,在其中运行。

  1. 连接你的设备:连接设备,打开浏览器,并转到你要调试的页面。如果你使用 OS X 并且已经安装了 Xcode,你也可以使用 iOS 模拟器。
  2. 命令行中运行 ios-webkit-debug-proxy: 如果你需要支持 iOS 设备的话。
  3. 打开 WebIDE:在 Firefox 的 Web Developer 菜单中打开 WebIDE。
  4. 选择你的运行环境: 在工具栏的右侧展开运行环境列表,在 「自定义」区选择「iOS Proxy」或者「Google Chrome」。连接调试可能需要你在设备中确认。
  5. 选择调试 Tab: 在工具栏的左侧的程序列表中,选择你要调整的 Tab。
  6. 开始调试: 点击「调试」按钮(长的像暂停的那一个按钮)以开启一个 Firefox Developer Tools 的实例。

给我们发反馈:反馈你遇到的任何问题。你可以使用 我们的 github 项目 中 issue tracker 来提交。我们有大量的功能需要添加,你的反馈将帮助我们把精力优先放在最重要的部分。

常见问题

葫芦里卖着什么药?

这个插件是 Firefox Developer Tools 协议的一个新实现。相比于直接交互的连接,它利用由 Chrome 和 iOS 提供的远程调试接口(协议)来作调试。这个实现运行于 Firefox 进程内,并由 Firefox Developer 直接内嵌。

几时完成开发?

我们也不知道!我们正努力地工作着,并希望把进程展现给你。当我们觉得它足够用于日常开发,我们将会发布一个完整版本。在此期间,预览版将照例更新。

我如何做贡献?

github 项目页面 有如何参与到代码中来的说明。你的反馈也将非常受用:twitter at  @FirefoxDevToolsgithub issues 或者 User Voice 中来聊聊吧。

这和 remotedebug.org 是同样的东西吗?

不是。remotedebug.org 项目的终极目标是,通过标准化一个 Chromium 协议,给所有浏览器提供一个统一的协议让其可以与第三方工具交互。

对于 Firefox Developer Tools 插件,目前我们并不想去解决标准协议这样一个总是,我们只是做我们能做的 —— 提供 Firefox Developer Tools 给这些浏览器。我们的工具基于 Firefox Developer Tools 协议,而非 Chromium 协议。

虽然 remotedebug.org 早期的协议通道(protocol bridge)是这个项目的一部分灵感来源,但我们在同一个想法的不同方向上。

下游协议是不是一直在变更?

是的,我们认为这很好 —— 主开发工具大步向前,我们扩展协议将和开发新功能一样快。通过这些协议的变更,我们持续开发以保证 Firefox Tools Adapter  不过时。这也是我们将它做一个插件而非一个内置功能的其中一个原因 —— 我们希望尽最快的速度,更新到最新的协议版本让你使用。

这并不是一件简单的事,我们很关注将要做的事情和它将带来的代价。

我能在自己的工具中使用这个协议以支持多浏览器吗?

这不是项目的最初目标。但如果足够有趣的话,我们也会考虑的 —— 保持联系吧。

获得帮助

前往 #devtools room on IRC 获得我们的帮助.

文档标签和贡献者

标签: 
 此页面的贡献者: Meteormatt, sofish
 最后编辑者: Meteormatt,