Browse Source

Merge pull request #1376 from transloadit/fix/progress-again

YMPT™: Yet More Progress Tweaks
Artur Paikin 6 years ago
parent
commit
6a5c25f7ab

+ 2 - 2
packages/@uppy/companion/src/server/provider/drive/adapter.js

@@ -14,8 +14,8 @@ exports.isFolder = (item) => {
   return item.mimeType === 'application/vnd.google-apps.folder' || item.kind === 'drive#teamDrive'
 }
 
-exports.getItemData = (item) => {
-  return Object.assign({}, item, { size: parseFloat(item.size) })
+exports.getItemSize = (item) => {
+  return parseInt(item.size, 10)
 }
 
 exports.getItemIcon = (item) => {

+ 1 - 0
packages/@uppy/companion/src/server/provider/drive/index.js

@@ -146,6 +146,7 @@ class Drive {
         thumbnail: uppy.buildURL(adapter.getItemThumbnailUrl(item), true),
         requestPath: adapter.getItemRequestPath(item),
         modifiedDate: adapter.getItemModifiedDate(item),
+        size: adapter.getItemSize(item),
         custom: {
           isTeamDrive: adapter.isTeamDrive(item)
         }

+ 4 - 0
packages/@uppy/companion/src/server/provider/dropbox/adapter.js

@@ -6,6 +6,10 @@ exports.isFolder = (item) => {
   return item['.tag'] === 'folder'
 }
 
+exports.getItemSize = (item) => {
+  return item.size
+}
+
 exports.getItemIcon = (item) => {
   return item['.tag']
 }

+ 2 - 1
packages/@uppy/companion/src/server/provider/dropbox/index.js

@@ -164,7 +164,8 @@ class DropBox {
         id: adapter.getItemId(item),
         thumbnail: uppy.buildURL(adapter.getItemThumbnailUrl(item), true),
         requestPath: adapter.getItemRequestPath(item),
-        modifiedDate: adapter.getItemModifiedDate(item)
+        modifiedDate: adapter.getItemModifiedDate(item),
+        size: adapter.getItemSize(item)
       })
     })
 

+ 4 - 4
packages/@uppy/core/src/__snapshots__/index.test.js.snap

@@ -27,14 +27,14 @@ Object {
       "name": "foo.jpg",
       "preview": undefined,
       "progress": Object {
-        "bytesTotal": 0,
+        "bytesTotal": null,
         "bytesUploaded": 0,
         "percentage": 0,
         "uploadComplete": false,
         "uploadStarted": false,
       },
       "remote": "",
-      "size": 0,
+      "size": null,
       "source": "jest",
       "type": "image/jpeg",
     },
@@ -50,14 +50,14 @@ Object {
       "name": "bar.jpg",
       "preview": undefined,
       "progress": Object {
-        "bytesTotal": 0,
+        "bytesTotal": null,
         "bytesUploaded": 0,
         "percentage": 0,
         "uploadComplete": false,
         "uploadStarted": false,
       },
       "remote": "",
-      "size": 0,
+      "size": null,
       "source": "jest",
       "type": "image/jpeg",
     },

+ 13 - 4
packages/@uppy/core/src/index.js

@@ -366,7 +366,8 @@ class Uppy {
       }
     }
 
