Я настраиваю контекстное меню расширения для клиент-серверного приложения, используя Tampermonkey.Я хочу иметь пункт меню-> 3xsub пунктов меню.
Меню работает, и я могу получить значки для пунктов подменю, но НЕ для основного элемента
Я использую код ниже (не включая полный код PNG для ясности)
menu.outerHTML = '<menu id="userscript-context-menu" type="context">\
<menu label="My Options\u2026"\
icon="data:image/png;base64,\
iVBORw0KGgoA5ErkJggg==">\
<menuitem label="Delete item"\
icon="data:application/ico;base64,\
EimHpMQX36bGi+5A/mC6/EOVORK5CYII=">\
</menuitem>\
<menuitem label="Clear item"\
icon="data:application/ico;base64,\
EimHpMQX36bGi+5A/mC6/EOVORK5CYII=">\
</menuitem>\
<menuitem label="Spread Item"\
icon="data:application/ico;base64,\
uOjDAE+O3orkJggg==">\
</menuitem>\
</menu>\
</menu>';
var html = document.documentElement;
html.setAttribute("contextmenu", "userscript-context-menu");
// If browser supports contextmenu
if ("contextMenu" in html && "HTMLMenuItemElement" in window) {
// Executed on clicking a menuitem
$("#userscript-context-menu menu").addEventListener("click", my_functions, false);
html.addEventListener("contextmenu", initMenu, false); // Executed on right clicking
}
//SHOW MENU
//------------------------------------------
function initMenu(e) {
var node = e.target;
var title = document.title;
console.log("better context init", node);
var menu = $("#userscript-context-menu menu");
//MENU OPTION HANDLER
//------------------------------------------
function my_function(e) {
switch (e.target.label) {
case "Delete item":
//do something
break;
case "Clear item":
//do something else
break;
case "Spread Item":
//do something else else
break;
default:
alert("shouldn't be here");
}
}
Меню отображается и работает в терминах функций.
Я получаю значки для пунктов подменю, но НЕ для главного меню.Почему нет значка в главном меню?Чего мне не хватает?