Sélection et affichage du texte dans le menu contextuel extension chrome

Question

J'ai travaillé sur une petite extension Chrome avec un problème que je n'arrive pas à cerner et j'apprécierais que quelqu'un l'examine avec une nouvelle perspective.

L'objectif est de créer une extension chrome qui vous permet de sélectionner du texte sur n'importe quel site web et d'afficher une option pour envoyer la sélection vers un autre site web en utilisant un élément du menu contextuel.

Mon manifeste.json ressemble à ça :

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

Puis fond.html :

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

Et 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);

Plus sélection.js :

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

Jusqu'à présent, la création du menu contextuel fonctionne bien, mais le texte sélectionné ne s'affiche pas du tout. Si quelqu'un a des suggestions sur la façon de résoudre ce problème ainsi que de simplifier le script, j'apprécierais votre contribution.

Merci beaucoup.

Answer 1

UPDATE

Je viens de regarder le docs et tout cela peut être fait beaucoup plus simplement sans aucun contenu scripts et callbacks :

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

C'est tout ce dont vous avez besoin, parce que vous pouvez utiliser %s dans le titre du menu pour obtenir le texte sélectionné.

(tout ce qui est ci-dessous n'est plus nécessaire)

---

Votre getSelection() ne renvoie pas le texte sélectionné, elle injecte simplement un script de contenu à une page. Le texte sélectionné est reçu quelque temps plus tard dans onRequest puis transmis à une fonction de rappel de votre tableau de rappel en tant que paramètre.

Donc cette partie :

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);

doit être changé en quelque chose comme ceci :

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);
})

Mais je me débarrasserais de ça selection_callbacks car je pense qu'il n'est pas nécessaire :

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);
});

Notez également que "contexts":[selection] doit être "contexts":["selection"] et "onclick": sendSearch(tx) doit être quelque chose comme ceci à la place :

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