上下文菜单不能运行firefox附加WebExtensions

gui*_*rac 5 javascript contextmenu firefox-addon firefox-addon-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"]
    }
  ]
}
Run Code Online (Sandbox Code Playgroud)

背景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.");
        }
    );
}
Run Code Online (Sandbox Code Playgroud)

内容的script.js

browser.runtime.onMessage.addListener(function(msg) {
    console.log(msg);
});
Run Code Online (Sandbox Code Playgroud)

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

我在MDN上关注这个例子,但这不起作用.它还会创建菜单项,但它们什么也不做,这让我觉得API和MDN中的内容发生了变化,并没有费心去更新文档.

有任何想法吗?谢谢.

Mak*_*yen 1

您的代码按如下方式工作:

带输出的浏览器控制台

我强烈怀疑您的问题是:

  • 您正在使用 Firefox 48 之前的 Firefox 版本进行测试。Firefox 48 处于测试阶段。“浏览contextMenus器兼容性”部分明确指出,它的第一个可用版本是 Firefox 48。WebExtensions API 仍在开发中。一般来说,您应该针对Firefox Developer EditionFirefox Nightly进行测试。如果您正在使用的所有API 均显示可在早期版本中运行,则您可以使用早期版本。但是,如果您遇到问题,则应该使用 Nightly 进行测试。我怀疑这是您最有可能出现的问题,因为您指出contextMenus示例代码没有执行任何操作。
  • 您还没有导航到实际的网页。您的content-script.js仅加载到与支持的方案之一匹配的页面:即“http”、“https”、“file”、“ftp”、“app”。它没有加载到about:*页面中。如果这是您的问题,那么您将从示例代码中获得部分功能contextMenus。此外,使用您的代码,浏览器控制台会在延迟后生成一条错误消息:

    Error: Could not establish connection. Receiving end does not exist.
    
    Run Code Online (Sandbox Code Playgroud)

    浏览器控制台出现错误

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

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

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