Prevent video elements from being mistakenly muted/unmuted

This commit is contained in:
Robin Townsend 2022-05-23 09:16:40 -04:00
parent 7d44a1e979
commit 2acb6825e9

View file

@ -27,10 +27,21 @@ export function useMediaStream(stream, audioOutputDevice, mute = false) {
);
if (mediaRef.current) {
const mediaEl = mediaRef.current;
if (stream) {
mediaRef.current.muted = mute;
mediaRef.current.srcObject = stream;
mediaRef.current.play();
mediaEl.muted = mute;
mediaEl.srcObject = stream;
mediaEl.play();
// Unmuting the tab in Safari causes all video elements to be individually
// unmuted, so we need to reset the mute state here to prevent audio loops
const onVolumeChange = () => {
mediaEl.muted = mute;
};
mediaEl.addEventListener("volumechange", onVolumeChange);
return () =>
mediaEl.removeEventListener("volumechange", onVolumeChange);
} else {
mediaRef.current.srcObject = null;
}