Sfoglia il codice sorgente

@uppy/screen-capture: don't install when unsupported (#3795)

* Improve screen recording check: mediaDevices supprted on mobile, getDisplayMedia is not

* Update docs, mentioing getDisplayMedia
Artur Paikin 2 anni fa
parent
commit
91e6ed2f99

+ 7 - 3
packages/@uppy/screen-capture/src/ScreenCapture.jsx

@@ -7,9 +7,14 @@ import CaptureScreen from './CaptureScreen.jsx'
 import packageJson from '../package.json'
 import locale from './locale.js'
 
+// Check if screen capturing is supported.
+// mediaDevices is supprted on mobile Safari, getDisplayMedia is not
+function isScreenRecordingSupported () {
+  return window.MediaRecorder && navigator.mediaDevices?.getDisplayMedia // eslint-disable-line compat/compat
+}
+
 // Adapted from: https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia
 function getMediaDevices () {
-  // check if screen capturing is supported
   return window.MediaRecorder && navigator.mediaDevices // eslint-disable-line compat/compat
 }
 
@@ -79,8 +84,7 @@ export default class ScreenCapture extends UIPlugin {
   }
 
   install () {
-    // Return if browser doesn’t support getDisplayMedia and
-    if (!this.mediaDevices) {
+    if (!isScreenRecordingSupported()) {
       this.uppy.log('Screen recorder access is not supported', 'error')
       return null
     }

+ 2 - 0
website/src/docs/screen-capture.md

@@ -10,6 +10,8 @@ tagline: "upload selfies or audio / video recordings"
 
 The `@uppy/screen-capture` plugin can record your screen or an application and save it as a video.
 
+This plugin now only works on desktop browsers which support [`getDisplayMedia API`](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getDisplayMedia). If no support for the API is detected, Screen Capture won’t be installed, so you don’t have to do anything.
+
 > To use the screen capture plugin in a Chromium-based browser, [your site must be served over https](https://developers.google.com/web/updates/2015/10/chrome-47-webrtc#public_service_announcements). This restriction does not apply on `localhost`, so you don’t have to jump through many hoops during development.
 
 ```js