javascript - 使用 Firefox Add-on SDK 定位面板

Question

我正尝试在使用新 SDK 将我的面板定位到附加组件中取得一些进展。

我看到文档只显示了控制面板位置的一种方法，那就是在您show()时传递一个 anchor :

show(anchor)

Displays the panel. [ anchor : handle ]

A handle to a DOM node in a page to which the panel should appear to be anchored. If not given, the panel is centered inside the most recent browser window. Note that it is not currently possible to anchor panels in this way using only the high level APIs.

理想情况下，我希望 anchor 是单击该小部件时面板显示锚定到的小部件，但该小部件不是页面中的DOM 节点，所以我猜不是。 ..

我可能可以解决这个问题，但我什至找不到如何将面板锚定到 DOM 节点的工作示例。当我通过 port 传回 contentScript 中的 DOM 节点时，如下所示:

lib/main.js

  var scraper = pageMod.PageMod({
    include: ['*'],
    contentScriptWhen: 'ready',
    contentScriptFile: [data.url('jquery-1.6.2.min.js'), data.url('scraper.js')],
    onAttach: function(worker){
      worker.port.on('pageLoaded', function(page){
        widget.panel.show(page.anchor);
      }); 
    } 

data/scraper.js

$('body').append('
  <div id="anchor-to-me" style="position:fixed; bottom: 0; right: 0;">.</div>
');

var anchor = $('#anchor-to-me').get();
self.port.emit('pageLoaded', { anchor : anchor  }); 

我收到以下控制台错误:

error: An exception occurred.
Traceback (most recent call last):
  File "resource://jid1-wuvxefqtmptsnw-at-jetpack-addon-kit-lib/panel.js", line 147, in show
    let document = getWindow(anchor).document;
  File "resource://jid1-wuvxefqtmptsnw-at-jetpack-addon-kit-lib/panel.js", line 345, in getWindow
    let anchorWindow = anchor.ownerDocument.defaultView.top;
TypeError: anchor.ownerDocument is undefined

如果有任何信息可以帮助我成功定位到 DOM 元素，或者找到一些其他方式来定位面板，那就太好了。

谢谢。

Answer 1

const panel = require("panel").Panel({
  width: 240,
  height: 320,
  contentURL: data.url("foo.html"),
  contentScriptFile: [data.url("jquery-1.4.4.min.js"),
                      data.url("panel.js")]
});

const widget = widgets.Widget({
  id: "some-id",
  label: "Some label",
  contentURL: data.url("icon.png"),
  //panel: panel,
  onClick: function(view) { /* cool stuff */ 
     view.panel = panel;
  }
});

不使用 mainPanel.show()，而是使用 view.panel = mainPanel;。它会解决问题，因为我也这样做了。