是否可以在选项卡内创建 firefox 插件 ui？

Question

我有一个想移植到 Firefox 的 chrome 插件。这个插件有一个复杂的用户界面，它占据了整个页面，它的目的是长时间打开和使用，以及在浏览器中打开的其他页面。在 chrome 中，我只打开“.html”插件接口文件，它可以访问所有插件 api：与插件脚本等通信。但是如果我在 firefox 插件中打开“.html”文件：

var root = data.url('icon.png').split('/').slice(0, -2).join('/');
widget.Widget({
  id: 'my-addon',
  label: 'my addon',
  contentURL: data.url('icon.png'),
  onClick: function() {
    tabs.open([root, 'lib', 'control.html'].join('/'));
  }
});

页面内的javascript代码似乎无法访问this.port对象进行通信。创建全页插件界面的正确方法是什么？我是否需要通过contentScriptFile 单独注入javascript代码（非常糟糕，因为这在chrome中完全不可能，我将无法对两个插件使用相同的代码）或使用某种特殊类型的Panel 所以它会全屏？

Answer 1

您可以在选项卡中打开 html 页面，然后使用 tab.attach 附加实际脚本。这样，您的脚本将是可以访问内容脚本 API 的实际内容脚本。

widget.Widget({
  id: 'my-addon',
  label: 'my addon',
  contentURL: data.url('icon.png'),
  onClick: function() {
    tabs.open({
      url: data.url("control.html"),
      onOpen: function(tab) {
        tab.attach({
          contentScriptFile: [data.url("control.js")],
          onMessage: function() {}
        });
      }
    });
  }
});

它很难看，但它应该可以工作（一般来说，我实际上并没有尝试示例代码）。