Bug 220326

Created attachment 417000 [details]
Screenshots of different states of camera preview before and after rotation

A simple preview of `getUserMedia` video stream is cropped or zoomed after device rotation. It happens randomly and unpredictable.

Steps to reproduce:
- Open https://webrtc.github.io/samples/src/content/getusermedia/gum/ and click "Open camera", confirm camera access to see the preview
- Rotate device for 90°
- Rotate device back
- Repeat to see different results

What happens on my iPhone SE (v14.3, Safari v14.0.2):
- When rotated to landscape - sometimes - cam seems like zoomed out to just fill a quarter of the video element (rest is black)
- When rotated to portrait - sometimes - cam seems like zoomed in to double size
- When rotated to portrait - sometimes - cam seems like cropped the bottom half (black bars)
- Sometimes after a rotation cam is correct

What should happen instead:
- No cropped parts
- No zoom

My observations:
I have tested with another device iPad Air 3 (v14.3) and it worked perfectly! I know that other users with their iPhones or iPads also have issues like black bars, cropped cam preview or even an offset of the cam preview within the video element.

I have tried to force video width and height in `getUserMedia` video constraints and/or force fixed width and height of video element, trigger stream update with `applyConstraints({ height: … })` or similar after `window.onrotationchange` event but nothing has solved the issue for me.

I've noticed that video track dimensions change after device orientation change event. It starts with 480x640 and after rotation it reports 640x480. ( `stream.getVideoTracks()[0].getSettings()` ) And for me on the iPhone SE it shows the same issues either with front- or backcamera.