changeset 452:b4372cdf495c

Firefox doesn't seem to populate the MIME type field of MediaRecorder. Do some naive deducing of MIME type based on testing support for some known types and constructing MediaRecorder with the first one that passes. Fall back to implementation default of none of the types are supported.

--- a/src/app/services/audio-recorder/audio-recorder.service.ts	Thu Jun 29 13:21:51 2017 +0100
+++ b/src/app/services/audio-recorder/audio-recorder.service.ts	Thu Jun 29 14:34:16 2017 +0100
@@ -109,6 +109,11 @@
   newRecording$: Observable<Blob>;
   private isRecording: boolean;
   private chunks: Blob[];
+  private knownTypes = [
+    {mimeType: 'audio/ogg', extension: 'ogg'},
+    {mimeType: 'audio/webm', extension: 'webm'},
+    {mimeType: 'audio/wav', extension: 'wav'}
+  ];
 
   constructor(@Inject('AudioInputProvider') requestProvider: AudioInputProvider,
               @Inject(
@@ -127,10 +132,18 @@
 
   private getRecorderInstance(): Promise<MediaRecorder> {
     return this.requestProvider().then(stream => {
-      const recorder = new this.recorderImpl(stream);
+      const supported = this.knownTypes.find(
+        ({mimeType, extension}) => this.recorderImpl.isTypeSupported(mimeType)
+      );
+      const recorder = new this.recorderImpl(stream, supported ? {
+        mimeType: supported.mimeType
+      } : {});
+
       recorder.ondataavailable = e => this.chunks.push(e.data);
       recorder.onstop = () => {
-        const blob = new Blob(this.chunks, {'type': recorder.mimeType});
+        const blob = new Blob(this.chunks, {
+          'type': recorder.mimeType || supported.mimeType
+        });
         this.chunks.length = 0;
         this.ngZone.run(() => {
           this.newRecording.next(