Выбор и отображение текста в хроматическом расширении контекстного меню

Я работал над небольшим расширением Chrome с проблемой, о которой я, похоже, не оглядывался, и хотел бы, чтобы кто-то посмотрел на нее с новой перспективой.

Целью является создание расширения chrome, которое позволяет вам выбирать текст на любом данном веб-сайте и отображать возможность отправки выбора на другой веб-сайт с использованием элемента contextmenu.

Мой manifest.json выглядит следующим образом:

{
"name": "Context Menu Search",
"description": "Opens the selected text as keyword in a new window",
"version": "0.1",
"permissions": ["contextMenus"],
"background_page": "background.html"
}

Затем background.html:

<script src="rightclick.js"></script>

И rightclick.js:

var selection_callbacks = []; 
 function getSelection(callback) { 
 selection_callbacks.push(callback); 
    chrome.tabs.executeScript(null, { file:"selection.js" }); 
  }; 
  chrome.extension.onRequest.addListener(function (request) { 
    var callback = selection_callbacks.shift(); 
    callback(request); 
  });

function sendSearch(selectedText) {
var serviceCall = 'http://www.google.com/search?q=' + selectedText;
chrome.tabs.create({url: serviceCall});
}
var tx = getSelection();
var title = "Test '" + tx + "' menu item";
var id = chrome.contextMenus.create({"title": title, "contexts":[selection],
                                   "onclick": sendSearch(tx)});
console.log("selection item:" + id);

Плюс selection.js:

chrome.extension.sendResponse(window.getSelection().toString());

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

Большое спасибо.

Ответы

Ответ 1

UPDATE

Я просто посмотрел на docs, и все это можно сделать гораздо проще без каких-либо скриптов и обратных вызовов:

chrome.contextMenus.create({
    title: "Test %s menu item", 
    contexts:["selection"], 
    onclick: function(info, tab) {
        sendSearch(info.selectionText);
    }
});

Это все, что вам нужно, потому что вы можете использовать %s в заголовке меню, чтобы получить выделенный текст.

(все ниже не требуется больше)

Ваш метод getSelection() не возвращает выделенный текст, он просто вводит содержимое script на страницу. Выбранный текст будет получен позже в onRequest, а затем передан функции обратного вызова из вашего массива обратного вызова в качестве параметра.

Итак, эта часть:

var tx = getSelection();
var title = "Test '" + tx + "' menu item";
var id = chrome.contextMenus.create({"title": title, "contexts":[selection],
                                   "onclick": sendSearch(tx)});
console.log("selection item:" + id);

необходимо изменить на следующее:

getSelection(function(tx) { 
    var title = "Test '" + tx + "' menu item";
    var id = chrome.contextMenus.create({"title": title, "contexts":["selection"],
                                       "onclick": sendSearch(tx)});
    console.log("selection item:" + id);
})

Но я бы избавился от этого массива selection_callbacks вообще, поскольку я думаю, что он не нужен:

chrome.extension.onRequest.addListener(function (request) { 
    var tx = request;
    var title = "Test '" + tx + "' menu item";
    var id = chrome.contextMenus.create({"title": title, "contexts":["selection"],
                                       "onclick": sendSearch(tx)});
    console.log("selection item:" + id);
});

Также обратите внимание, что "contexts":[selection] должно быть "contexts":["selection"], а "onclick": sendSearch(tx) должно быть чем-то вроде этого:

"onclick": function(info, tab) {
    sendSearch(info.selectionText);
}