Video freezes on first playback

Hi! This is my first forum post ever so I’m a little nervous but here goes.

I’m building an app where the user can watch an existing video while simultaneously recording a video of their own alongside it. I’m using the Expo Video component for the video player and Expo Camera to record. Currently I’m only developing & testing on iOS.

Versions:
expo: ^37.0.0
expo-av: ~8.1.0
expo-camera: ~8.2.0

Testing on iPhone 8.

Here is a Snack demonstrating the issue: https://snack.expo.io/@lachlanglen/playback-&-record

Bug:

When user selects “Show recording modal” and then presses red record button, the video that starts playing on the left side of the screen freezes after about 500ms. Importantly, no fields on the playback object change at the time of freezing (it still says that it is playing, even though it has frozen).

Upon freezing, if user presses the “Having a problem? Touch here to try again” button and then presses “Show recording modal” button again, and now starts recording again, the freeze does not happen.

I know that it is something to do with the cameraRef.recordAsync() function, as if I remove this the bug doesn’t happen. But obviously I need the user to be able to record!

I created the button workaround because it consistently fixes the issue the second time around, but it’s a terrible UX and I really need to figure out what is causing this and fix it if possible.

Thinking that it was an issue on the first call of recordAsync(), I tried a hack where I called recordAsync() and then stopRecording() before ultimately starting the playback and starting recording (a second time), but that didn’t work - it still froze.

I also tried starting the recording first and THEN starting the playback, but this didn’t fix the problem either.

I also created a version using a class component for the Modal but that also didn’t make a difference.

I am quite desperate to figure out what is going wrong here as I’ve been stuck with this bug for over a week. Any ideas/suggestions are gratefully received!

(Btw - in case the camera component isn’t properly accessing the camera on the Snack, I’ve put together a mini repo here where the bug is recreated in a blank tabs template. It’s exactly the same code as the snack.)

Does anyone have any thoughts on this? Still having this bug. Maybe I posted in the wrong channel?

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