From 3532bbee2bba3c5ae876f123dea5f3df900d8733 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8D=A1=E8=89=B2?= Date: Sun, 22 Jul 2018 13:55:42 +0800 Subject: [PATCH] fix(module:upload): fix parameter value muse be a function or boolean in nzRemove (#1851) close #1850 --- components/upload/nz-upload.component.ts | 8 +++-- components/upload/upload.spec.ts | 37 ++++++++++++++++++++---- 2 files changed, 36 insertions(+), 9 deletions(-) diff --git a/components/upload/nz-upload.component.ts b/components/upload/nz-upload.component.ts index 4f0977974e7..86b45c1f094 100644 --- a/components/upload/nz-upload.component.ts +++ b/components/upload/nz-upload.component.ts @@ -137,7 +137,7 @@ export class NzUploadComponent implements OnInit, OnChanges, OnDestroy { return this._withCredentials; } - @Input() nzRemove: ((file: UploadFile) => boolean) | Observable; + @Input() nzRemove: (file: UploadFile) => boolean | Observable; @Input() nzPreview: (file: UploadFile) => void; @Output() nzChange: EventEmitter = new EventEmitter(); @@ -314,9 +314,11 @@ export class NzUploadComponent implements OnInit, OnChanges, OnDestroy { onRemove = (file: UploadFile): void => { this.upload.abort(file); file.status = 'removed'; - ((this.nzRemove ? this.nzRemove instanceof Observable ? this.nzRemove : of(this.nzRemove(file)) : of(true)) as Observable) + const fnRes = typeof this.nzRemove === 'function' ? + this.nzRemove(file) : this.nzRemove == null ? true : this.nzRemove; + (fnRes instanceof Observable ? fnRes : of(fnRes)) .pipe(filter((res: boolean) => res)) - .subscribe(res => { + .subscribe(() => { this.nzFileList = this.removeFileItem(file, this.nzFileList); this.nzChange.emit({ file, diff --git a/components/upload/upload.spec.ts b/components/upload/upload.spec.ts index 05b6860c6d7..2da82e3162a 100644 --- a/components/upload/upload.spec.ts +++ b/components/upload/upload.spec.ts @@ -1,12 +1,13 @@ // tslint:disable:no-any import { CommonModule } from '@angular/common'; import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing'; -import { Component, ContentChild, DebugElement, Injector, Input, ViewChild, ViewEncapsulation } from '@angular/core'; +import { Component, DebugElement, Injector, ViewChild, ViewEncapsulation } from '@angular/core'; import { fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { of, Observable } from 'rxjs'; +import { delay } from 'rxjs/operators'; import { NzI18nModule, NzI18nService } from '../i18n'; import en_US from '../i18n/languages/en_US'; @@ -17,7 +18,6 @@ import { ShowUploadListInterface, UploadChangeParam, UploadFile, UploadFilter, U import { NzUploadBtnComponent } from './nz-upload-btn.component'; import { NzUploadListComponent } from './nz-upload-list.component'; import { NzUploadComponent } from './nz-upload.component'; -import { NzUploadModule } from './nz-upload.module'; const PNGSMALL = { target: { files: [new File([`iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8/5+hHgAHggJ/PchI7wAAAABJRU5ErkJggg==`], 'test.png', { type: 'image/png' @@ -392,7 +392,7 @@ describe('upload', () => { httpMock.verify(); }); - describe('[onRemove]', () => { + describe('[nzRemove]', () => { const INITCOUNT = 3; beforeEach(() => { instance.nzFileList = [ @@ -419,8 +419,33 @@ describe('upload', () => { ] as any[]; fixture.detectChanges(); }); - it('should be with Observable', () => { - instance.onRemove = of(false); + it('should be return a Observable', () => { + instance.onRemove = () => of(false); + fixture.detectChanges(); + expect(dl.queryAll(By.css('.anticon-cross')).length).toBe(INITCOUNT); + dl.query(By.css('.anticon-cross')).nativeElement.click(); + expect(dl.queryAll(By.css('.anticon-cross')).length).toBe(INITCOUNT); + }); + it('should be return a Observable includes a delay operation', (done: () => void) => { + const DELAY = 20; + instance.onRemove = (file: UploadFile) => of(true).pipe(delay(DELAY)); + fixture.detectChanges(); + expect(dl.queryAll(By.css('.anticon-cross')).length).toBe(INITCOUNT); + dl.query(By.css('.anticon-cross')).nativeElement.click(); + setTimeout(() => { + expect(dl.queryAll(By.css('.anticon-cross')).length).toBe(INITCOUNT - 1); + done(); + }, DELAY + 1); + }); + it('should be return a truth value', () => { + instance.onRemove = () => true; + fixture.detectChanges(); + expect(dl.queryAll(By.css('.anticon-cross')).length).toBe(INITCOUNT); + dl.query(By.css('.anticon-cross')).nativeElement.click(); + expect(dl.queryAll(By.css('.anticon-cross')).length).toBe(INITCOUNT - 1); + }); + it('should be return a falsy value', () => { + instance.onRemove = () => false; fixture.detectChanges(); expect(dl.queryAll(By.css('.anticon-cross')).length).toBe(INITCOUNT); dl.query(By.css('.anticon-cross')).nativeElement.click(); @@ -923,7 +948,7 @@ class TestUploadComponent { this._onPreview = true; } _onRemove = false; - onRemove: ((file: UploadFile) => boolean) | Observable = (file: UploadFile): boolean => { + onRemove: (file: UploadFile) => boolean | Observable = (file: UploadFile): boolean => { this._onRemove = true; return true; }