如何查看和编辑基于 WebExtensions 的 Firefox 插件使用的本地存储？

Question

所以我正在为 Firefox 开发一个基于 WebExtensions 的附加组件。我的加载项成功存储并在以后检索了一些 cruft（使用browser.storage.local.set()/get(). 但是我如何以交互方式查看和编辑内容（使用键盘和鼠标），而不是使用 WebExtension 代码？例如，快速修改一些存储的对象属性和/或手动值，以便快速测试？

我想我会尝试“存储检查器”、SHIFT-F9 或菜单 -> Web 开发人员 -> 存储检查器。但那里什么都没有。我在 about:addons 页面上打开了一个选项卡，Storage Inspector 在每个部分（缓存存储、Cookies、索引数据库、本地存储 [我想要这个] 和会话存储）中只有“about:addons”。但它们似乎与 about:addons 页面相关联，与打开 Storage Inspector 的任何选项卡相关联。

嗯，所以我点击我的选项页面，我配置在一个选项卡中打开，每个存储区域都有 moz-extension://random-uuid-etc，这不是我的插件的 ID，大概是因为我启动了与 web-ext 的浏览器会话，它将插件注入到配置文件中，以实时更新文件更改。

我知道，您是说，但是，每次都会创建一个新的配置文件，因此无论如何您都不会保存任何旧值。当然，好吧，如果我在尝试找到查看和编辑的方法之前还没有使用附加组件设置内容，那可能是一个借口。所以这真的不是本地存储在存储检查器中完全空白的借口。

但另外，我使用 web-ext with -p C:\path\to\profile --keep-profile-changes，它以持久的方式存储配置文件更改。我已经验证以前从附加组件中保存的值仍保留在本地存储中，即使在注释掉对 的调用set、退出、保存文件、重新启动等之后也是如此。

那么如何查看和编辑基于 WebExtension 的 Firefox 插件使用的本地存储？

一个“Web 开发人员”工具有一个警告，即不适用于 Web 开发，在任何工具包中都是一个珍贵的傻瓜。

Answer 1

about:debugging在 FF 60esr 中，我可以通过导航到并选择debug相关扩展来查看呈现的页面中的扩展本地存储数据。URL 是这样的形式moz-extension://{Extension UUID}/_generated_background_page.html，可以直接导航到它。正如您所期望的，本地存储数据出现在 Web Developer/Storage Inspector 中 - 示例如下。

至于编辑它，GUI 需要一些改进，但这可以通过双击键或值字段来实现，根据文档。

Answer 2

目前这在 Firefox 中是不可能的。投票给https://bugzilla.mozilla.org/show_bug.cgi?id=1292234让它在某一天发生。

同时，我将 Chrome 用于 Firefox WebExtensions 开发，其中存储区域资源管理器扩展提供了您正在寻找的功能。