Templates Plugins Courses

Audio Recorder Mobile Issue with "record" CTA ON iOS

The plugin works but the author is handling the Mic permission message incorrectly in iOS devices. iOS devices and Safari in general are a bit behind the accepted norms compared to other OS. What needs to happen is after the permission is accepted the audio recorder plugin needs to stop recording (as the stream will be empty) then re-initialize the recording for the audio stream to be populated.

You can confirm this by following the below steps:
Click Mic > Approve Mic access > click mic again > click mic again > close popup > open popup and begin to record normally.
What this author is doing is that he is making an assumption that the mic request permission is pre-approved.

Has anyone found a solution for this?

1 Like

Hi @hdboal,
Thank you for reaching out and for your purchase.

I’ve carefully checked your application on different devices (iOS, android, and Windows) with different browsers, once I allow access to the microphone, I can start the recording and stop it, and the recording is saved afterward.
Unfortunately, I couldn’t note any described issues.

Would it be convenient for you to share a screencast recording and screenshots of your workflow setup?

Thank you and looking forward to your reply.
Best regards,

Thank you for your quick reply @Igor.

I was only able to find an option to attach photos (not video) so I’ve shared a YouTube link screencasting the issue. Note: In this video, I am using an iPhone 13 and Safari—the issue occurs both in private and normal browsing modes.

When I change prompts, the update automatically saves, as intended. When I select the record icon, it turns red and requests permission to begin recording, as intended. But when I press the icon again to stop recording, the recording does not appear to stop nor automatically save. Although the color reverts back to black, the recording appears to still be active in the background until the page is refreshed and any recording is lost.

Your help is much appreciated.

Hi @hdboal,
Thank you for your reply and for the video.

Due to the fact that we have additional questions regarding your setup, can you please add our Support Team email to the list of collaborators to your application and provide a link to your app? This will allow us to check your settings and reproduce them on our side to find the issue.

To add our Support Team as a collaborator, you need to do the following steps in the Bubble Editor:
Settings > Collaboration > Add email support@zeroqode.com

Note: avoid the warning message regarding the plan, as we are an agency and you can easily add us to your collaborators.

Looking forward to your reply. :pray:

Hi @Igor,

I have added the email you listed above as a collaborator. Below is a link to the app.

Thank you.

Hi @hdboal,
Thank you for adding our email to the list of collaborators and sorry for the late reply due to the weekend.

I was able to reproduce the mentioned issue when using the Safari browser. I’ve passed it to the dev team for additional research, once any news will become available I will let you know asap.

Thank you for your understanding and cooperation. :pray:
All the best,

Sounds good, thank you @Igor. I’ll be standing by.

Hi @hdboal,
Thank you for your patience.

We’ve carefully checked your setup inside the app and tested it in a few browsers, due to the specific of Safari browser, it is asking for permission to record every time the page is refreshed.
Basically, when clicking the first time for the Microphone icon, this triggers the permission window, you click on allow to record and have to click again to start the recording itself, the third time you click on the microphone, the recording stops, and saves for the Current User.

I’m afraid we can’t do much about this or adapt the plugin only for the specific browser, since the Safari browser itself works this way, you can add a little note with instructions for users that are using your app with Safari.

Usually, we don’t do any customization work inside the user’s app, but we’ve made an exception and modified it a bit the workflow, please check your app and let us know if everything works on your side.
Hope this will be useful for you. :pray:

In case there will be any other plugin-related questions, please don’t hesitate to contact me, I’ll be glad to help.
All the best, :slight_smile:

Hi @Igor,

Thank you for all your help. This is a helpful analysis. I tried recording in the app and it now appears to be working (iOS 16, Safari)!

If I’m understanding correctly, the workflow adjustment you made was to the order the user is asked to allow access to the microphone? So instead of requesting access when the user selects microphone, it seems you moved it up to when they open the “Record a Storey” modal, separating the actions so that by the time they hit the record button the plugin has been activated?

Thank you.

Hi @hdboal,
Thank you for your reply, glad it helped. :slightly_smiling_face:

Apparently, there were some workflow conditionals conflicting with the plugin action used in other workflows, so after disabling it, we run some tests and everything worked really well.
We had to make sure it was not a plugin Bug, otherwise, we had to fix it as quickly as possible. :slightly_smiling_face:

In case there will be any other plugin-related questions, please don’t hesitate to contact me, I’ll be happy to help.
Also, if you like our plugin, you can rate it by going to the Plugins tab in the Bubble editor and share your experience with the rest of the Bubble community. You can find the plugin by name and give it as many stars as it deserves :pray:

Have a great day!

Best regards,