This is a remote desktop application via Chrome where the user shares their screen. The problem I am having is when the user has 2 or more screens, WebRTC only gets the first display's resolution. I can see this by logginglocalStream.getVideoTracks()[0].getSettings():

aspectRatio: 1.7777777777777777
deviceId: "screen:-1:0"
frameRate: 30
height: 1080
resizeMode: "crop-and-scale"
width: 1920

Both screens end up streaming in one connection (getVideoTrracks()[1] does not exist), but it only shows as one screen. The width should be 1920 * 2 screens at 3840.

My constraints and getting media are set as:

let mediaConstraints = {
  audio: false,
  resizeMode: "none",
  video: {
    mandatory: {
      chromeMediaSource: "desktop",
    },
  },
};

localStream = await navigator.mediaDevices.getUserMedia(mediaConstraints);

I noticed crop-and-scale was set instead of none, and thought that might be causing a problem but I can't seem to get it to set for this kind of constraint. aspectRatio did nothing as well. Setting resizeMode within mandatory throws an error. Where am I going wrong here?