Search code examples
javascriptwebrtc

Detect MediaStream pause on safari


So there is this option on Safari both on desktop and mobile where you can "Pause" your camera and microphone feed.

A screenshot of a dropdown menu in Safari browser showing active camera options

It's different from other browsers where you just revoke previously given access, as it doesn't change or trigger anything on the media stream whatsoever. It replaced the camera feed with a black screen and then turns off the camera on the device.

So track.onended doesn't trigger, MediaStreamTrack.readyState stays "live", stream.active return true etc.

I need this to trigger a warning or to end a webRTC video call if the client is trying to bypass the requirements of an active camera by pausing the camera feed after the initial setup.

So my question: is there an elegant way of detecting the "Safari pause" or my only option is to do some guestimating with image processing to detect a "black screen"? And if it's the latter I wouldn't mind a reference to some resources on how to achieve that.

Edit: I would like to catch the disabled camera clients before the webRTC call starts, so using bitrate to determine if the camera is active would be my last resort.


Solution

  • You can use the muted property on a MediaStreamTrack to check if it is "paused" in Safari.

    const tracks = mediaStream.getTracks();
    
    for (const track of tracks) {
        console.log(track.muted);
    }
    

    There is also a mute and unmute event dispatched whenever the muted property changes.