@uppy/utils - npm Package Compare versions

Comparing version 5.0.0-beta to 5.0.0-beta.1

CHANGELOG.md

 # @uppy/utils
 
+## 5.0.0-beta.1
+
+Released: 2022-08-16
+Included in: Uppy v3.0.0-beta.5
+
+- @uppy/utils: Fix webp mimetype (Merlijn Vos / #3961)
+- @uppy/utils: modernize `getDroppedFiles` (Antoine du Hamel / #3534)
+
 ## 4.1.0
@@ -4,0 +12,0 @@

lib/getDroppedFiles/index.js

@@ -18,5 +18,3 @@ import webkitGetAsEntryApi from './utils/webkitGetAsEntryApi/index.js';
 
-export default function getDroppedFiles(dataTransfer, _temp) {
-  var _dataTransfer$items;
-
+export default async function getDroppedFiles(dataTransfer, _temp) {
   let {
@@ -27,7 +25,13 @@ logDropError = () => {}
   // Get all files from all subdirs. Works (at least) in Chrome, Mozilla, and Safari
-  if ((_dataTransfer$items = dataTransfer.items) != null && _dataTransfer$items[0] && 'webkitGetAsEntry' in dataTransfer.items[0]) {
-    return webkitGetAsEntryApi(dataTransfer, logDropError); // Otherwise just return all first-order files
+  try {
+    const accumulator = [];
+
+    for await (const file of webkitGetAsEntryApi(dataTransfer, logDropError)) {
+      accumulator.push(file);
+    }
+
+    return accumulator; // Otherwise just return all first-order files
+  } catch {
+    return fallbackApi(dataTransfer);
   }
-
-  return fallbackApi(dataTransfer);
 }

lib/getDroppedFiles/utils/webkitGetAsEntryApi/getFilesAndDirectoriesFromDirectory.js

@@ -18,7 +18,7 @@ /**
     if (entries.length) {
-      setTimeout(() => {
+      queueMicrotask(() => {
         getFilesAndDirectoriesFromDirectory(directoryReader, newEntries, logDropError, {
           onSuccess
         });
-      }, 0); // Done iterating this particular directory
+      }); // Done iterating this particular directory
     } else {
@@ -25,0 +25,0 @@ onSuccess(newEntries);

lib/getDroppedFiles/utils/webkitGetAsEntryApi/index.js

 import getRelativePath from './getRelativePath.js';
 import getFilesAndDirectoriesFromDirectory from './getFilesAndDirectoriesFromDirectory.js';
-import toArray from '../../../toArray.js';
-export default function webkitGetAsEntryApi(dataTransfer, logDropError) {
-  const files = [];
-  const rootPromises = [];
-  /**
-   * Returns a resolved promise, when :files array is enhanced
-   *
-   * @param {(FileSystemFileEntry|FileSystemDirectoryEntry)} entry
-   * @returns {Promise} - empty promise that resolves when :files is enhanced with a file
-   */
+/**
+ * Interop between deprecated webkitGetAsEntry and standard getAsFileSystemHandle.
+ */
 
-  const createPromiseToAddFileOrParseDirectory = entry => new Promise(resolve => {
-    // This is a base call
-    if (entry.isFile) {
-      // Creates a new File object which can be used to read the file.
-      entry.file(file => {
-        // eslint-disable-next-line no-param-reassign
-        file.relativePath = getRelativePath(entry);
-        files.push(file);
-        resolve();
-      }, // Make sure we resolve on error anyway, it's fine if only one file couldn't be read!
-      error => {
-        logDropError(error);
-        resolve();
-      }); // This is a recursive call
-    } else if (entry.isDirectory) {
+function getAsFileSystemHandleFromEntry(entry, logDropError) {
+  if (entry == null) return entry;
+  return {
+    // eslint-disable-next-line no-nested-ternary
+    kind: entry.isFile ? 'file' : entry.isDirectory ? 'directory' : undefined,
+
+    getFile() {
+      return new Promise((resolve, reject) => entry.file(resolve, reject));
+    },
+
+    async *values() {
+      // If the file is a directory.
       const directoryReader = entry.createReader();
-      getFilesAndDirectoriesFromDirectory(directoryReader, [], logDropError, {
-        onSuccess: entries => resolve(Promise.all(entries.map(createPromiseToAddFileOrParseDirectory)))
+      const entries = await new Promise(resolve => {
+        getFilesAndDirectoriesFromDirectory(directoryReader, [], logDropError, {
+          onSuccess: dirEntries => resolve(dirEntries.map(file => getAsFileSystemHandleFromEntry(file, logDropError)))
+        });
       });
+      yield* entries;
     }
-  }); // For each dropped item, - make sure it's a file/directory, and start deepening in!
 
+  };
+}
 
-  toArray(dataTransfer.items).forEach(item => {
-    const entry = item.webkitGetAsEntry(); // :entry can be null when we drop the url e.g.
+async function* createPromiseToAddFileOrParseDirectory(entry) {
+  // For each dropped item, - make sure it's a file/directory, and start deepening in!
+  if (entry.kind === 'file') {
+    const file = await entry.getFile();
 
-    if (entry) {
-      rootPromises.push(createPromiseToAddFileOrParseDirectory(entry));
+    if (file !== null) {
+      file.relativePath = getRelativePath(entry);
+      yield file;
     }
-  });
-  return Promise.all(rootPromises).then(() => files);
+  } else if (entry.kind === 'directory') {
+    for await (const handle of entry.values()) {
+      yield* createPromiseToAddFileOrParseDirectory(handle);
+    }
+  }
+}
+
+export default async function* getFilesFromDataTransfer(dataTransfer, logDropError) {
+  for (const item of dataTransfer.items) {
+    var _await$item$getAsFile;
+
+    const lastResortFile = item.getAsFile(); // Chromium bug, see https://github.com/transloadit/uppy/issues/3505.
+
+    const entry = (_await$item$getAsFile = await (item.getAsFileSystemHandle == null ? void 0 : item.getAsFileSystemHandle())) != null ? _await$item$getAsFile : getAsFileSystemHandleFromEntry(item.webkitGetAsEntry(), logDropError); // :entry can be null when we drop the url e.g.
+
+    if (entry != null) {
+      try {
+        yield* createPromiseToAddFileOrParseDirectory(entry, logDropError);
+      } catch (err) {
+        if (lastResortFile) {
+          yield lastResortFile;
+        } else {
+          logDropError(err);
+        }
+      }
+    }
+  }
 }

lib/mimeTypes.js

@@ -13,2 +13,3 @@ // ___Why not add the mime-types package?
   png: 'image/png',
+  webp: 'image/webp',
   gif: 'image/gif',
@@ -15,0 +16,0 @@ heic: 'image/heic',

package.json

 {
   "name": "@uppy/utils",
   "description": "Shared utility functions for Uppy Core and plugins maintained by the Uppy team.",
-  "version": "5.0.0-beta",
+  "version": "5.0.0-beta.1",
   "license": "MIT",
-  "main": "lib/index.js",
   "types": "types/index.d.ts",
@@ -21,2 +20,46 @@ "type": "module",
   },
+  "exports": {
+    "./package.json": "./package.json",
+    "./lib/Translator": "./lib/Translator.js",
+    "./lib/EventTracker": "./lib/EventTracker.js",
+    "./lib/ProgressTimeout": "./lib/ProgressTimeout.js",
+    "./lib/RateLimitedQueue": "./lib/RateLimitedQueue.js",
+    "./lib/canvasToBlob": "./lib/canvasToBlob.js",
+    "./lib/dataURItoBlob": "./lib/dataURItoBlob.js",
+    "./lib/dataURItoFile": "./lib/dataURItoFile.js",
+    "./lib/emitSocketProgress": "./lib/emitSocketProgress.js",
+    "./lib/findAllDOMElements": "./lib/findAllDOMElements.js",
+    "./lib/findDOMElement": "./lib/findDOMElement.js",
+    "./lib/generateFileID": "./lib/generateFileID.js",
+    "./lib/getBytesRemaining": "./lib/getBytesRemaining.js",
+    "./lib/getETA": "./lib/getETA.js",
+    "./lib/getFileNameAndExtension": "./lib/getFileNameAndExtension.js",
+    "./lib/getFileType": "./lib/getFileType.js",
+    "./lib/getFileTypeExtension": "./lib/getFileTypeExtension.js",
+    "./lib/getSocketHost": "./lib/getSocketHost.js",
+    "./lib/getSpeed": "./lib/getSpeed.js",
+    "./lib/getTimeStamp": "./lib/getTimeStamp.js",
+    "./lib/isDOMElement": "./lib/isDOMElement.js",
+    "./lib/isObjectURL": "./lib/isObjectURL.js",
+    "./lib/isDragDropSupported": "./lib/isDragDropSupported.js",
+    "./lib/isPreviewSupported": "./lib/isPreviewSupported.js",
+    "./lib/isTouchDevice": "./lib/isTouchDevice.js",
+    "./lib/prettyETA": "./lib/prettyETA.js",
+    "./lib/secondsToTime": "./lib/secondsToTime.js",
+    "./lib/settle": "./lib/settle.js",
+    "./lib/toArray": "./lib/toArray.js",
+    "./lib/FOCUSABLE_ELEMENTS": "./lib/FOCUSABLE_ELEMENTS.js",
+    "./lib/AbortController": "./lib/AbortController.js",
+    "./lib/getTextDirection": "./lib/getTextDirection.js",
+    "./lib/NetworkError": "./lib/NetworkError.js",
+    "./lib/isNetworkError": "./lib/isNetworkError.js",
+    "./lib/truncateString": "./lib/truncateString.js",
+    "./lib/remoteFileObjToLocal": "./lib/remoteFileObjToLocal.js",
+    "./lib/fetchWithNetworkError": "./lib/fetchWithNetworkError.js",
+    "./lib/ErrorWithCause": "./lib/ErrorWithCause.js",
+    "./lib/delay": "./lib/delay.js",
+    "./lib/hasProperty": "./lib/hasProperty.js",
+    "./lib/mimeTypes": "./lib/mimeTypes.js",
+    "./lib/getDroppedFiles": "./lib/getDroppedFiles/index.js"
+  },
   "dependencies": {
@@ -27,4 +70,3 @@ "lodash.throttle": "^4.1.1"
     "@jest/globals": "^27.4.2"
-  },
-  "stableVersion": "4.1.0"
+  }
 }

src/getDroppedFiles/index.js

@@ -18,9 +18,14 @@ import webkitGetAsEntryApi from './utils/webkitGetAsEntryApi/index.js'
  */
-export default function getDroppedFiles (dataTransfer, { logDropError = () => {} } = {}) {
+export default async function getDroppedFiles (dataTransfer, { logDropError = () => {} } = {}) {
   // Get all files from all subdirs. Works (at least) in Chrome, Mozilla, and Safari
-  if (dataTransfer.items?.[0] && 'webkitGetAsEntry' in dataTransfer.items[0]) {
-    return webkitGetAsEntryApi(dataTransfer, logDropError)
+  try {
+    const accumulator = []
+    for await (const file of webkitGetAsEntryApi(dataTransfer, logDropError)) {
+      accumulator.push(file)
+    }
+    return accumulator
   // Otherwise just return all first-order files
+  } catch {
+    return fallbackApi(dataTransfer)
   }
-  return fallbackApi(dataTransfer)
 }

src/getDroppedFiles/utils/webkitGetAsEntryApi/getFilesAndDirectoriesFromDirectory.js

@@ -16,5 +16,5 @@ /**
       if (entries.length) {
-        setTimeout(() => {
+        queueMicrotask(() => {
           getFilesAndDirectoriesFromDirectory(directoryReader, newEntries, logDropError, { onSuccess })
-        }, 0)
+        })
       // Done iterating this particular directory
@@ -21,0 +21,0 @@ } else {

src/getDroppedFiles/utils/webkitGetAsEntryApi/index.js

 import getRelativePath from './getRelativePath.js'
 import getFilesAndDirectoriesFromDirectory from './getFilesAndDirectoriesFromDirectory.js'
-import toArray from '../../../toArray.js'
 
-export default function webkitGetAsEntryApi (dataTransfer, logDropError) {
-  const files = []
-
-  const rootPromises = []
-
-  /**
-   * Returns a resolved promise, when :files array is enhanced
-   *
-   * @param {(FileSystemFileEntry|FileSystemDirectoryEntry)} entry
-   * @returns {Promise} - empty promise that resolves when :files is enhanced with a file
-   */
-  const createPromiseToAddFileOrParseDirectory = (entry) => new Promise((resolve) => {
-    // This is a base call
-    if (entry.isFile) {
-      // Creates a new File object which can be used to read the file.
-      entry.file(
-        (file) => {
-          // eslint-disable-next-line no-param-reassign
-          file.relativePath = getRelativePath(entry)
-          files.push(file)
-          resolve()
-        },
-        // Make sure we resolve on error anyway, it's fine if only one file couldn't be read!
-        (error) => {
-          logDropError(error)
-          resolve()
-        },
-      )
-      // This is a recursive call
-    } else if (entry.isDirectory) {
+/**
+ * Interop between deprecated webkitGetAsEntry and standard getAsFileSystemHandle.
+ */
+function getAsFileSystemHandleFromEntry (entry, logDropError) {
+  if (entry == null) return entry
+  return {
+    // eslint-disable-next-line no-nested-ternary
+    kind: entry.isFile ? 'file' : entry.isDirectory ? 'directory' : undefined,
+    getFile () {
+      return new Promise((resolve, reject) => entry.file(resolve, reject))
+    },
+    async* values () {
+      // If the file is a directory.
       const directoryReader = entry.createReader()
-      getFilesAndDirectoriesFromDirectory(directoryReader, [], logDropError, {
-        onSuccess: (entries) => resolve(Promise.all(
-          entries.map(createPromiseToAddFileOrParseDirectory),
-        )),
+      const entries = await new Promise(resolve => {
+        getFilesAndDirectoriesFromDirectory(directoryReader, [], logDropError, {
+          onSuccess: (dirEntries) => resolve(dirEntries.map(file => getAsFileSystemHandleFromEntry(file, logDropError))),
+        })
       })
+      yield* entries
+    },
+  }
+}
+
+async function* createPromiseToAddFileOrParseDirectory (entry) {
+  // For each dropped item, - make sure it's a file/directory, and start deepening in!
+  if (entry.kind === 'file') {
+    const file = await entry.getFile()
+    if (file !== null) {
+      file.relativePath = getRelativePath(entry)
+      yield file
     }
-  })
+  } else if (entry.kind === 'directory') {
+    for await (const handle of entry.values()) {
+      yield* createPromiseToAddFileOrParseDirectory(handle)
+    }
+  }
+}
 
-  // For each dropped item, - make sure it's a file/directory, and start deepening in!
-  toArray(dataTransfer.items)
-    .forEach((item) => {
-      const entry = item.webkitGetAsEntry()
-      // :entry can be null when we drop the url e.g.
-      if (entry) {
-        rootPromises.push(createPromiseToAddFileOrParseDirectory(entry))
+export default async function* getFilesFromDataTransfer (dataTransfer, logDropError) {
+  for (const item of dataTransfer.items) {
+    const lastResortFile = item.getAsFile() // Chromium bug, see https://github.com/transloadit/uppy/issues/3505.
+    const entry = await item.getAsFileSystemHandle?.()
+      ?? getAsFileSystemHandleFromEntry(item.webkitGetAsEntry(), logDropError)
+    // :entry can be null when we drop the url e.g.
+    if (entry != null) {
+      try {
+        yield* createPromiseToAddFileOrParseDirectory(entry, logDropError)
+      } catch (err) {
+        if (lastResortFile) {
+          yield lastResortFile
+        } else {
+          logDropError(err)
+        }
       }
-    })
-
-  return Promise.all(rootPromises)
-    .then(() => files)
+    }
+  }
 }

src/getFileType.test.js

@@ -40,2 +40,6 @@ import { describe, expect, it } from '@jest/globals'
     }
+    const fileWebp = {
+      name: 'bar.webp',
+      data: 'sdfsfhfh329fhwihs',
+    }
     const toUpper = (file) => ({ ...file, name: file.name.toUpperCase() })
@@ -50,2 +54,4 @@ expect(getFileType(fileMP3)).toEqual('audio/mp3')
     expect(getFileType(toUpper(fileDicom))).toEqual('application/dicom')
+    expect(getFileType(fileWebp)).toEqual('image/webp')
+    expect(getFileType(toUpper(fileWebp))).toEqual('image/webp')
   })
@@ -52,0 +58,0 @@

src/mimeTypes.js

@@ -14,2 +14,3 @@ // ___Why not add the mime-types package?
   png: 'image/png',
+  webp: 'image/webp',
   gif: 'image/gif',
@@ -16,0 +17,0 @@ heic: 'image/heic',

types/index.d.ts

@@ -19,3 +19,3 @@ declare module '@uppy/utils/lib/Translator' {
 
-  export = Translator
+  export default Translator
 }
@@ -40,3 +40,3 @@
 
-  export = EventTracker
+  export default EventTracker
 }
@@ -52,3 +52,3 @@
   }
-  export = ProgressTimeout
+  export default ProgressTimeout
 }
@@ -94,3 +94,3 @@
   ): Promise<Blob>
-  export = canvasToBlob
+  export default canvasToBlob
 }
@@ -103,3 +103,3 @@
   ): Blob
-  export = dataURItoBlob
+  export default dataURItoBlob
 }
@@ -112,7 +112,7 @@
   ): File
-  export = dataURItoFile
+  export default dataURItoFile
 }
 
 declare module '@uppy/utils/lib/emitSocketProgress' {
-  import UppyUtils = require('@uppy/utils')
+  import type { UppyFile } from '@uppy/utils'
 
@@ -128,5 +128,5 @@ interface ProgressData {
     progressData: ProgressData,
-    file: UppyUtils.UppyFile
+    file: UppyFile
   ): void
-  export = emitSocketProgress
+  export default emitSocketProgress
 }
@@ -136,3 +136,3 @@
   function findAllDOMElements (element: string | HTMLElement): HTMLElement[]
-  export = findAllDOMElements
+  export default findAllDOMElements
 }
