Comment communiquer depuis un arrière-plan vers un script de barre latérale dans Firefox WebExtensions? (ou vice versa)

Question

Je migre mon extension du SDK vers WebExtensions et je n'arrive pas à trouver le moyen de communiquer entre un script d'arrière-plan et la barre latérale. L'idée est de transmettre le texte que l'utilisateur met en surbrillance et quelques informations supplémentaires lorsqu'il clique dans un menu contextuel. Je dois copier cette sélection dans le « texte sélectionné » entrée, mais je ne peux pas manipuler le DOM de la barre latérale du script ...: (

browser.contextMenus.create({ 
    id: "save-highlighted-data", 
    title: browser.i18n.getMessage("save-data"), 
    contexts: ["all"], 
    onclick: function(info,tab){ 

    //I got the highlighted data 
    console.log("Selected text: " + info.selectionText); 

    browser.sidebarAction.setPanel({ 
     panel: browser.extension.getURL("/sidebar/annotation.html") 
    }).then(function(){ 

     //In this context, "this" = the chrome window. But I can not change the document 
     // of the sidebar 
     //console.log("window", this.document.querySelector("#selected-text")); 
    }); 
    }, 
    command: "_execute_sidebar_action" //This toggles the sidebar 
}); 

Toute idée que j'ai vérifié les exemples de la barre latérale à la GitHub repo, mais ils ont juste ouvrir une barre latérale avec pas plus de communication que l'action bascule de barre latérale ("_execute_sidebar_action")

Answer 1

fond de l'extension, le contenu, la barre latérale, scripts, etc peuvent communiquer entre eux en utilisant runtime.sendMessage() et runtime.onMessage.addListener()

AFAIK, il est pas une connexion directe entre sidebar et le contenu DOM à la e moment.

Vous pouvez utiliser tabs.query() pour obtenir le Active Tab (qui est l'onglet visible) ou tout autre onglet

function logTabs(tabs) { 
    for (let tab of tabs) { 
    // tab.url requires the `tabs` permission 
    console.log(tab.url); 
    } 
} 

function onError(error) { 
    console.log(`Error: ${error}`); 
} 

var querying = browser.tabs.query({currentWindow: true, active: true}); 
querying.then(logTabs, onError); 

Ou

chrome.tabs.query({currentWindow: true, active: true}, function (tabs) { 
    // tabs[0] is the active tab 
}); 

Vous pouvez ensuite utiliser tabs.executeScript() avec le Tabid vous avez obtenu de tabs.query() (ie tabs[0].id) pour injecter du code JavaScript dans la page (DOM) et interagir avec i ts DOM.