For some reason Safari 12 (haven't tried on other versions) is completely ignoring getUserMedia constraints.
My code looks something like this
navigator.mediaDevices.getUserMedia({
video: {
facingMode: 'environment',
width: {
min: 640,
ideal: 1280
}
},
audio: true
})
.then(userStream)//Safari on Mac ignores constraints and ends up executing here
.catch(fallback)//Chrome on Mac raises and error and ends up executing here
On Chrome when I do stream.getVideoTracks()[0].getConstraints() I get exactly what is expected - constraints listed above.
When I do the same in Safari I get an empty object.
Problem arises when I try to force using a back camera (for mobile devices), then catch errors to fallback to front camera.
Chrome on Mac properly raises an error and falls back to front camera.
Safari on Mac does not raise any errors, when being forced to use back camera, resulting in wrong properties further in my app.
Have searched SO, getUserMedia and still can't find any solutions or even someone having the same problem.
Maybe there is a better way to determine if a device have front/back cameras available?
EDIT:
getSupportedConstraints() function correctly returns that facingMode is supported. Problem is that it is ignored when set.
As for the getConstraints() function not being supported - that might be the case, but that is not the issue. The issue is enforcement of the supported constraints (facingMode in this case).
This problem can be easily replicated with the code provided, if you try to setting facingMode: 'environment' and try opening the same code from Chrome and from Safari.
