上下文菜单不起作用 Firefox 附加 WebExtensions

Question

我正在尝试使用 WebExtensions API 向我的 firefox 插件添加上下文菜单。我需要后台脚本来收听单击菜单项并向内容脚本发送消息。 这就是我所拥有的：

ma​​nifest.json

{
  "manifest_version": 2,
  "name": "MyExt",
  "version": "0.0.1",

  "description": "Test extension",
  "icons": {
    "48": "icons/icon-48.png"
  },

  "applications": {
    "gecko": {
      "id": "myext@local",
      "strict_min_version": "45.0"
    }
  },

  "permissions": ["contextMenus"],

  "background": {
    "scripts": ["background-scripts.js"]
  },

  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["content-script.js"]
    }
  ]
}

background-scripts.js

chrome.contextMenus.create({
    id: "clickme",
    title: "Click me!",
    contexts: ["all"]
});

browser.contextMenus.onClicked.addListener(function(info, tab) {
    console.log("Hello World!");
    sendMessage(info, tab);
});

function sendMessage(info, tab) {
    chrome.tabs.query(
        {active: true, currentWindow: true }, 
        function(tabs) {
            chrome.tabs.sendMessage(tabs[0].id, "Test message from background script.");
        }
    );
}

content-script.js

browser.runtime.onMessage.addListener(function(msg) {
    console.log(msg);
});

正在创建菜单项，但从未显示消息（我正在检查 Web 和浏览器控制台）。由于单击事件不起作用，因此也不会发送消息。

我正在关注来自 MDN 的 this example，但它不起作用。它还创建了菜单项，但它们什么都不做，这让我认为 API 中的某些内容发生了变化，MDN 并没有费心更新文档。

有什么想法吗？谢谢。

Answer 1

您的代码按原样工作：

我强烈怀疑您的问题是：

• 您正在使用 Firefox 48 之前的 Firefox 版本进行测试。Firefox 48 位于 Beta。 contextMenus "Browser compatibility" section 明确指出它的第一个功能版本是 Firefox 48。WebExtensions API 仍在开发中。通常，您应该针对Firefox Developer Edition 或Firefox Nightly 进行测试。如果所有您正在使用的 API 被指示在早期版本中工作，您可以使用早期版本。但是，如果您遇到问题，您应该使用 Nightly 进行测试。我怀疑这是您最有可能遇到的问题，因为您指出 contextMenus example code 没有做任何事情。

• 您尚未导航到实际网页。您的 content-script.js 仅加载到与支持的方案之一匹配的页面中：即“http”、“https”、“file”、“ftp”、“app”。它没有加载到about:* 页面中。如果这是您的问题，您将获得 contextMenus 示例代码中的部分功能。此外，使用您的代码，浏览器控制台会在延迟后生成错误消息：

  Error: Could not establish connection. Receiving end does not exist.
  

代码注释：
请注意，您的 sendMessage() 函数可能过于复杂。当 tabs.Tab object选择上下文菜单项已将其作为参数之一传递给您的函数时，您正在搜索“活动”选项卡。更短的版本可能是：

function sendMessage(info, tab) {
    chrome.tabs.sendMessage(tab.id, "Test message from background script.");
}

我很想知道您是否遇到过需要搜索活动选项卡而不是使用上下文菜单侦听器提供的tabs.Tab 对象的情况。