Fix Firefox keyframing

- Firefox does not expect us to stop the underlying MediaStreamTrack, but Chrome does
aws · Dec 20, 2019 · eff5994 · eff5994
1 parent ed3a657
commit eff5994
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 7 deletions.
diff --git a/demos/browser/package.json b/demos/browser/package.json
@@ -31,7 +31,7 @@
   },
   "dependencies": {
     "amazon-chime-sdk-js": "file:../..",
-    "aws-sdk": "^2.592.0",
+    "aws-sdk": "^2.594.0",
     "bootstrap": "^4.3.1",
     "compression": "^1.7.4",
     "jquery": "^3.4.1",

diff --git a/src/mediarecording/WebMMediaRecording.ts b/src/mediarecording/WebMMediaRecording.ts
@@ -1,25 +1,29 @@
 // Copyright 2019 Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 
+import DefaultBrowserBehavior from '../browserbehavior/DefaultBrowserBehavior';
 import Maybe from '../maybe/Maybe';
 import MediaRecording from './MediaRecording';
 import MediaRecordingEvent from './MediaRecordingEvent';
 import MediaRecordingOptions from './MediaRecordingOptions';
 
 export default class WebMMediaRecording implements MediaRecording {
-  static readonly options: MediaRecorderOptions = {
+  private static readonly browser = new DefaultBrowserBehavior();
+  private static readonly options: MediaRecorderOptions = {
     mimeType: 'video/webm; codecs=vp8',
   };
 
   private delegate: MediaRecorder | null = null;
   readonly options: MediaRecorderOptions;
-  readonly mediaStream: MediaStream;
   private timeSliceMs: number;
   private listeners = new Map<string, Set<EventListener>>();
 
-  constructor(mediaStream: MediaStream, options: MediaRecordingOptions = {}) {
+  constructor(
+    private mediaStream: MediaStream,
+    options: MediaRecordingOptions = {},
+    private browser: DefaultBrowserBehavior = WebMMediaRecording.browser
+  ) {
     this.options = { ...options, ...WebMMediaRecording.options };
-    this.mediaStream = mediaStream;
   }
 
   key(): void {
@@ -41,7 +45,9 @@ export default class WebMMediaRecording implements MediaRecording {
       });
     });
     if (delegate !== null) {
-      delegate.stream.getTracks().forEach(stream => stream.stop());
+      if (this.browser.isChrome()) {
+        delegate.stream.getTracks().forEach(stream => stream.stop());
+      }
       delegate.stop();
     }
     this.delegate.start(this.timeSliceMs);

diff --git a/test/mediarecording/WebMMediaRecording.test.ts b/test/mediarecording/WebMMediaRecording.test.ts
@@ -5,6 +5,7 @@ import Substitute from '@fluffy-spoon/substitute';
 import * as chai from 'chai';
 import * as chaiAsPromised from 'chai-as-promised';
 
+import DefaultBrowserBehavior from '../../src/browserbehavior/DefaultBrowserBehavior';
 import MediaRecordingOptions from '../../src/mediarecording/MediaRecordingOptions';
 import WebMMediaRecording from '../../src/mediarecording/WebMMediaRecording';
 import CustomEventMock from '../customeventmock/CustomEventMock';
@@ -29,7 +30,8 @@ describe('WebMMediaRecording', () => {
     describe('with start', () => {
       it('is keyed', () => {
         const mediaStream = Substitute.for<MediaStream>();
-        mediaStream.getTracks().returns(Array.of(Substitute.for<MediaStreamTrack>()));
+        const mediaTrack = Substitute.for<MediaStreamTrack>();
+        mediaStream.getTracks().returns(Array.of(mediaTrack));
         mediaStream.clone().returns(mediaStream);
         const subject = new WebMMediaRecording(mediaStream);
         subject.start(1000);
@@ -42,6 +44,22 @@ describe('WebMMediaRecording', () => {
         new WebMMediaRecording(Substitute.for<MediaStream>()).key();
       });
     });
+
+    describe('with Chrome', () => {
+      it('is keyed', () => {
+        const browser = Substitute.for<DefaultBrowserBehavior>();
+        const mediaStream = Substitute.for<MediaStream>();
+        const mediaTrack = Substitute.for<MediaStreamTrack>();
+        mediaTrack.stop().returns();
+        mediaStream.getTracks().returns(Array.of(mediaTrack));
+        mediaStream.clone().returns(mediaStream);
+        browser.isChrome().returns(true);
+        const subject = new WebMMediaRecording(mediaStream, {}, browser);
+        subject.key();
+        subject.key();
+        mediaTrack.received().stop();
+      });
+    });
   });
 
   describe('with MediaRecordingOptions', () => {