How to fix "stretched view" of camera stream on some devices

I stream my "environment" camera to a video element on my DOM using navigator.mediaDevices.getUserMedia. The issue is that on my test-device (Samsung Tab) this video seems to be stretched. I'm not using any constraints other than facingMode: "environment", during my tests. I don't have this problem on my mobile device.

I already tried setting width and height constraints, this only works if I staticly set the values of my tablet cam, but my application has to support all devices. Note: my application is locked to portrait. built for android using cordova.

//code streaming

setup() {
    const constraints = {
      video: {
        facingMode: "environment",
        //tablet
        //width: {min:1280, ideal: width},
        //height: {min:720, ideal: height}
      },
      audio: false
    };

    navigator.mediaDevices.getUserMedia(constraints)
      .then(function (s) {
        video.srcObject = s;
        video.play();
      })
      .catch(function (err) {
        console.log("An error occured! " + err);
      });

    if(!this.get('streaming')) {
      video.addEventListener("canplay", function () {
        _this.set('videoReady', true);
        _this.processMedia();
      }, false);
    }
}
processMedia() {
    let _this = this;
    let video = document.getElementById('videoInput');
    if (!this.get('streaming')) {
      video.width = video.videoWidth;
      video.height = video.videoHeight;
      this.placeIndicators(video.width, video.height);
    }
   //process functionality//
}

Expected behaviour: to get a video element with my environment camera stream with a correct aspect ratio on all devices.

Actual behaviour: on my tablet my video stream is "stretched when the device is held landscape and "squeezed" when held portrait