From 5b9f37d01f19d349299e6074db5c5e7457d62073 Mon Sep 17 00:00:00 2001 From: Cilibiu Bogdan Date: Mon, 9 Sep 2019 13:23:07 +0300 Subject: [PATCH] [ADF-4838] Upload Dialog - canceling a pending file cancels the file in progress (#5063) * add automation id * call cancel upload api only if file is not pending * tests * e2e --- .../upload/cancel-upload.e2e.ts | 15 ++++-- .../file-uploading-list-row.component.html | 1 + .../file-uploading-list.component.spec.ts | 50 ++++++++++++++++++- .../file-uploading-list.component.ts | 11 ++-- 4 files changed, 70 insertions(+), 7 deletions(-) diff --git a/e2e/content-services/upload/cancel-upload.e2e.ts b/e2e/content-services/upload/cancel-upload.e2e.ts index e2b1723579..99e9aaff52 100644 --- a/e2e/content-services/upload/cancel-upload.e2e.ts +++ b/e2e/content-services/upload/cancel-upload.e2e.ts @@ -79,7 +79,7 @@ describe('Upload component', async () => { }); it('[C272792] Should be possible to cancel upload of a big file using row cancel icon', async () => { - await browser.executeScript('setTimeout(() => {document.querySelector("div[data-automation-id=\'cancel-upload-progress\']").click();}, 3000)'); + await browser.executeScript('setTimeout(() => {document.querySelector("div[data-automation-id=\'cancel-upload-progress\']").click();}, 1000)'); await contentServicesPage.uploadFile(largeFile.location); @@ -90,7 +90,7 @@ describe('Upload component', async () => { }); it('[C287790] Should be possible to cancel upload of a big file through the cancel uploads button', async () => { - await browser.executeScript(' setInterval(() => {document.querySelector("#adf-upload-dialog-cancel-all").click();' + + await browser.executeScript(' setTimeout(() => {document.querySelector("#adf-upload-dialog-cancel-all").click();' + 'document.querySelector("#adf-upload-dialog-cancel").click(); }, 500)'); await contentServicesPage.uploadFile(largeFile.location); @@ -102,7 +102,7 @@ describe('Upload component', async () => { }); it('[C272793] Should be able to cancel multiple files upload', async () => { - await browser.executeScript(' setInterval(() => {document.querySelector("#adf-upload-dialog-cancel-all").click();' + + await browser.executeScript(' setTimeout(() => {document.querySelector("#adf-upload-dialog-cancel-all").click();' + 'document.querySelector("#adf-upload-dialog-cancel").click(); }, 500)'); await uploadToggles.enableMultipleFileUpload(); @@ -115,4 +115,13 @@ describe('Upload component', async () => { await uploadToggles.disableMultipleFileUpload(); }); + it('[C315257] Should be able to cancel file in upload queue', async () => { + await uploadToggles.enableMultipleFileUpload(); + await browser.executeScript('setTimeout(() => {document.querySelector("button[data-automation-id=\'cancel-upload-queue\']").click();}, 500)'); + await contentServicesPage.uploadMultipleFile([largeFile.location, pngFileModel.location]); + await uploadDialog.fileIsCancelled(pngFileModel.name); + await uploadDialog.clickOnCloseButton(); + await uploadDialog.dialogIsNotDisplayed(); + await uploadToggles.disableMultipleFileUpload(); + }); }); diff --git a/lib/content-services/upload/components/file-uploading-list-row.component.html b/lib/content-services/upload/components/file-uploading-list-row.component.html index f07ebe25d2..2648dd808c 100644 --- a/lib/content-services/upload/components/file-uploading-list-row.component.html +++ b/lib/content-services/upload/components/file-uploading-list-row.component.html @@ -82,6 +82,7 @@ mat-icon-button *ngIf="file.status === FileUploadStatus.Pending" (click)="onCancel(file)" + data-automation-id="cancel-upload-queue" class="adf-file-uploading-row__group" title="{{ 'ADF_FILE_UPLOAD.BUTTON.CANCEL_FILE' | translate }}" [attr.aria-label]="'ADF_FILE_UPLOAD.ARIA-LABEL.CANCEL_FILE' | translate: { file: file.name }"> diff --git a/lib/content-services/upload/components/file-uploading-list.component.spec.ts b/lib/content-services/upload/components/file-uploading-list.component.spec.ts index 4afa46c18e..b0b984b53b 100644 --- a/lib/content-services/upload/components/file-uploading-list.component.spec.ts +++ b/lib/content-services/upload/components/file-uploading-list.component.spec.ts @@ -62,11 +62,25 @@ describe('FileUploadingListComponent', () => { }); describe('cancelFile()', () => { - it('should call uploadService api when cancelling a file', () => { + it('should call cancelUpload service when cancelling a file', () => { component.cancelFile(file); expect(uploadService.cancelUpload).toHaveBeenCalledWith(file); }); + + it('should not call cancelUpload service when file has `Pending` status', () => { + file.status = FileUploadStatus.Pending; + component.cancelFile(file); + + expect(uploadService.cancelUpload).not.toHaveBeenCalledWith(file); + }); + + it('should set `Cancelled` status on `Pending` file', () => { + file.status = FileUploadStatus.Pending; + component.cancelFile(file); + + expect(file.status).toBe(FileUploadStatus.Cancelled); + }); }); describe('removeFile()', () => { @@ -106,6 +120,40 @@ describe('FileUploadingListComponent', () => { expect(uploadService.cancelUpload).toHaveBeenCalled(); }); + it('should set `Deleted` status on file version instances when original is removed', () => { + component.files = [ + { + data: { + entry: { id: 'nodeId' } + }, + name: 'file', + status: FileUploadStatus.Complete, + options: { + newVersion: false + } + }, + { + data: { + entry: { id: 'nodeId' } + }, + name: 'file_v1', + status: FileUploadStatus.Complete, + options: { + newVersion: true + } + } + ]; + + spyOn(nodesApiService, 'deleteNode').and.returnValue(of(component.files[0])); + + component.removeFile(component.files[0]); + fixture.detectChanges(); + + expect(nodesApiService.deleteNode).toHaveBeenCalledTimes(1); + expect(component.files[0].status).toBe(FileUploadStatus.Deleted); + expect(component.files[1].status).toBe(FileUploadStatus.Deleted); + }); + describe('Events', () => { it('should throw an error event if delete file goes wrong', (done) => { diff --git a/lib/content-services/upload/components/file-uploading-list.component.ts b/lib/content-services/upload/components/file-uploading-list.component.ts index bd31019ec8..721db2ec22 100644 --- a/lib/content-services/upload/components/file-uploading-list.component.ts +++ b/lib/content-services/upload/components/file-uploading-list.component.ts @@ -65,7 +65,11 @@ export class FileUploadingListComponent { * @memberOf FileUploadingListComponent */ cancelFile(file: FileModel): void { - this.uploadService.cancelUpload(file); + if (file.status === FileUploadStatus.Pending) { + file.status = FileUploadStatus.Cancelled; + } else { + this.uploadService.cancelUpload(file); + } } /** @@ -161,8 +165,9 @@ export class FileUploadingListComponent { this.files .filter( (item) => - item.data.entry.id === file.data.entry.id && - item.options.newVersion + item.options.newVersion && + item.data.entry.id === file.data.entry.id + ) .map((item) => { item.status = FileUploadStatus.Deleted;