@@ -142,10 +142,10 @@
   function findDOMElement (element: string | HTMLElement): HTMLElement | null
-  export = findDOMElement
+  export default findDOMElement
 }
 
 declare module '@uppy/utils/lib/generateFileID' {
-  import UppyUtils = require('@uppy/utils')
+  import type { UppyFile } from '@uppy/utils'
 
-  function generateFileID (file: UppyUtils.UppyFile): string
-  export = generateFileID
+  function generateFileID (file: UppyFile): string
+  export default generateFileID
 }
@@ -158,3 +158,3 @@
   }): number
-  export = getBytesRemaining
+  export default getBytesRemaining
 }
@@ -164,3 +164,3 @@
   function getETA (progress: unknown): number
-  export = getETA
+  export default getETA
 }
@@ -172,10 +172,10 @@
   ): { name: string, extension: string | undefined }
-  export = getFileNameAndExtension
+  export default getFileNameAndExtension
 }
 
 declare module '@uppy/utils/lib/getFileType' {
-  import UppyUtils = require('@uppy/utils')
+  import type { UppyFile } from '@uppy/utils'
 
-  function getFileType (file: UppyUtils.UppyFile): string
-  export = getFileType
+  function getFileType (file: UppyFile): string
+  export default getFileType
 }
@@ -185,3 +185,3 @@
   function getFileTypeExtension (mime: string): string
