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

时间:2016-07-13 13:21:27

标签: javascript firefox-addon contextmenu firefox-webextensions

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

的manifest.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"]
    }
  ]
}

背景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.");
        }
    );
}

内容-的script.js

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

正在创建菜单项,但从不显示消息(我同时检查Web和浏览器控制台)。由于click事件不起作用,因此也不会发送消息。

我跟随来自MDN的this example,这不起作用。它还会创建菜单项,但它们什么都不做,这让我觉得API中的某些内容发生了变化,而且MDN并不打算更新文档。

有什么想法吗?感谢。

1 个答案:

答案 0 :(得分:1)

您的代码按照书面形式运作:

Browser console with output

我强烈怀疑您的问题是:

  • 您正在使用Firefox 48之前的Firefox版本进行测试.Firefox 48位于BetacontextMenus "Browser compatibility" section明确指出其功能的第一个版本是Firefox 48.WebExtensions API仍处于开发阶段。通常,您应该针对Firefox Developer EditionFirefox Nightly进行测试。如果 all 您使用的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.
    

    Browser Console with error

关于您的代码的说明:
请注意,您的sendMessage()功能可能过于复杂。当选择了上下文菜单项的选项卡的tabs.Tab对象已作为参数之一传递给您的函数时,您正在搜索活动选项卡。较短的版本可能是:

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

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