Chrome-Erweiterung erstellen neue Registerkarte und senden Nachricht von popup.js zu Inhalt Skript der neuen Registerkarte

Question

Ich entwickle eine Chrome-Erweiterung, wo mein popup.js eine Nachricht von einem Inhaltsskript auf der aktuellen Seite empfängt und ein Array erstellt. Dann erstellt popup.js auf Knopfdruck eine neue Registerkarte (auf der ein Inhaltsskript ausgeführt wird) und sendet diesem Inhaltsskript eine Nachricht, die das Array enthält.

Mein popup.js:

//this message is sent from a different content script (for current page), not shown here 
chrome.runtime.onMessage.addListener(function(request, sender) { 

    if (request.action === "getSource") { 
     var arr = JSON.parse(request.source); 

     //create new tab 
     chrome.tabs.create({url: "newtab.html"}, function(tab){ 

      //send message to new tab 
      chrome.tabs.sendMessage(tab.id{ 
      action: "getDataArray", 
      source: JSON.stringify(arr) 
     }); 
    } 
}); 

newtab-contentscript.js:

$(document).ready(function() { 

    chrome.runtime.onMessage.addListener(function(request, sender) { 

     if (request.action === "getDataArray") { 
     $("#result").html(JSON.parse(request.source)); 
     } 
}); 

newtab.html:

<script src="newtab-contentscript.js"></script> 

Problem: Die newtab-contentscript.js nie scheint um die Nachricht zu erhalten.

Sind irgendwelche Fehler mit, wie ich eine Registerkarte erstellen oder die Nachricht senden. Haben Sie Vorschläge, wie Sie dieses Problem beheben können?

Answer 1

Wie wir in den Kommentaren diskutiert, ich denke, vielleicht $(document).ready zu spät ist, um Nachrichten von chrome.tabs.sendMessage zu erhalten, können Sie es testen, indem Zeitstempel von console.log innerhalb der Callback und in der ersten Zeile des neuen Registerkarte Content-Skripte zu vergleichen, wie @ wOxxOm erwähnt.

Ich schlage nur vor, die Nachrichtenlogik auf die Hintergrundseite (Ereignisseite) zu verschieben und die Nachricht von newtab-contentscript.js zu starten, in der Sie steuern können, wann Sie mit dem Senden der Nachricht beginnen sollen.

Ein Beispielcode

background.js

let source = null; 

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) { 
    // sent from another content script, intended for saving source 
    if(request.action === 'putSource') { 
     source = request.source; 
     chrome.tabs.create({ url: 'newtab.html' }); 
    } 
    // sent from newtab-contentscript, to get the source 
    if(request.action === 'getSource') { 
     sendResponse({ source: source }); 
    } 
}); 

newtab-contentscript.js

chrome.runtime.sendMessage({action: 'getSource'}, function(response) { 
    $('#result').html(response.source); 
});