addEventListener nello script di contenuto non funzionante

Question

Ho un'estensione chrome con popup.html e uno script di contenuto iniettato. Con lo script di contenuto iniettato sto provando ad accedere alle funzioni API di javascript di youtube e tutto funziona bene tranne uno: addEventListener.

L'ascoltatore di eventi dell'API javascript di YouTube ascolta lo stato del video da modificare. Quindi, se il fine del video si raggiunge lo stato cambia a 0.

var currentVideo = document.getElementById('movie_player'); 
currentVideo.addEventListener("onStateChange", "onytplayerStateChange"); 

function onytplayerStateChange() { 
    console.log("The state of the player has changed"); 
} 

Questo pezzo di codice funziona bene in un ambiente normale, ma non riesce a lavorare in script contenuti. Perché non riesco a rilevare gli eventi che cambiano nel mio script di contenuto? Qualche idea?

Answer 1

Gli script di contenuto sono non eseguiti nell'ambito della pagina corrente. Il gestore di eventi deve essere iniettato tramite un altro <script> tag, come descritto in questa risposta: Building a Chrome Extension with Youtube Events:

var actualCode = 'function onytplayerStateChange() {' 
       + ' console.log("The state of the player has changed");' 
       + '}'; 

var script = document.createElement('script'); 
script.textContent = actualCode; 
(document.head||document.documentElement).appendChild(script); 
script.parentNode.removeChild(script); 

PS. Il DOM è disponibile per lo script di contenuto, quindi il gestore di eventi funziona correttamente.