search

twilio / twilio-video-app-react

A collaboration application built with the twilio-video.js SDK and React.js
Apache License 2.0
1.81k stars 728 forks source link

iOS 15 Safari remote audio minimal/soft at max volume #650

Closed matstc closed 2 years ago

matstc commented 2 years ago

Describe the bug I'm creating this issue to track this downstream bug in twilio-video.js. That bug seems to be the cause of quiet audio for many users of our app. I suspect this bug affects most apps using twilio-video-app-react.

To Reproduce See link above.

Additional context There's a workaround mentioned but it requires access to the remote audio stream. I can only find a way to get access to the tracks.

I'd be grateful if someone could advise on how to implement this workaround in this codebase, or on how to get access to the remote audio stream.

Thanks!

timmydoza commented 2 years ago

Hey @matstc - great question!

Getting the the MediaStream for an audio track can be a little complicated, but it's definitely possible. In fact, we already do it in the AudioLevelIndicator.tsx component.

What's tricky, is that we can't just access the track's MediaStream. Instead, we need to access the track's MediaStreamTrack, and use that to create a MediaStream object. What's even trickier, is that the twilio-video SDK may restart the MediaStreamTrack at any time (most likely on mobile Safari), so we need to watch out for that, but the useMediaStreamTrack.ts hook already accounts for this.

Anyway, lots of these things are already taken into account in that AudioLevelIndicator.tsx component, so I think that would be a great place to implement the workaround. Every participant in the room will already have an AudioLevelIndicator displayed on top of their video. Try adding the workaround code inside of the initializeAnalyser function. I think this would be a convenient place to add it, since the AudioContext and MediaStream objects are already available. The AudioLevelIndicator.tsx component component will automatically take care of the weird edge cases regarding mobile devices, and the restarting of MediaStreamTracks.

Looks like this issue has been fixed in iOS 15.4.0, which should hopefully be rolled out soon. In the meantime, please let me know how this workaround works for you, and if you have any other questions. I'll leave this issue open until we see a fix rolled out in iOS Safari.

Thanks!

matstc commented 2 years ago

Hi @timmydoza. Thanks a lot for the detailed response, that's very helpful.

The priorities have shifted a bit on our end so the new iOS release might or might not beat me to it. I'll come back here with details if I end up with a good workaround.

Thanks.

timmydoza commented 2 years ago

Looks like this has been fixed in iOS 15.4! Please let me know if you have any other questions.