feat: try to use video/webm;codecs=H264 and fix storybook

fbaiodias · Nov 27, 2018 · d101187 · d101187
1 parent c0e9db3
commit d101187
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 6 deletions.
diff --git a/src/video-recorder.js b/src/video-recorder.js
@@ -13,13 +13,16 @@ const chunkSizeInMS = 250
 const dataCheckInterval = 2000 / chunkSizeInMS
 
 const getMimeType = () => {
-  let mimeType = 'video/webm;codecs=vp9'
+  let mimeType = 'video/webm;codecs=H264'
   if (!window.MediaRecorder.isTypeSupported(mimeType)) {
-    mimeType = 'video/webm;codecs=vp8'
+    mimeType = 'video/webm;codecs=vp9'
     if (!window.MediaRecorder.isTypeSupported(mimeType)) {
-      mimeType = 'video/webm'
+      mimeType = 'video/webm;codecs=vp8'
       if (!window.MediaRecorder.isTypeSupported(mimeType)) {
-        mimeType = ''
+        mimeType = 'video/webm'
+        if (!window.MediaRecorder.isTypeSupported(mimeType)) {
+          mimeType = ''
+        }
       }
     }
   }

diff --git a/src/video-recorder.stories.js b/src/video-recorder.stories.js
@@ -1,9 +1,9 @@
 import React from 'react'
 import { storiesOf } from '@storybook/react'
-import styled, { injectGlobal } from 'styled-components'
+import styled, { createGlobalStyle } from 'styled-components'
 import VideoRecorder from './video-recorder'
 
-injectGlobal`
+const GlobalStyle = createGlobalStyle`
   html, body, #root {
     height: 100%;
     margin: 0;
@@ -33,13 +33,15 @@ storiesOf('VideoRecorder', module)
   .add('default', () => {
     return (
       <Wrapper>
+        <GlobalStyle />
         <VideoRecorder onRecordingComplete={handleRecordingComplete} />
       </Wrapper>
     )
   })
   .add('isOnInitially', () => {
     return (
       <Wrapper>
+        <GlobalStyle />
         <VideoRecorder
           isOnInitially
           onRecordingComplete={handleRecordingComplete}