如果你想在Firefox 68之前的版本中找到关于调试 页面(about:debugging) 的信息,请查看: about:debugging (before Firefox 68) 。 此文档适用于 Firefox 68 和之后的版本
声明:调试页面提供了空位,您可以将Firefox开发者工具附加到一些调试目标上。目前它支持目标三大类:无需重启的附加组件,选项卡,和workers。
打开调试页面
有2种方式打开调试:
- 在firefox地址栏输入 "about:debugging"。
- 点击右上角菜单栏按钮,选择Web开发者,点击远程调试。
当调试页面打开时,在页面的左边,你会看到一个侧边栏,在其中有2个选项关于远程调试的设置。
- 设置
- 在设置选项配置以连接你的远程设备。
- 此火狐
- 包含你导入的临时扩展;已经安装在Firefox上的扩展;打开的选项卡;正在运行的service workers
设置
连接到远程设备
Firefox 支持通过USB调试安卓设备。
在连接之前:
- 在你的安卓设备上启用开发者选项。
- 在开发者选项中启用USB调试。
- 在安卓设备的 Firefox 中启用 USB 调试。
- 使用USB连接线将安卓设备连接到你的电脑。
如果调试页面的左侧没有显示你的设备,尝试点击“刷新设备”按钮。 如果你确认是按照以上步骤来连接但还是没有显示,看看 故障排除。
要开始一个调试会话,首先打开你想要调试的页面并点击连接以打开连接你的设备。如果连接成功,你就可以点击你的设备名称,查看你设备上打开的选项卡信息。
这些选项卡详情和此火狐选项的详情类似,不同的是此火狐的选项显示的是你的电脑上面的信息,而这些选项卡显示的是你的远程设备中的。
注意:如果你的远程设备中的Firefox版本比你的电脑中的版本老,你会收到如下警告信息:
在以上图片中,有三个打开的选项卡: Network or cache Recipe, Nightly Home 和 About Nightly。要调试这三个选项卡的内容,点击它上面的" Inspect",点击之后,会打开一个有开发者工具的新选项卡。
在以上工具列表中,你可以看见连接的设备信息。包含你是通过USB连接到 Moto G(5) 上面的 Mozilla Firefox Nightly ,你正在调试的页面,和页面地址。
此火狐
此火狐选项结合了扩展的特征,选项卡,Workers 被分为以下几个部分:
- 临时扩展
- 显示你载入的临时扩展。
- 扩展
- 此部分显示你已经安装在Firefox上面的扩展。
- Service Workers, Shared Workers, 和其他 Workers
- 此页面有三项,包含处理 Service Workers, Shared Workers,和其他 Workers。
内部扩展是否显示在这里取决于 devtools.aboutdebugging.showHiddenAddons
设置。 如果你需要显示这些扩展, 在地址栏输入 about:config
找到以上设置并将值设为 true
。
扩展
导入一个临时扩展
通过“载入临时附加组件...”按钮可以导入你本地磁盘上的附加组件。 点击按钮, 找到附加组件所在的目录并选择里面的manifest文件,完成之后将会显示在“临时扩展”选项下面。
你不必打包或者签名扩展,它会一直安装在上面,直到你重启Firefox。
这方法对比从XPI上面安装附加组件有一个很大的优势:
- 当你修改了附加组建的代码时,不必重建XPI并且重新安装。
- 你可以到导入一个不需要签名和不必禁用签名的附加组件。
一旦你导入临时扩展,你可以看到它的以下信息:
- 检查
- 在调试器中导入扩展。
- 重载
- 重新载入扩展。这功能很方便当你修改了扩展的时候。
- 移除
- 移除临时扩展。
扩展的其他信息也包含:
- 位置
- 你本地系统的扩展源码的所在位置
- 扩展 ID
- 分配给扩展的临时签名。
- 内部 UUID
- 分配给扩展的内部UUID。
- Manifest URL
- 点击链接,扩展加载的 manifest 将在新选项卡打开。
更新临时扩展
如果你用这个方法安装了一个临时扩展,当你更新扩展的时候会发生什么?
- 当你更改那些按需加载的文件,比如内容脚本或者弹出窗口,这些更改会被自动识别,并在下次加载内容脚本或者弹出窗口出现的时候显示。
- 对于其他文件的更改,点击移除按钮旁边的重载按钮,它会做以下事情:
- 重载所有脚本,比如 后台脚本
- 再次解析manifest.json文件,所以更改
permissions
,content_scripts
,browser_action
或者任何其他key都会生效。
已安装的扩展
已经安装的扩展在下面的扩展列表选项下面,每个扩展你都会看到如下信息:
就像加载过的临时扩展一样, Manifest URL 旁边的链接将在新选项卡打开加载的 manifest 。
注意: 推荐使用浏览器工具箱而不是附加组件调试Web扩展。详见 Debugging WebExtensions 。
调试页面的附件组件部分列出了当前安装的所有web 扩展。旁边的 查看 按钮可以调试扩展。
注意:这个列表里面可能包含 Firefox自带的附加组件。
如果你点击 查看, 附加组件调试器 会打开一个新选项卡。
到 附加组件调试器 页面查看更多信息
Workers
Workers 页面显示你的 workers,有如下分类:
- 所有已经注册的 Service Workers
- 所有已经注册的 Shared Workers
- 其他 workers,包含 Chrome Workers 和 Dedicated Workers
你可连接开发者工具到每个worker,并且发送通知给 service workers。
Service worker 状态
service workers 列表显示了每个service worker 的 生命周期 状态, 有三种可能的状态:
- “注册中”: 涵盖了service worker到初始注册之间的所有状态,包含“安装中”,“激活中”,“等待中” 。
- “运行中”: 当前正在运行的service worker,已经安装,激活,并且正在处理事件。
- “已停止”: service worker 已经安装激活,但是空闲之后被终止。
这部分使用了一个简单的演示: https://serviceworke.rs/push-simple/.
注销 service workers
取消注册按钮 允许你“注销” service worker:
向 service workers 推送事件
要调试推送通知,你可以在 push event 监听器中设置一个断点。但是,你也可以调试本地推送通知而不需要服务器,点击推送按钮向service worker发送推送事件。
不兼容Service workers
如果浏览器配置不兼容service workers,在此火狐选项页的顶部会显示一个警告信息。此时service worker将不可用或者被调试。
如果 about:config
里面的 dom.serviceWorkers.enable
设置成 false 那么Service workers 将不可用。