fix(File): file prototype properties are lost with spread operator

AxaFrance · Sep 12, 2023 · 936bdc8 · 936bdc8
1 parent 545e2c6
commit 936bdc8
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 11 deletions.
diff --git a/packages/Form/Input/file/src/File.tsx b/packages/Form/Input/file/src/File.tsx
@@ -67,7 +67,9 @@ const File = ({
   );
 };
 
-export type CustomFile<T = File & { preview: string }> = {
+export type FilePreview = File & { preview: string };
+
+export type CustomFile<T = FilePreview> = {
   id: string;
   file: T;
 };
@@ -89,11 +91,31 @@ const handlers = {
     ) => {
       const values = acceptedFiles.map((file) => ({
         id: createId(),
-        file: { ...file, preview: URL.createObjectURL(file) },
+        file: {
+          ...file,
+          lastModified: file.lastModified,
+          name: file.name,
+          type: file.type,
+          size: file.size,
+          stream: file.stream,
+          arrayBuffer: file.arrayBuffer,
+          slice: file.slice,
+          text: file.text,
+          preview: URL.createObjectURL(file),
+        },
       }));
       const errors = rejectedFiles.map((error) => ({
         id: createId(),
-        file: error,
+        file: {
+          errors: error.errors,
+          file: {
+            ...error.file,
+            lastModified: error.file.lastModified,
+            name: error.file.name,
+            type: error.file.type,
+            size: error.file.size,
+          } as File,
+        },
       }));
       onChange &&
         onChange({

diff --git a/packages/Form/Input/file/src/__tests__/FileLine.spec.tsx b/packages/Form/Input/file/src/__tests__/FileLine.spec.tsx
@@ -2,12 +2,20 @@ import React from 'react';
 import { render, fireEvent } from '@testing-library/react';
 
 import FileLine, { Preview } from '../FileLine';
+import { FilePreview } from '../File';
 
 describe('<File.FileInput>', () => {
   it('renders File.FileInput correctly', () => {
     const { asFragment } = render(
       <FileLine
-        file={{ ...new File([], 'name'), name: 'name', size: 1, preview: '#' }}
+        file={
+          {
+            ...new File([], 'name'),
+            name: 'name',
+            size: 1,
+            preview: '#',
+          } as FilePreview
+        }
         id="id"
       />
     );
@@ -18,7 +26,14 @@ describe('<File.FileInput>', () => {
 
     const { getByRole } = render(
       <FileLine
-        file={{ ...new File([], 'name'), name: 'name', size: 1, preview: '#' }}
+        file={
+          {
+            ...new File([], 'name'),
+            name: 'name',
+            size: 1,
+            preview: '#',
+          } as FilePreview
+        }
         id="id"
         onClick={onClickMock}
       />
@@ -35,7 +50,7 @@ describe('<File.FileInput>', () => {
       preview: '',
       size: 2,
     };
-    const { asFragment } = render(<Preview file={file} />);
+    const { asFragment } = render(<Preview file={file as FilePreview} />);
     expect(asFragment()).toMatchSnapshot();
   });
   it('renders Preview correctly for other type', () => {
@@ -46,7 +61,7 @@ describe('<File.FileInput>', () => {
       preview: '',
       size: 2,
     };
-    const { asFragment } = render(<Preview file={file} />);
+    const { asFragment } = render(<Preview file={file as FilePreview} />);
     expect(asFragment()).toMatchSnapshot();
   });
 });
diff --git a/packages/Form/Input/file/src/__tests__/FileTable.spec.tsx b/packages/Form/Input/file/src/__tests__/FileTable.spec.tsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import { render } from '@testing-library/react';
 import FileTable from '../FileTable';
+import { FilePreview } from '../File';
 
 describe('<File.FileTable>', () => {
   it('renders File.FileTable correctly', () => {
@@ -12,7 +13,7 @@ describe('<File.FileTable>', () => {
               ...new File([], 'youhou.txt'),
               name: 'youhou.txt',
               size: 2,
-            },
+            } as File,
             errors: [],
           },
         ]}
@@ -23,7 +24,7 @@ describe('<File.FileTable>', () => {
               name: 'superfile.pdf',
               preview: '',
               size: 2,
-            },
+            } as FilePreview,
             id: 'id',
           },
         ]}
@@ -41,7 +42,7 @@ describe('<File.FileTable>', () => {
               ...new File([], 'youhou.txt'),
               name: 'youhou.txt',
               size: 2,
-            },
+            } as File,
             errors: [],
           },
         ]}
@@ -63,7 +64,7 @@ describe('<File.FileTable>', () => {
               name: 'youhou.txt',
               size: 2,
               preview: '',
-            },
+            } as FilePreview,
             id: 'id',
           },
         ]}