iOS Safari/Chrome Green Line in video on Left (Portrait) or Top (Landscape Left)

[alexandermaisey]

• [X] I have verified that the issue occurs with the latest twilio-video.js release and is not marked as a known issue in the CHANGELOG.md.
• [X] I reviewed the Common Issues and open GitHub issues and verified that this report represents a potentially new issue.
• [x] I verified that the Quickstart application works in my environment.
• [X] I am not sharing any Personally Identifiable Information (PII) or sensitive account information (API keys, credentials, etc.) when reporting this issue.

My users on iOS Safari and iOS Chrome are experiencing an issue where there is a thin green line along the side of their video while in Portrait orientation, and along the top when they are in Landscape (turned to the left). There is no green line visible anywhere on screen when Landscape (turned to the right). Additionally, this issue only occurs with the user-facing camera, not the environment-facing one. This green line is visible in the user's preview of their video track, in addition to output on the other side of the video call.

Portrait (image edited for privacy):

Landscape (turned to the left) (image edited for privacy):

This issue does not occur with other mobile devices or browsers (i.e. Android Firefox, etc.), Windows or macOS PC versions or browsers.

Software versions:

• Browser(s): iOS Safari, iOS Chrome
• Operating System: iOS 15.1 - 16.1 (inclusive)
• twilio-video.js: 2.26.1

[alexandermaisey]

Additional information: By removing the aspectRatio property in constraints, the green line no longer appears.

[manjeshbhargav]

Hi @alexandermaisey ,

Thanks for reporting the issue. This most likely is a bug in iOS, so I will ask my QE team to reproduce and file a WebKit bug. Looks like you have a workaround (removing aspectRatio), so we will make sure to add this to our common issues.