-  export = getFileTypeExtension
+  export default getFileTypeExtension
 }
@@ -191,3 +191,3 @@
   function getSocketHost (url: string): string
-  export = getSocketHost
+  export default getSocketHost
 }
@@ -200,3 +200,3 @@
   }): number
-  export = getSpeed
+  export default getSpeed
 }
@@ -206,3 +206,3 @@
   function getTimeStamp (): string
-  export = getTimeStamp
+  export default getTimeStamp
 }
@@ -212,3 +212,3 @@
   function isDOMElement (element: any): boolean
-  export = isDOMElement
+  export default isDOMElement
 }
@@ -218,3 +218,3 @@
   function isObjectURL (url: string): boolean
-  export = isObjectURL
+  export default isObjectURL
 }
@@ -224,3 +224,3 @@
   function isDragDropSupported (): boolean
-  export = isDragDropSupported
+  export default isDragDropSupported
 }
@@ -230,3 +230,3 @@
   function isPreviewSupported (mime: string): boolean
-  export = isPreviewSupported
+  export default isPreviewSupported
 }
@@ -236,3 +236,3 @@
   function isTouchDevice (): boolean
-  export = isTouchDevice
+  export default isTouchDevice
 }
@@ -242,3 +242,3 @@
   function prettyETA (seconds: number): string
