Расширение Chrome открывает все указанные ссылки в контекстеMenus независимо от того, какой вариант я выбираю. Как я могу избежать этого?

Question

Доброе утро, я пытался исправить эту ошибку самостоятельно, но я не могу полностью понять, что еще не так. Вкратце:

• Я сделал расширение Chrome, которое я хотел бы использовать как панель закладок. Ссылки внутри расширения будут предоставлены мною. Все они являются URL-адресами, размещенными в Интернете.
• Чтобы их было легко найти, я категорически организовал их с помощью функции contextMenus в Chrome.
• Всякий раз, когда я нажимаю один из разделов в меню, вместо того, чтобы только открывать выбранный, он открывает ВСЕ из них.

manifest.json:

{ 
"name": "My Chrome Extension", 
"description": "Bookmarks in a Chrome Extension", 
"version": "0.1", 
"permissions": ["contextMenus","tabs"], 
"background": { 
"scripts": ["background.js"] 
}, 
"manifest_version": 2 
} 

background.JS:

// A generic onclick callback function. 
function genericOnClick(info, tab) { 
    console.log("item " + info.menuItemId + " was clicked"); 
    console.log("info: " + JSON.stringify(info)); 
    console.log("tab: " + JSON.stringify(tab)); 
} 

// Create one test item for each context type. 
var contexts = ["page", "selection", "link", "editable", "image", "video", 
    "audio" 
]; 
for (var i = 0; i < contexts.length; i++) { 
    var context = contexts[i]; 
    var title = "Quick Access"; 
    var id = chrome.contextMenus.create({ 
    "title": title, 
    "contexts": [context], 
    "onclick": genericOnClick 
    }); 
    console.log("'" + context + "' item:" + id); 
} 

// Create a parent item and two children. 
var parent1 = chrome.contextMenus.create({ 
    "title": "Essentials" 
}); 
var child1 = chrome.contextMenus.create({ 
    "title": "Google", 
    "parentId": parent1, 
    "onclick": genericOnClick 
}); 
chrome.contextMenus.onClicked.addListener(onClickHandlerGoogle); 

function onClickHandlerGoogle(info, tab) { 
    var urlgoogle = "https://www.google.com/"; 
    window.open(urlgoogle, '_blank'); 
}; 

var child2 = chrome.contextMenus.create({ 
    "title": "CNN", 
    "parentId": parent1, 
    "onclick": genericOnClick 
}); 
chrome.contextMenus.onClicked.addListener(onClickHandlerCNN); 

function onClickHandlerCNN(info, tab) { 
    var urlCNN = "https://www.cnn.com"; 
    window.open(urlCNN, '_blank'); 
}; 

Любые идеи в отношении того, что вы думаете, что это неправильно было бы очень признателен!

UPDATE - background.JS теперь выглядит следующим образом: **

// A generic onclick callback function. 
function genericOnClick(info, tab) { 
    console.log("item " + info.menuItemId + " was clicked"); 
    console.log("info: " + JSON.stringify(info)); 
    console.log("tab: " + JSON.stringify(tab)); 
} 

// Create one test item for each context type. 
var contexts = ["page","selection","link","editable","image","video", 
      "audio"]; 
for (var i = 0; i < contexts.length; i++) { 
    var context = contexts[i]; 
    var title = "Quick Access"; 
    var id = chrome.contextMenus.create({"title": title, "contexts":[context], 
            "onclick": genericOnClick}); 
    console.log("'" + context + "' item:" + id); 
} 

// Create a parent item and two children. 
var parent1 = chrome.contextMenus.create({"title": "Essentials"}); 
var child1 = chrome.contextMenus.create({ 
    "id": "google", 
    "title": "Google", 
    "parentId": parent1, 
    "onclick": genericOnClick 
}); 
var child2 = chrome.contextMenus.create({ 
    "id": "cnn", 
    "title": "CNN", 
    "parentId": parent1, 
    "onclick": genericOnClick 
}); 

function clickHandler(info, tab) { 
    var url; 
    switch(info.id) { 
     case "google": 
      url = "https://www.google.com"; 
      break; 
     case "cnn": 
      url = "https://www.cnn.com"; 
      break; 
    } 
    if (url) { 
     window.open(url, "_blank"); 
    } 
} 
chrome.contextMenus.onClicked.addListener(clickHandler); 

Эти изменения позволяют Chrome запустить расширение без каких-либо ошибок, однако, он не будет открыть ссылку на все. В настоящее время я все еще работаю над этим, и я очень ценю время, когда пользователи предложили изменения.

Если вы заметили что-то странное, пожалуйста, дайте мне знать!

Answer 1

У вас не должно быть нескольких слушателей. Все они запускаются, когда вы выбираете из меню, потому что нет ничего, что привязывает их к определенным пунктам меню.

Просто определите одного слушателя, и он должен проверить, какой пункт меню он запускается, и открыть соответствующую страницу. Вам нужно будет добавить свойство id в пункты меню, чтобы вы могли отправить по нему.

var child1 = chrome.contextMenus.create({ 
    "id": "google", 
    "title": "Google", 
    "parentId": parent1, 
    "onclick": genericOnClick 
}); 
var child2 = chrome.contextMenus.create({ 
    "id": "cnn", 
    "title": "CNN", 
    "parentId": parent1, 
    "onclick": genericOnClick 
}); 

function clickHandler(info, tab) { 
    var url; 
    switch(info.menuItemId) { 
    case "google": 
     url = "https://www.google.com"; 
     break; 
    case "cnn": 
     url = "https://www.cnn.com"; 
     break; 
    } 
    if (url) { 
     window.open(url, "_blank"); 
    } 
} 
chrome.contextMenus.onClicked.addListener(clickHandler);