diff --git a/src/utils/handlers/multiFileUploadHandler.test.ts b/src/utils/handlers/multiFileUploadHandler.test.ts new file mode 100644 index 000000000..cc1294c40 --- /dev/null +++ b/src/utils/handlers/multiFileUploadHandler.test.ts @@ -0,0 +1,67 @@ +import createMultiFileUploadHandler from "./multiFileUploadHandler"; + +const testFiles = Array(5) + .fill(0) + .map(() => new File([""], "mockFile")); + +describe("Multiple file upload handler", () => { + it("properly handles success", done => { + const cbs = { + onAfterUpload: jest.fn(), + onBeforeUpload: jest.fn(), + onCompleted: jest.fn(files => + expect(files.length).toBe(testFiles.length) + ), + onError: jest.fn(), + onStart: jest.fn() + }; + const handle = createMultiFileUploadHandler(() => { + const promise = new Promise(resolve => { + expect(cbs.onBeforeUpload).toBeCalledTimes( + cbs.onAfterUpload.mock.calls.length + 1 + ); + resolve(); + }); + return promise; + }, cbs); + + handle((testFiles as unknown) as FileList).then(() => { + expect(cbs.onAfterUpload).toBeCalledTimes(testFiles.length); + expect(cbs.onBeforeUpload).toBeCalledTimes(testFiles.length); + expect(cbs.onCompleted).toBeCalledTimes(1); + expect(cbs.onError).toBeCalledTimes(0); + expect(cbs.onStart).toBeCalledTimes(1); + done(); + }); + }); + + it("properly handles error", done => { + const cbs = { + onAfterUpload: jest.fn(), + onBeforeUpload: jest.fn(), + onCompleted: jest.fn(files => + expect(files.length).toBe(testFiles.length) + ), + onError: jest.fn(), + onStart: jest.fn() + }; + const handle = createMultiFileUploadHandler((_, fileIndex) => { + const promise = new Promise((resolve, reject) => { + if (fileIndex === 2) { + reject(); + } else { + resolve(); + } + }); + return promise; + }, cbs); + + handle((testFiles as unknown) as FileList).then(() => { + expect(cbs.onAfterUpload).toBeCalledTimes(testFiles.length - 1); + expect(cbs.onBeforeUpload).toBeCalledTimes(testFiles.length); + expect(cbs.onCompleted).toBeCalledTimes(1); + expect(cbs.onError).toBeCalledTimes(1); + done(); + }); + }); +}); diff --git a/src/utils/handlers/multiFileUploadHandler.ts b/src/utils/handlers/multiFileUploadHandler.ts index 99fa2460f..c97b17418 100644 --- a/src/utils/handlers/multiFileUploadHandler.ts +++ b/src/utils/handlers/multiFileUploadHandler.ts @@ -1,13 +1,13 @@ export type CreateMultiFileUploadHandlerCallbacks = Partial<{ - onAfterUpload: (index: number, all: number) => void; - onBeforeUpload: (index: number, all: number) => void; - onCompleted: (files: FileList) => void; - onError: (index: number, all: number) => void; - onStart: (files: FileList) => void; + onAfterUpload: (index: number, files: File[]) => void; + onBeforeUpload: (index: number, files: File[]) => void; + onCompleted: (files: File[]) => void; + onError: (index: number, files: File[]) => void; + onStart: (files: File[]) => void; }>; function createMultiFileUploadHandler( - upload: (file: File) => Promise, + upload: (file: File, fileIndex: number) => Promise, { onAfterUpload, onBeforeUpload, @@ -16,39 +16,41 @@ function createMultiFileUploadHandler( onStart }: CreateMultiFileUploadHandlerCallbacks ) { - async function uploadImage(files: FileList, fileIndex: number) { + async function uploadImage(files: File[], fileIndex: number): Promise { if (files.length > fileIndex) { try { if (onBeforeUpload) { - onBeforeUpload(fileIndex, files.length); + onBeforeUpload(fileIndex, files); } - await upload(files[fileIndex]); + await upload(files[fileIndex], fileIndex); if (onAfterUpload) { - onAfterUpload(fileIndex, files.length); + onAfterUpload(fileIndex, files); } } catch (exception) { console.error( `Could not upload file #${fileIndex + 1}. Reason: ${exception}` ); if (onError) { - onError(fileIndex, files.length); + onError(fileIndex, files); } } finally { await uploadImage(files, fileIndex + 1); } } } - return async (files: FileList) => { + return async (files: FileList): Promise => { + const fileArray = Array.from(files); + if (onStart) { - onStart(files); + onStart(fileArray); } - await uploadImage(files, 0); + await uploadImage(fileArray, 0); if (onCompleted) { - onCompleted(files); + onCompleted(fileArray); } }; }