-  export = prettyETA
+  export default prettyETA
 }
@@ -248,3 +248,3 @@
   function secondsToTime (seconds: number): string
-  export = secondsToTime
+  export default secondsToTime
 }
@@ -256,3 +256,3 @@
   ): Promise<{ successful: T[]; failed: any[] }>
-  export = settle
+  export default settle
 }
@@ -262,5 +262,11 @@
   function toArray (list: any): any[]
-  export = toArray
+  export default toArray
 }
 
+declare module '@uppy/utils/lib/AbortController' {
+  export const AbortController: typeof globalThis.AbortController
+  export const AbortSignal: typeof globalThis.AbortSignal
+  export function createAbortError(message?: string): DOMException
+}
+
 declare module '@uppy/utils/lib/getDroppedFiles' {
@@ -271,5 +277,73 @@ function getDroppedFiles (
   ): Promise<File[]>
-  export = getDroppedFiles
+  export default getDroppedFiles
 }
 
+declare module '@uppy/utils/lib/getTextDirection' {
+  function getTextDirection (element: Node): string|undefined
+  export default getTextDirection
+}
+
+declare module '@uppy/utils/lib/isNetworkError' {
+  export default function isNetworkError (xhr: any): boolean
+
+}
+
+declare module '@uppy/utils/lib/NetworkError' {
+  class NetworkError extends Error {
+    readonly cause: any
+
+    readonly isNetworkError: true
+
+    readonly request?: XMLHttpRequest
+
+    constructor (error: any, xhr?: XMLHttpRequest)
+  }
+
+  export default NetworkError
+}
+
+declare module '@uppy/utils/lib/FOCUSABLE_ELEMENTS' {
+  const exports: string[]
+  export default exports
+}
+
+declare module '@uppy/utils/lib/truncateString' {
+  export default function truncateString (string: string, maxLength: number): string
+}
+
+declare module '@uppy/utils/lib/remoteFileObjToLocal' {
+  export default function remoteFileObjToLocal (file: object): Record<string, unknown>
+}
+
+declare module '@uppy/utils/lib/fetchWithNetworkError' {
+  export default function fetchWithNetworkError (...options: unknown[]): Promise<Response>
+}
+
+declare module '@uppy/utils/lib/ErrorWithCause' {
+  interface ErrorOptions {
+    cause?: unknown;
+  }
+
+  export default class ErrorWithCause extends Error {
+    cause: any
+
+    isNetworkError?: true
+
+    constructor (message: string, options?: ErrorOptions)
+  }
+}
+
+declare module '@uppy/utils/lib/delay' {
+  export default function delay (ms:number, opts?: {signal: AbortSignal}): Promise<void>
+}
+
+declare module '@uppy/utils/lib/hasProperty' {
+  export default function has (object: any, key: string): boolean
+}
+
+declare module '@uppy/utils/lib/mimeTypes' {
+  const exports: Record<string, string>
+  export default exports
+}
+
 declare module '@uppy/utils' {
@@ -276,0 +350,0 @@ interface IndexedObject<T> {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

238669

increased by2.43%

Lines of code

3246

increased by2.98%

No dependency changes