bug: audio recording and playback is mostly broken on iOS and MacOS Safari

[megahirt]

Describe the bug
On iOS and MacOS Safari:

• recording from within LF on iOS fails silently (no user error message, no console error). A successful in-browser recording is marked is evident through the display of an audio length indicator (e.g. 00:07) after recording has finished. After recording and saving in iOS, the playback slider does not contain an audio length. If you click "play", the slider does not move and no audio can be heard. Clicking the "checkmark" button, the save button, the user will see an upload progress bar and a "file uploaded successfully" message, however these are false success messages.

On iOS:

• playback of in-browser recordings made in MacOS Chrome do not play back on iOS (likely due to a webm limitation)

On MacOS:

• playback of in-browser recordings made in MacOS Chrome are able to be played back as normal in Safari

Expected behavior
Audio recording in LF is a two step process:

• recording audio
• optionally play back audio before saving
• save/upload audio
• others, including yourself, can playback audio

Screenshots
Coming soon

[megahirt]

Additional information that I've uncovered from testing:

The audio is in fact being recorded and saved to the file system in all three of these cases, however the encoding + container is causing playback issues (confirmed via ffprobe analysis):

• MacOS Chrome (opus + webm) saved as .webm
• MacOS Safari (aac + m4a) saved as .webm (this is problematic and should be fixed)
• iOS on iPad (aac + m4a) saved as .webm (same problem as above)

I confirmed the existence of these files by doing a send/receive after the recordings were saved and then saw them in FLEx's AudioVisual folder.

I also tested playback in FLEx from all three of these files and they all playback fine in FLEx even with the erronious webm extension.

At this point is seems like there is a bug where safari records as aac/m4a but the file saves at .webm. We should detect safari and write the correct file extension.

I do not know if Safari can be made to record as opus/webm but we should investigate that as well. Probably best to record in the same format cross-platform.

A second bug is that Safari doesn't seem to be able to playback opus/webm. More investigation needed.

TODO Testing:

• if we go with aac/m4a for safari recordings, test that these can be played back across all devices and platforms

[megahirt]

A potential work around until the filename bug is fixed:

• I was successfully able to successfully upload a m4a recording in safari on macOS and iOS if I record in a separate program and then use the upload file feature.