-    if (maxFileSize) {
+    // We can't check maxFileSize if the size is unknown.
+    if (maxFileSize && file.data.size != null) {
       if (file.data.size > maxFileSize) {
         throw new Error(`${this.i18n('exceedsSize')} ${prettyBytes(maxFileSize)}`)
       }
@@ -427,6 +428,8 @@ class Uppy {
     meta.name = fileName
     meta.type = fileType
 
+    // `null` means the size is unknown.
+    const size = isFinite(file.data.size) ? file.data.size : null
     const newFile = {
       source: file.source || '',
       id: fileID,
@@ -438,11 +441,11 @@ class Uppy {
       progress: {
         percentage: 0,
         bytesUploaded: 0,
-        bytesTotal: file.data.size || 0,
+        bytesTotal: size,
         uploadComplete: false,
         uploadStarted: false
       },
-      size: file.data.size || 0,
+      size: size,
       isRemote: isRemote,
       remote: file.remote || '',
       preview: file.preview
@@ -629,11 +632,17 @@ class Uppy {
       return
     }
 
+    // bytesTotal may be null or zero; in that case we can't divide by it
+    const canHavePercentage = isFinite(data.bytesTotal) && data.bytesTotal > 0
     this.setFileState(file.id, {
       progress: Object.assign({}, this.getFile(file.id).progress, {
         bytesUploaded: data.bytesUploaded,
         bytesTotal: data.bytesTotal,
-        percentage: Math.floor((data.bytesUploaded / data.bytesTotal * 100).toFixed(2))
+        percentage: canHavePercentage
+          // TODO(goto-bus-stop) flooring this should probably be the choice of the UI?
+          // we get more accurate calculations if we don't round this at all.
+          ? Math.floor(data.bytesUploaded / data.bytesTotal * 100)
+          : 0
       })
     })
 

+ 68 - 6
packages/@uppy/core/src/index.test.js

@@ -992,7 +992,7 @@ describe('src/Core', () => {
 
       const fileId = Object.keys(core.getState().files)[0]
       const file = core.getFile(fileId)
-      core._calculateProgress(file, {
+      core.emit('upload-progress', file, {
         bytesUploaded: 12345,
         bytesTotal: 17175
       })
@@ -1004,7 +1004,7 @@ describe('src/Core', () => {
         uploadStarted: false
       })
 
-      core._calculateProgress(file, {
+      core.emit('upload-progress', file, {
         bytesUploaded: 17175,
         bytesTotal: 17175
       })
@@ -1017,6 +1017,68 @@ describe('src/Core', () => {
       })
     })
 
+    it('should work with unsized files', async () => {
+      const core = new Core()
+      let proceedUpload
+      let finishUpload
+      const promise = new Promise((resolve) => { proceedUpload = resolve })
+      const finishPromise = new Promise((resolve) => { finishUpload = resolve })
+      core.addUploader(async ([id]) => {
+        core.emit('upload-started', core.getFile(id))
+        await promise
+        core.emit('upload-progress', core.getFile(id), {
+          bytesTotal: 3456,
+          bytesUploaded: 1234
+        })
+        await finishPromise
+        core.emit('upload-success', core.getFile(id), { uploadURL: 'lol' })
+      })
+
+      core.addFile({
+        source: 'instagram',
+        name: 'foo.jpg',
+        type: 'image/jpeg',
+        data: {}
+      })
+
+      core._calculateTotalProgress()
+
+      const uploadPromise = core.upload()
+      await new Promise((resolve) => core.once('upload-started', resolve))
+
+      expect(core.getFiles()[0].size).toBeNull()
+      expect(core.getFiles()[0].progress).toMatchObject({
+        bytesUploaded: 0,
+        // null indicates unsized
+        bytesTotal: null,
+        percentage: 0
+      })
+
+      proceedUpload()
+      // wait for progress event
+      await promise
+
+      expect(core.getFiles()[0].size).toBeNull()
+      expect(core.getFiles()[0].progress).toMatchObject({
+        bytesUploaded: 1234,
+        bytesTotal: 3456,
+        percentage: 35
+      })
+
+      finishUpload()
+      // wait for success event
+      await finishPromise
+
+      expect(core.getFiles()[0].size).toBeNull()
+      expect(core.getFiles()[0].progress).toMatchObject({
+        bytesUploaded: 3456,
+        bytesTotal: 3456,
+        percentage: 100
+      })
+
+      await uploadPromise
+    })
+
     it('should calculate the total progress of all file uploads', () => {
       const core = new Core()
 
@@ -1037,12 +1099,12 @@ describe('src/Core', () => {
       core.setFileState(file1.id, { progress: Object.assign({}, file1.progress, { uploadStarted: new Date() }) })
       core.setFileState(file2.id, { progress: Object.assign({}, file2.progress, { uploadStarted: new Date() }) })
 
-      core._calculateProgress(core.getFile(file1.id), {
+      core.emit('upload-progress', core.getFile(file1.id), {
         bytesUploaded: 12345,
         bytesTotal: 17175
       })
 
-      core._calculateProgress(core.getFile(file2.id), {
+      core.emit('upload-progress', core.getFile(file2.id), {
         bytesUploaded: 10201,
         bytesTotal: 17175
       })
@@ -1073,12 +1135,12 @@ describe('src/Core', () => {
       core.setFileState(file1.id, { progress: Object.assign({}, file1.progress, { uploadStarted: new Date() }) })
       core.setFileState(file2.id, { progress: Object.assign({}, file2.progress, { uploadStarted: new Date() }) })
 
-      core._calculateProgress(core.getFile(file1.id), {
+      core.emit('upload-progress', core.getFile(file1.id), {
         bytesUploaded: 12345,
         bytesTotal: 17175
       })
 
-      core._calculateProgress(core.getFile(file2.id), {
+      core.emit('upload-progress', core.getFile(file2.id), {
         bytesUploaded: 10201,
         bytesTotal: 17175
       })