Browse Source

Disable upload progress reporting if unsupported in browser.

Renée Kooi 6 years ago
parent
commit
b6df7174d5

+ 2 - 0
packages/@uppy/core/src/index.js

@@ -9,6 +9,7 @@ const getFileType = require('@uppy/utils/lib/getFileType')
 const getFileNameAndExtension = require('@uppy/utils/lib/getFileNameAndExtension')
 const generateFileID = require('@uppy/utils/lib/generateFileID')
 const getTimeStamp = require('@uppy/utils/lib/getTimeStamp')
+const supportsUploadProgress = require('./supportsUploadProgress')
 const Plugin = require('./Plugin') // Exported from here.
 
 /**
@@ -118,6 +119,7 @@ class Uppy {
       currentUploads: {},
       allowNewUpload: true,
       capabilities: {
+        uploadProgress: supportsUploadProgress(),
         resumableUploads: false
       },
       totalProgress: 0,

+ 30 - 0
packages/@uppy/core/src/supportsUploadProgress.js

@@ -0,0 +1,30 @@
+// Edge 15.x does not fire 'progress' events on uploads.
+// See https://github.com/transloadit/uppy/issues/945
+// And https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/12224510/
+module.exports = function supportsUploadProgress () {
+  const userAgent = typeof navigator !== 'undefined' ? navigator.userAgent : null
+  // Assume it works because basically everything supports progress events.
+  if (!userAgent) return true
+
+  const m = /Edge\/(\d+\.\d+)/.exec(userAgent)
+  if (!m) return true
+
+  const edgeVersion = m[1]
+  const [major, minor] = edgeVersion.split('.')
+
+  // Worked before:
+  // Edge 40.15063.0.0
+  // Microsoft EdgeHTML 15.15063
+  if (major < 15 || (major === 15 && minor < 15063)) {
+    return true
+  }
+
+  // Fixed in:
+  // Microsoft EdgeHTML 18.18218
+  if (major > 18 || (major === 18 && minor > 18218)) {
+    return true
+  }
+
+  // other versions don't work.
+  return false
+}

+ 12 - 2
packages/@uppy/status-bar/src/StatusBar.js

@@ -214,6 +214,13 @@ const ProgressDetails = (props) => {
   </div>
 }
 
+const UnknownProgressDetails = (props) => {
+  return <div class="uppy-StatusBar-statusSecondary">
+    { props.i18n('filesUploadedOfTotal', { complete: props.complete, smart_count: props.numUploads }) + ' \u00B7 ' }
+    { props.i18n('progressUnavailable') }
+  </div>
+}
+
 const UploadNewlyAddedFiles = (props) => {
   const uploadBtnClassNames = classNames(
     'uppy-u-reset',
@@ -241,6 +248,7 @@ const ProgressBarUploading = (props) => {
     return null
   }
 
+  const supportsUploadProgress = props.capabilities.uploadProgress
   const title = props.isAllPaused ? props.i18n('paused') : props.i18n('uploading')
   const showUploadNewlyAddedFiles = props.newFiles && props.isUploadStarted
 
@@ -248,9 +256,11 @@ const ProgressBarUploading = (props) => {
     <div class="uppy-StatusBar-content" aria-label={title} title={title}>
       { !props.isAllPaused ? <LoadingSpinner {...props} /> : null }
       <div class="uppy-StatusBar-status">
-        <div class="uppy-StatusBar-statusPrimary">{title}: {props.totalProgress}%</div>
+        <div class="uppy-StatusBar-statusPrimary">
+          {supportsUploadProgress ? `${title}: ${props.totalProgress}%` : title}
+        </div>
         { !props.isAllPaused && !showUploadNewlyAddedFiles && props.showProgressDetails
-          ? <ThrottledProgressDetails {...props} />
+          ? (supportsUploadProgress ? <ThrottledProgressDetails {...props} /> : <UnknownProgressDetails />)
           : null
         }
         { showUploadNewlyAddedFiles ? <UploadNewlyAddedFiles {...props} /> : null }

+ 1 - 0
packages/@uppy/status-bar/src/index.js

@@ -40,6 +40,7 @@ module.exports = class StatusBar extends Plugin {
         },
         dataUploadedOfTotal: '%{complete} of %{total}',
         xTimeLeft: '%{time} left',
+        progressUnavailable: 'Unknown time left',
         uploadXFiles: {
           0: 'Upload %{smart_count} file',
           1: 'Upload %{smart_count} files'