How can a MediaStream (microphone) be used in several functions?

Hello developers,

In my webapp I use a MediaStream (microphone) to convert the spoken word into text. (SpeechToText API)
For this, the MediaStream is passed to an NPM package function.

Before that, however, the stream is to run through another function in which the MediaStream is used to style a speech visualisation.

This works without any problems under Windows 10 and Android. So I get the visualisation styled and the language converted to text.

Unfortunately, this does not work on iOS (not yet tested on macOS). Only the language is converted to text, but the visualisation does not work.

I was able to find out through other forums that it is probably because the functions duplicate the stream and thus the first stream that goes into the visualisation is muted and only the second stream can use the language for the text output.

If I comment out the language for the text function, the visualisation works perfectly.

Is there a trick or solution to use a stream through both functions?

btw. MediaStream.clone() does not work either.

Attached again is a sketch of my code:

Code Block 
navigator.mediaDevices.getUserMedia({
        audio: true,
        video: false
      }).then((stream)=>{ 
       this.voiceVisualization(stream); // not working
       recognizeMic({MediaStream: stream}); // working
});

Any idea?

Many thanks in advance for your support.
Cheers Saintenr