Votre code devrait fonctionner correctement. Vous êtes juste tombé sur un bug dans Discourse.
loadScript() ne définit pas l’attribut async pour les scripts qu’il charge. Il utilise donc par défaut async="true", ce qui perturbe votre ordre de chargement. C’est une bizarrerie du navigateur. Vous devez forcer async="false" pour les scripts chargés avec JS.
Les plugins sont plus petits, ils se chargent donc plus rapidement que le paquet principal, mais le fait qu’ils soient async signifie qu’ils ne respectent plus l’ordre de chargement - attendez que le paquet principal soit chargé et exécuté avant de s’exécuter.
Cela est probablement passé inaperçu car loadScript n’est imbriqué nulle part dans le cœur, pour autant que je sache. Vous regrouperiez normalement les fichiers qui doivent fonctionner ensemble. Donc, pour répondre à votre autre question. Non, il n’y a pas de fonctions Discourse qui gèrent ce genre de choses.
Votre autre extrait devrait également fonctionner. Pour le rendre un peu plus facile à lire, essayez peut-être de les enchaîner sans les imbriquer.
// Ceci va en dehors du décorateur
const PLUGINS = {
speed: "https://example.com/foo.js",
skipBack: "https://example.com/bar.js",
jumpForward: "https://example.com/baz.js"
};
// Ensuite, faites votre travail à l'intérieur du décorateur
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);
});
});