How do I get Chrome and / or Firefox to play <audio> elements in Karma tests?

Question

I'm working on a library that can extract audio from HTML5 elements <audio>and <video>and send it to a remote server for speech to text processing. (for example, automatic subtitles.) When I test manually, everything works as expected, but when karma starts my test, it always fails for the elements <audio>.

In the context of HTML5, an audio script processors immediately receive an audio stream as soon as they are connected to the element <audio>but it is all 0 (no sound) until the element starts playing.

When my tests are performed in karma, it seems that the element never begins to play; I just get 0, although I named .play()for the element. In addition, I do not hear the sound coming out of my speakers, which should happen at the same time.

(I get that the sound during the tests can be very annoying and probably should be turned off by default, but is there a way to turn it on for cases like mine?)

If you are interested in seeing the code, it is located at https://github.com/watson-developer-cloud/speech-javascript-sdk , but it is still a bit of a mess, and it is currently set up to skip tests that fail. If necessary, I will try to set up a truncated example, but I hope that I do not need it.

I'm on OS X if that matters. I have not tried this on Windows or Linux yet.

Answer 1

Found, at least for firefox. Elements <audio>seem to have stronger CORS rules than I understood! I set the header Access-Control-Allow-Origin: *on my file server because I knew it was on a different port, and then when Karma runs my tests, but apparently this is not enough.

, , - CORS . , scriptProcessors <audio> crossOrigin, <img> <canvas>.

, ,

  var audioElement = new Audio();
  audioElement.src = "http://localhost:9877/audio.wav";

  var audioElement = new Audio();
  audioElement.crossOrigin = "anonymous";
  audioElement.src = "http://localhost:9877/audio.wav";

firefox, , , , (, ?).

, chrome , .play(), , ended.. , , , . , canplaythrough, .play(), , , .

Answer 2

<audio>, ( ).

, , , /.

, , ", " .