DefaultVideoTransformDevice is not working on Safari

[artem6connex]

What happened and what did you expect to happen?

DefaultVideoTransformDevice is not working on Safari v15.1
I can not see my own video tile but other attendees are able to see it

I assume it's happening because of this issue on Safari
If not let me know what causes this problem and is there any workaround to fix it?

P.S. I've checked your demo and you've got the same problems with Safari as well

Have you reviewed our existing documentation?

• GitHub issues
• FAQs page
• README page
• Feature-specific guides

Reproduction steps

try to use DefaultVideoTransformDevice

Amazon Chime SDK for JavaScript version

2.20.1

What browsers are you seeing the problem on?

Safari

Browser version

15.1

Meeting and Attendee ID Information.

No response

Browser console logs

no logs

[ltrung]

This is documented in the known issue thread #1059. Video transform does not work in Safari 15 due to:

Video Frame Processor does not work in Safari 15 and will throw OverconstrainedError (Safari 15 bug).
Video Frame Processor sends black or red images in Safari 15 due to a bug in canvas.captureStream (Safari 15 bug). For a temporary workaround, you can copy the output content in VideoFrameProcessor.process method to another canvas and use that canvas to render the output video.

The first bug with Overconstrained seems to have been fixed in the Technology Preview but I can still the see the second issue with black/ red image on the local client.
For the workaround, can you follow the suggestion above and copy the output content in VideoFrameProcessor.process method to another canvas and use that canvas to render the output video instead of binding to a video element?

[artem6connex]

@ltrung Thank you for the response!
I'm gonna implement this workaround
hope it'll fix my issue

[devalevenkatesh]

Closing the issue due to the provided FAQ and added workaround. Please feel free to re-open if still an issue.