decorateCookedElement for each page change?

Development
4

A follow up and maybe a dumb question: I’m trying to load multiple scripts now, as the Mediaelement allows plugin scripts. I want to make sure all the scripts load before returning the promise.

I’ve tried to do it through looping through the constants of the script sources and then creating an array of promises, then using Promise.all() for the initializing of the players, and yet when I do, I’m getting an error saying that mejs is not found, which I believe is the namespace or something for calling different functions within the mediaelement-and-player.

image
image722×464 67 KB

      let scripts_loaded = [];
      
      MEDIA_ELEMENT_SCRIPTS.forEach(function (src, index){
          scripts_loaded[index] = loadScript(src);
      });
      
      Promise.all(scripts_loaded).then(() => {
            audioplayers.forEach(function (el) {
              new MediaElementPlayer(el, MEDIA_ELEMENT_CONFIG);
            });
      });

However, if I chain them manually, it seems to work, as such:

      loadScript(MEDIA_ELEMENT_SRC).then(() => {
          loadScript(MEDIA_ELEMENT_SPEED_SRC).then(() => {
            loadScript(MEDIA_ELEMENT_SKIP_BACK_SRC).then(() => {
                loadScript(MEDIA_ELEMENT_JUMP_FORWARD_SRC).then(() => {
                    audioplayers.forEach(function (el) {
                        new MediaElementPlayer(el, MEDIA_ELEMENT_CONFIG);
                    });
                });
            });
        });
      });

In this instance, I’m only using a handful of scripts, so I just manually typed them all in, I was just curious if I’m missing something obvious about the Promise.all() function, or if there is a Discourse function that allows me to load multiple scripts from an array.