Video data corrupted on some devices when screen is not rotated.

[fsuk]

Description

Using a web cam with my PC or a tablet I am able to succesfully record and store data as a file. When using my phone (Pixel 4a) the video streams to the player correclty whilst recording but once saved to a file and played the video is garbled with lines and green in the bottom quaters.

This issue only ocurrs when the phone is in portait mode not horizontal. My guess is the data is being transposed into the frames with the wrong orientation.

Steps to reproduce

Use a Pixel 4a (possibly other devices) to record using the example here:
https://collab-project.github.io/videojs-record/demo/audio-video.html

Results

Expected

Video as recorded.

Actual

Video appears garbled with green filling bottom part of the video.
MOBTAQ38AV8B877XT1ONTFFEMB2H7REW48Y0ZRPZO75SJ2OENZ.zip

Error output

No errors out put to console.

Additional Information

Please include any additional information necessary here. Including the following:

versions

videojs

videojs 7.15.4
videojs-record 4.5.0
recordrtc 5.62

browsers

Chome (Android)

OSes

Android

player.recordedData value onfinishRecord:

recordedData: Blob
lastModified: 1639146423777
lastModifiedDate: Fri Dec 10 2021 14:27:03 GMT+0000 (Greenwich Mean Time) {}
name: "1639146423777.webm"
size: 323618
type: "video/webm;codecs=vp8"
[[Prototype]]: Blob

[fsuk]

Does not appear to be a videojs-record issue but an issue with RecordRTC. Reproduced with this example:
https://www.webrtc-experiment.com/RecordRTC/

Will update this issue if I find anything with RecordRTC