Self video on iPhone not mirrored

Description
When I start the video with the option mirrored = true, my video is not mirrored correctly (when I raise my right hand, the opposite hand appears in the video) on iPhone.
However, it works fine on other OS (Android, Windows, macOS, iPadOS).

Browser Console Error
No errors appear.

Which Web Video SDK version?
1.11.10

Device (please complete the following information):

  • Device: iPhone 12
  • OS: iOS 17.5.1
  • Browser: Safari
  • Browser Version: Safari 17.5.1

Hey @phuongnv1

Thanks for your feedback.

There are some issues with the mirror option in the stream.startVideo method on certain platforms. Currently, a workaround is to call the stream.mirrorVideo method right after the startVideo method is resolved.

Thanks
Vic

Key @vic.yang

I tried calling stream.mirrorVideo right after startVideo. Here is my code:

await stream.startVideo({cameraId, hd, originalRatio}); stream.mirrorVideo(true);

I noticed that the result didn’t change.
Please help me check it.

Hey @phuongnv1

Sorry for the incorrect guidance. To be precise, stream.mirrorVideo should be performed after rendering the self-view.

Thanks
Vic

Hey @vic.yang
Thank you for your feedback.

I tried running stream.mirrorVideo right after stream.renderVideo or stream.attachVideo. However, I had to delay it by about 200ms for it to work (which doesn’t seem great from a UX perspective).

When I turn off the camera and turn it back on (handling it the same way as above), it seems the mirrorVideo function doesn’t work.

I want to ask if, when the user changes position or turns the camera off and back on, do I need to call the mirrorVideo function after rendering the self-view.

Another approach is that I want to use CSS (transform: scaleX(-1) on the video-player element) to flip the video, but it doesn’t work.

Thanks
Phuong

Hey @phuongnv1

Thanks for your feedback.

When I turn off the camera and turn it back on (handling it the same way as above), it seems the mirrorVideo function doesn’t work.

Perhaps when you detached the video, you also deleted the corresponding video player. So, the next time you attach the video, the video player is a new element, which means the original mirror effect won’t take effect.

Another approach is that I want to use CSS (transform: scaleX(-1) on the video-player element) to flip the video, but it doesn’t work.

It only takes effect on certain platforms such as iOS. We recommend using stream. mirrorVideo method.

Thanks
Vic

Hey @vic.yang

Thanks for your feedback, and sorry for my delayed reply.

Perhaps when you detached the video, you also deleted the corresponding video player. So, the next time you attach the video, the video player is a new element, which means the original mirror effect won’t take effect.

I think this is not the root cause. When I run mirrorVideo on iPhone, an error is thrown from the SDK.

This is my sessionId: hC7qVb4DSBSJQ50CyW4cAA==

Please check for me.

Thanks
Phuong

Hey @phuongnv1

Thanks for sharing the session ID with us.

hC7qVb4DSBSJQ50CyW4cAA==

After analyzing the logs for this session, we identified a known issue: the loadedmetadata event for the video tag was not triggered.

We rely on this event to determine whether the video can play. Can I confirm whether the self-view also had an issue when this problem occurred? We are continuously looking for ways to fix this issue.

Thanks
Vic

Hey @vic.yang

Can I confirm whether the self-view also had an issue when this problem occurred?

When this error occurs, I see that the self-video still works normally.

I hope you will have the latest fix for this issue.

Thanks
Phuong

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.