Il tuo codice dovrebbe funzionare correttamente. Ti sei appena imbattuto in un bug in Discourse.
loadScript() non imposta l’attributo async per gli script che carica. Quindi, per impostazione predefinita, è async="true" e questo scombina il tuo ordine di caricamento. È una stranezza del browser. Devi forzare async="false" per gli script caricati con JS.
I plugin sono più piccoli, quindi si caricano più velocemente del bundle principale, ma essendo async non rispettano più l’ordine di caricamento: attendono che il bundle principale venga caricato ed eseguito prima di eseguirsi.
Probabilmente è passato inosservato perché loadScript non è annidato da nessuna parte nel core, per quanto ne so. Normalmente raggrupperesti file che devono lavorare insieme. Quindi, per rispondere alla tua altra domanda. No, non ci sono funzioni di Discourse che gestiscono quel tipo di cose.
Anche il tuo altro snippet dovrebbe funzionare. Per renderlo un po’ più facile da leggere, forse prova a concatenarli senza annidarli.
// Questo va al di fuori del decoratore
const PLUGINS = {
speed: "https://example.com/foo.js",
skipBack: "https://example.com/bar.js",
jumpForward: "https://example.com/baz.js"
};
// Quindi fai il tuo lavoro all'interno del decoratore
loadScript(MEDIA_ELEMENT_SRC)
.then(() => loadScript(PLUGINS.speed))
.then(() => loadScript(PLUGINS.skipBack))
.then(() => loadScript(PLUGINS.jumpForward))
.then(() => {
audioplayers.forEach(function (el) {
new MediaElementPlayer(el, MEDIA_ELEMENT_CONFIG);
});
});