fix: use File {path} prop if it exists

This fixes issues with Electron, which sets the `{path}` property on the File object.

Author: wali-s

src/file-selector.ts

@@ -27,7 +27,7 @@ function isDragEvt(value: any): value is DragEvent {
 function getInputFiles(evt: Event) {
     const files = isInput(evt.target)
         ? evt.target.files
-            ? fromList<File>(evt.target.files)
+            ? fromList<FileWithPath>(evt.target.files)
             : []
         : [];
     return files.map(file => toFileWithPath(file));
@@ -52,7 +52,7 @@ async function getDataTransferFiles(dt: DataTransfer, type: string) {
         return noIgnoredFiles(flatten<FileWithPath>(files));
     }
 
-    return noIgnoredFiles(fromList<File>(dt.files)
+    return noIgnoredFiles(fromList<FileWithPath>(dt.files)
         .map(file => toFileWithPath(file)));
 }
 
@@ -153,7 +153,7 @@ function fromDirEntry(entry: any) {
 // https://developer.mozilla.org/en-US/docs/Web/API/FileSystemFileEntry
 async function fromFileEntry(entry: any) {
     return new Promise<FileWithPath>((resolve, reject) => {
-        entry.file((file: File) => {
+        entry.file((file: FileWithPath) => {
             const fwp = toFileWithPath(file, entry.fullPath);
             resolve(fwp);
         }, (err: any) => {

src/file.spec.ts

@@ -16,6 +16,16 @@ describe('toFile()', () => {
         expect(fileWithPath.type).toBe(type);
     });
 
+    it('does not overwrite {path} if it exists', () => {
+        const fullPath = '/Users/test/Desktop/test/test.json';
+        const path = '/test/test.json';
+        const file = new File([], 'test.json');
+        // @ts-ignore
+        file.path = fullPath; // this is set only in the case of an electron app
+        const fileWithPath = toFileWithPath(file, path);
+        expect(fileWithPath.path).toBe(fullPath);
+    });
+
     it('sets the {path} if provided', () => {
         const path = '/test/test.json';
         const file = new File([], 'test.json');

src/file.ts

@@ -15,22 +15,25 @@ export const COMMON_MIME_TYPES = new Map([
 ]);
 
 
-export function toFileWithPath(file: File, path?: string): FileWithPath {
+export function toFileWithPath(file: FileWithPath, path?: string): FileWithPath {
     const f = withMimeType(file);
-    const {webkitRelativePath} = file as FileWithWebkitPath;
-    Object.defineProperty(f, 'path', {
-        value: typeof path === 'string'
-            ? path
-            // If <input webkitdirectory> is set,
-            // the File will have a {webkitRelativePath} property
-            // https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/webkitdirectory
-            : typeof webkitRelativePath === 'string' && webkitRelativePath.length > 0
-                ? webkitRelativePath
-                : file.name,
-        writable: false,
-        configurable: false,
-        enumerable: true
-    });
+    if (typeof f.path !== 'string') { // on electron, path is already set to the absolute path
+        const {webkitRelativePath} = file as FileWithWebkitPath;
+        Object.defineProperty(f, 'path', {
+            value: typeof path === 'string'
+                ? path
+                // If <input webkitdirectory> is set,
+                // the File will have a {webkitRelativePath} property
+                // https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/webkitdirectory
+                : typeof webkitRelativePath === 'string' && webkitRelativePath.length > 0
+                    ? webkitRelativePath
+                    : file.name,
+            writable: false,
+            configurable: false,
+            enumerable: true
+        });
+    }
+
     return f;
 }
 
@@ -42,7 +45,7 @@ interface FileWithWebkitPath extends File {
     readonly webkitRelativePath?: string;
 }
 
-function withMimeType(file: File) {
+function withMimeType(file: FileWithPath) {
     const {name} = file;
     const hasExtension = name && name.lastIndexOf('.') !== -1;