Check primary monitor in JavaScript with navigator.mediaDevices.getUserMedia

Question

I want to capture the main monitor by the browser. I'm trying to do it like this:

navigator.mediaDevices.getDisplayMedia({
      video: {
        displaySurface: 'monitor',
        logicalSurface: true,
        cursor: 'always',
        frameRate: {
            ideal: 20
        }
    }
})

Next, the user chooses which screen he will broadcast. I want to check that the user has selected the main monitor (in case there are several). How i can do this? Thanks.

Answer 1

By checking displaySurface.

navigator.mediaDevices.getDisplayMedia({
        video: {
            displaySurface: 'monitor',
            logicalSurface: true,
            cursor: 'always',
            frameRate: {
                ideal: 20
            }
        }
    })
    .then((strm) => {
        let displaySurface = strm.getVideoTracks()[0].getSettings().displaySurface;
        console.log(displaySurface);
        if (displaySurface !== 'monitor') {
          // do your stuff...
        }
    })
    .catch((err) => console.error(err));