From c06374d8955681a398ada83e0f48d595231bb441 Mon Sep 17 00:00:00 2001 From: Wendell Date: Sat, 23 Feb 2019 20:25:14 +0800 Subject: [PATCH] build: add implicit this and others --- components/affix/affix.spec.ts | 4 +- components/alert/nz-alert.spec.ts | 22 +- .../auto-complete/nz-autocomplete.spec.ts | 39 +- components/avatar/nz-avatar.component.ts | 8 +- components/back-top/back-top.spec.ts | 2 +- components/badge/nz-badge.spec.ts | 33 +- components/breadcrumb/nz-breadcrumb.spec.ts | 25 +- components/button/demo/loading.ts | 4 +- components/button/nz-button.component.ts | 4 +- components/button/nz-button.spec.ts | 78 ++-- components/carousel/nz-carousel.spec.ts | 13 +- .../demo/default-value-and-lazyload.ts | 4 +- components/cascader/demo/lazy.ts | 4 +- components/cascader/nz-cascader.component.ts | 6 +- components/cascader/nz-cascader.spec.ts | 14 +- components/checkbox/nz-checkbox.spec.ts | 72 ++-- components/collapse/nz-collapse.spec.ts | 25 +- components/core/overlay/overlay-position.ts | 1 + components/core/polyfill/request-animation.ts | 2 + components/core/scroll/nz-scroll.service.ts | 1 + .../services/nz-measure-scrollbar.service.ts | 3 +- .../services/update-host-class.service.ts | 4 +- components/core/testing/type-in-element.ts | 4 +- components/core/types/indexable.ts | 3 + components/core/types/size.ts | 4 + components/core/util/check.ts | 3 +- .../core/util/scroll-into-view-if-needed.ts | 9 +- .../core/util/textarea-caret-position.ts | 1 + .../date-picker/abstract-picker.component.ts | 5 +- .../date-picker/date-picker.component.spec.ts | 39 +- .../date-range-picker.component.ts | 6 +- .../date-picker/lib/candy-date/candy-date.ts | 3 +- .../lib/lib-packer-supplements.spec.ts | 2 +- .../lib/popups/date-range-popup.component.ts | 36 +- .../month-picker.component.spec.ts | 31 +- components/date-picker/picker.component.ts | 2 +- .../range-picker.component.spec.ts | 42 ++- .../date-picker/week-picker.component.spec.ts | 4 +- .../date-picker/year-picker.component.spec.ts | 31 +- components/drawer/demo/service.ts | 5 +- components/drawer/nz-drawer.spec.ts | 15 +- components/dropdown/nz-dropdown.spec.ts | 48 ++- components/empty/nz-embed-empty.component.ts | 6 +- components/empty/nz-empty.component.ts | 2 +- components/empty/nz-empty.spec.ts | 28 +- components/form/demo/validate-reactive.ts | 4 +- components/form/nz-form-control.spec.ts | 82 ++-- components/form/nz-form-item.spec.ts | 12 +- components/form/nz-form-label.spec.ts | 10 +- components/form/nz-form-split.spec.ts | 8 +- components/form/nz-form-text.spec.ts | 8 +- components/form/nz-form.spec.ts | 10 +- components/grid/demo/flex-order.ts | 2 +- components/grid/nz-col.directive.ts | 5 +- components/grid/nz-grid.spec.ts | 71 ++-- components/grid/nz-row.directive.ts | 3 +- components/i18n/nz-i18n.service.ts | 3 +- components/icon/page/index.ts | 7 +- components/input-number/demo/formatter.ts | 8 +- .../input-number/nz-input-number.component.ts | 8 +- .../input-number/nz-input-number.spec.ts | 57 +-- components/input/demo/autosize-textarea.ts | 2 +- components/input/demo/password-input.ts | 2 +- components/input/nz-autoresize.spec.ts | 48 +-- components/input/nz-input-group.spec.ts | 83 ++-- components/input/nz-input.spec.ts | 24 +- components/layout/nz-layout.spec.ts | 34 +- components/mention/demo/avatar.ts | 34 +- components/mention/demo/controlled.ts | 2 +- components/mention/demo/custom-tag.ts | 2 +- components/mention/nz-mention.component.ts | 10 +- components/mention/nz-mention.spec.ts | 16 +- components/menu/demo/sider-current.ts | 2 +- components/menu/nz-menu-item.directive.ts | 5 +- components/menu/nz-menu.spec.ts | 66 ++-- components/message/demo/loading.ts | 2 +- components/modal/demo/service.ts | 4 +- components/modal/nz-modal.component.ts | 42 ++- components/modal/nz-modal.service.ts | 14 +- components/modal/nz-modal.spec.ts | 130 ++++--- components/modal/nz-modal.type.ts | 3 + components/pagination/nz-pagination.spec.ts | 60 +-- components/popconfirm/nz-popconfirm.spec.ts | 14 +- components/popover/nz-popover.spec.ts | 10 +- components/progress/demo/format.ts | 2 +- .../progress/nz-progress.component.html | 2 +- components/progress/nz-progress.component.ts | 7 +- components/progress/nz-progress.spec.ts | 53 +-- components/radio/nz-radio.spec.ts | 71 ++-- components/rate/nz-rate.spec.ts | 35 +- components/select/demo/coordinate.ts | 2 +- components/select/demo/custom-content.ts | 2 +- components/select/demo/scroll-load.ts | 7 +- components/select/demo/search-box.ts | 2 +- components/select/demo/search.ts | 2 +- components/select/demo/select-users.ts | 4 +- .../select/nz-option-container.component.ts | 8 +- components/select/nz-option-container.spec.ts | 29 +- components/select/nz-option-li.spec.ts | 19 +- .../select/nz-select-top-control.spec.ts | 23 +- .../select/nz-select-unselectable.spec.ts | 8 +- components/select/nz-select.component.spec.ts | 44 ++- components/skeleton/nz-skeleton.spec.ts | 13 +- components/slider/demo/event.ts | 4 +- components/slider/demo/icon-slider.ts | 7 +- components/slider/demo/tip-formatter.ts | 4 +- .../slider/nz-slider-handle.component.ts | 3 +- .../slider/nz-slider-track.component.ts | 6 +- components/slider/nz-slider.component.ts | 27 +- components/spin/nz-spin.spec.ts | 14 +- components/statistic/nz-countdown.spec.ts | 16 +- .../statistic/nz-statistic-number.spec.ts | 16 +- components/statistic/nz-statistic.spec.ts | 10 +- components/steps/nz-steps.spec.ts | 30 +- components/switch/nz-switch.spec.ts | 29 +- components/table/demo/custom-filter-panel.ts | 46 +-- components/table/demo/default-filter.ts | 3 +- components/table/demo/edit-row.ts | 2 +- components/table/demo/expand-children.ts | 42 +-- components/table/demo/expand.ts | 2 +- components/table/demo/grouping-columns.ts | 2 +- components/table/demo/head.ts | 3 +- components/table/demo/reset-filter.ts | 16 +- .../table/demo/row-selection-and-operation.ts | 16 +- components/table/demo/row-selection-custom.ts | 2 +- components/table/nz-table.spec.ts | 55 +-- components/table/nz-tbody.spec.ts | 16 +- components/table/nz-td.spec.ts | 16 +- components/table/nz-th.spec.ts | 55 +-- components/table/nz-thead.spec.ts | 10 +- components/table/nz-tr.spec.ts | 21 +- components/tabs/nz-tabs.spec.ts | 36 +- components/tag/nz-tag.spec.ts | 18 +- .../nz-time-picker-panel.component.spec.ts | 43 ++- .../nz-time-picker-panel.component.ts | 8 +- .../nz-time-picker.component.spec.ts | 10 +- .../time-picker/nz-time-picker.component.ts | 2 +- .../nz-time-value-accessor.directive.spec.ts | 21 +- components/timeline/nz-timeline.spec.ts | 31 +- components/tooltip/nz-tooltip.component.ts | 2 + components/tooltip/nz-tooltip.directive.ts | 5 +- components/tooltip/nz-tooltip.spec.ts | 15 +- .../tree-select/nz-tree-select.component.ts | 3 +- components/tree-select/nz-tree-select.spec.ts | 31 +- components/tree/demo/directory.ts | 6 + components/tree/demo/dynamic.ts | 2 +- components/tree/demo/search.ts | 8 +- components/tree/nz-tree-base.service.ts | 22 +- components/tree/nz-tree-node.component.ts | 2 +- components/tree/nz-tree-node.ts | 6 +- components/tree/nz-tree.component.ts | 2 +- components/tree/nz-tree.spec.ts | 27 +- components/upload/demo/drag.ts | 4 +- components/upload/demo/filter.ts | 3 +- components/upload/interface.ts | 5 +- components/upload/nz-upload-btn.component.ts | 4 +- components/upload/upload.spec.ts | 355 ++++++++++-------- scripts/site/_site/doc/app/app.component.ts | 2 +- .../share/nz-codebox/nz-codebox.component.ts | 2 +- .../nz-highlight/nz-highlight.component.ts | 2 +- tsconfig.json | 3 + 161 files changed, 1754 insertions(+), 1336 deletions(-) create mode 100644 components/core/types/indexable.ts diff --git a/components/affix/affix.spec.ts b/components/affix/affix.spec.ts index 161d181c3e3..c6af8e00465 100644 --- a/components/affix/affix.spec.ts +++ b/components/affix/affix.spec.ts @@ -339,9 +339,9 @@ describe('affix', () => { }); describe('(nzChange)', () => { - let changeValue; + let changeValue: boolean; beforeEach(() => { - component.nzChange.subscribe((returnValue) => { + component.nzChange.subscribe((returnValue: boolean) => { changeValue = returnValue; }); }); diff --git a/components/alert/nz-alert.spec.ts b/components/alert/nz-alert.spec.ts index 549928183b0..5c2a04cf1be 100644 --- a/components/alert/nz-alert.spec.ts +++ b/components/alert/nz-alert.spec.ts @@ -1,5 +1,5 @@ -import { Component, TemplateRef, ViewChild } from '@angular/core'; -import { fakeAsync, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, TemplateRef, ViewChild } from '@angular/core'; +import { fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; @@ -15,9 +15,9 @@ describe('alert', () => { TestBed.compileComponents(); })); describe('basic alert', () => { - let fixture; - let testComponent; - let alert; + let fixture: ComponentFixture; + let testComponent: NzDemoTestBasicComponent; + let alert: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzDemoTestBasicComponent); fixture.detectChanges(); @@ -100,8 +100,8 @@ describe('alert', () => { }); }); describe('banner alert', () => { - let fixture; - let alert; + let fixture: ComponentFixture; + let alert: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzDemoTestBannerComponent); @@ -138,11 +138,11 @@ export class NzDemoTestBasicComponent { @ViewChild('template') template: TemplateRef; banner = false; closeable = false; - closeText; - description = 'description'; - message = 'message'; + closeText: string | TemplateRef; + description: string | TemplateRef = 'description'; + message: string | TemplateRef = 'message'; showIcon = false; - iconType; + iconType: string; type = 'info'; onClose = jasmine.createSpy('close callback'); } diff --git a/components/auto-complete/nz-autocomplete.spec.ts b/components/auto-complete/nz-autocomplete.spec.ts index 0a751b5d0f3..cd2ce6d357b 100644 --- a/components/auto-complete/nz-autocomplete.spec.ts +++ b/components/auto-complete/nz-autocomplete.spec.ts @@ -11,7 +11,7 @@ import { ViewChild, ViewChildren } from '@angular/core'; -import { async, fakeAsync, flush, inject, tick, TestBed } from '@angular/core/testing'; +import { async, fakeAsync, flush, inject, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule, FormBuilder, FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; @@ -74,8 +74,8 @@ describe('auto-complete', () => { })); describe('toggling', () => { - let fixture; - let input; + let fixture: ComponentFixture; + let input: HTMLInputElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestSimpleAutocompleteComponent); @@ -196,6 +196,7 @@ describe('auto-complete', () => { trigger.openPanel(); fixture.detectChanges(); + // @ts-ignore trigger.destroyPanel(); expect(() => trigger.closePanel()).not.toThrow(); @@ -271,8 +272,8 @@ describe('auto-complete', () => { }); describe('property', () => { - let fixture; - let input; + let fixture: ComponentFixture; + let input: HTMLInputElement; let DOWN_ARROW_EVENT: KeyboardEvent; let ENTER_EVENT: KeyboardEvent; let TAB_EVENT: KeyboardEvent; @@ -394,8 +395,8 @@ describe('auto-complete', () => { }); describe('value', () => { - let fixture; - let input; + let fixture: ComponentFixture; + let input: HTMLInputElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestSimpleAutocompleteComponent); @@ -465,7 +466,7 @@ describe('auto-complete', () => { }); describe('form', () => { - let fixture; + let fixture: ComponentFixture; let input: HTMLInputElement; beforeEach(() => { @@ -477,7 +478,7 @@ describe('auto-complete', () => { it('should set the value with form', () => { const componentInstance = fixture.componentInstance; fixture.detectChanges(); - expect(componentInstance.form.get('formControl').value) + expect(componentInstance.form.get('formControl')!.value) .toContain('Burns'); expect(input.value) .toContain('Burns'); @@ -517,8 +518,8 @@ describe('auto-complete', () => { }); describe('option groups', () => { - let fixture; - let input; + let fixture: ComponentFixture; + let input: HTMLInputElement; let DOWN_ARROW_EVENT: KeyboardEvent; let ENTER_EVENT: KeyboardEvent; @@ -561,7 +562,7 @@ describe('auto-complete', () => { }); describe('Option selection', () => { - let fixture; + let fixture: ComponentFixture; beforeEach((() => { fixture = TestBed.createComponent(NzTestSimpleAutocompleteComponent); @@ -627,8 +628,8 @@ describe('auto-complete', () => { }); describe('keyboard events', () => { - let fixture; - let input; + let fixture: ComponentFixture; + let input: HTMLInputElement; let DOWN_ARROW_EVENT: KeyboardEvent; let UP_ARROW_EVENT: KeyboardEvent; let ENTER_EVENT: KeyboardEvent; @@ -830,7 +831,7 @@ describe('auto-complete', () => { }); describe('Fallback positions', () => { - let fixture; + let fixture: ComponentFixture; beforeEach(() => { fixture = TestBed.createComponent(NzTestSimpleAutocompleteComponent); @@ -877,7 +878,7 @@ describe('auto-complete', () => { }); describe('misc', () => { - let fixture; + let fixture: ComponentFixture; beforeEach(() => { fixture = TestBed.createComponent(NzTestAutocompleteWithoutPanelComponent); @@ -932,9 +933,9 @@ describe('auto-complete', () => { }) class NzTestSimpleAutocompleteComponent { inputValue: string; - filteredOptions: string[]; + filteredOptions: Array; inputControl = new FormControl(); - options = ['Burns Bay Road', 'Downing Street', 'Wall Street']; + options: Array = ['Burns Bay Road', 'Downing Street', 'Wall Street']; @ViewChild(NzAutocompleteComponent) panel: NzAutocompleteComponent; @ViewChild(NzAutocompleteTriggerDirective) trigger: NzAutocompleteTriggerDirective; @@ -945,7 +946,7 @@ class NzTestSimpleAutocompleteComponent { } onInput(value: string): void { - this.filteredOptions = this.options.filter(s => new RegExp(value, 'gi').test(s)); + this.filteredOptions = this.options.filter(s => new RegExp(value, 'gi').test(`${s}`)); } } diff --git a/components/avatar/nz-avatar.component.ts b/components/avatar/nz-avatar.component.ts index a8696178627..31826abdcb1 100644 --- a/components/avatar/nz-avatar.component.ts +++ b/components/avatar/nz-avatar.component.ts @@ -12,11 +12,15 @@ import { } from '@angular/core'; import { NzUpdateHostClassService } from '../core/services/update-host-class.service'; -import { NzSizeLDSType } from '../core/types/size'; +import { NzSizeLDSType, NzSizeMap } from '../core/types/size'; export type NzAvatarShape = 'square' | 'circle'; export type NzAvatarSize = NzSizeLDSType | number; +export interface NzAvatarSizeMap { + [ size: string ]: string; +} + @Component({ selector : 'nz-avatar', templateUrl : './nz-avatar.component.html', @@ -44,7 +48,7 @@ export class NzAvatarComponent implements OnChanges { private el: HTMLElement = this.elementRef.nativeElement; private prefixCls = 'ant-avatar'; - private sizeMap = { large: 'lg', small: 'sm' }; + private sizeMap: NzSizeMap = { large: 'lg', small: 'sm' }; constructor( private elementRef: ElementRef, diff --git a/components/back-top/back-top.spec.ts b/components/back-top/back-top.spec.ts index 7e6e00aab75..c87825d4fc2 100644 --- a/components/back-top/back-top.spec.ts +++ b/components/back-top/back-top.spec.ts @@ -147,7 +147,7 @@ describe('Component:nz-back-top', () => { describe('when clicked', () => { it(`emit event on nzClick`, fakeAsync(() => { - component.nzClick.subscribe((returnValue) => { + component.nzClick.subscribe((returnValue: boolean) => { expect(returnValue).toBe(true); }); diff --git a/components/badge/nz-badge.spec.ts b/components/badge/nz-badge.spec.ts index 646ec305ac3..0c8eb4ef8eb 100644 --- a/components/badge/nz-badge.spec.ts +++ b/components/badge/nz-badge.spec.ts @@ -1,8 +1,10 @@ -import { Component } from '@angular/core'; -import { fakeAsync, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; +import { NGStyleInterface } from '../core/types/ng-class'; + import { NzBadgeComponent } from './nz-badge.component'; import { NzBadgeModule } from './nz-badge.module'; @@ -14,26 +16,29 @@ describe('badge', () => { }); TestBed.compileComponents(); })); + describe('basic badge', () => { - let fixture; - let testComponent; - let badgeElement; + let fixture: ComponentFixture; + let testComponent: NzTestBadgeBasicComponent; + let badgeElement: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestBadgeBasicComponent); fixture.detectChanges(); testComponent = fixture.debugElement.componentInstance; badgeElement = fixture.debugElement.query(By.directive(NzBadgeComponent)); }); + it('should className correct', () => { fixture.detectChanges(); expect(badgeElement.nativeElement.classList).toContain('ant-badge'); }); + it('should count work', () => { fixture.detectChanges(); expect(badgeElement.nativeElement.querySelector('sup').classList).toContain('ant-scroll-number'); expect(badgeElement.nativeElement.querySelector('sup').classList).toContain('ant-badge-count'); expect(badgeElement.nativeElement.querySelector('sup').classList).not.toContain('ant-badge-multiple-words'); - console.log(badgeElement.nativeElement); expect(badgeElement.nativeElement.querySelector('.current').innerText).toBe('5'); testComponent.count = 10; fixture.detectChanges(); @@ -41,6 +46,7 @@ describe('badge', () => { expect(badgeElement.nativeElement.querySelectorAll('.current')[ 0 ].innerText).toBe('1'); expect(badgeElement.nativeElement.querySelectorAll('.current')[ 1 ].innerText).toBe('0'); }); + it('should overflow work', () => { testComponent.overflow = 4; fixture.detectChanges(); @@ -54,6 +60,7 @@ describe('badge', () => { fixture.detectChanges(); expect(badgeElement.nativeElement.querySelector('sup').innerText).not.toBe('99+'); }); + it('should showZero work', fakeAsync(() => { testComponent.count = 0; fixture.detectChanges(); @@ -64,6 +71,7 @@ describe('badge', () => { fixture.detectChanges(); expect(badgeElement.nativeElement.querySelector('.current').innerText).toBe('0'); })); + it('should negative number not display', fakeAsync(() => { testComponent.count = -10; fixture.detectChanges(); @@ -74,6 +82,7 @@ describe('badge', () => { fixture.detectChanges(); expect(badgeElement.nativeElement.querySelector('.current').innerText).toBe('0'); })); + it('should dot work', () => { fixture.detectChanges(); expect(badgeElement.nativeElement.querySelector('sup').classList).not.toContain('ant-badge-dot'); @@ -81,6 +90,7 @@ describe('badge', () => { fixture.detectChanges(); expect(badgeElement.nativeElement.querySelector('sup').classList).toContain('ant-badge-dot'); }); + it('should no wrapper work', fakeAsync(() => { testComponent.inner = false; testComponent.style = { backgroundColor: '#52c41a' }; @@ -92,6 +102,7 @@ describe('badge', () => { // expect(badgeElement.nativeElement.classList).toContain('ant-badge-not-a-wrapper'); expect(badgeElement.nativeElement.querySelector('sup').style.backgroundColor).toBe('rgb(82, 196, 26)'); })); + it('should status work', () => { testComponent.inner = false; const statusList = [ 'success', 'processing', 'default', 'error', 'warning' ]; @@ -123,12 +134,12 @@ describe('badge', () => { ` }) export class NzTestBadgeBasicComponent { - style; count = 5; + dot = false; + inner = true; overflow = 20; showZero = false; - inner = true; - status; - text; - dot = false; + status: string; + style: NGStyleInterface; + text: string; } diff --git a/components/breadcrumb/nz-breadcrumb.spec.ts b/components/breadcrumb/nz-breadcrumb.spec.ts index 3b659f60a08..bc2a095ed90 100644 --- a/components/breadcrumb/nz-breadcrumb.spec.ts +++ b/components/breadcrumb/nz-breadcrumb.spec.ts @@ -1,6 +1,6 @@ import { CommonModule } from '@angular/common'; -import { Component } from '@angular/core'; -import { async, fakeAsync, flush, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { async, fakeAsync, flush, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { Router, Routes } from '@angular/router'; import { RouterTestingModule } from '@angular/router/testing'; @@ -15,11 +15,11 @@ import { NzBreadCrumbComponent } from './nz-breadcrumb.component'; import { NzBreadCrumbModule } from './nz-breadcrumb.module'; describe('breadcrumb', () => { - let fixture; - describe('basic', () => { - let items; - let breadcrumb; + let fixture: ComponentFixture; + let items: DebugElement[]; + let breadcrumb: DebugElement; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzBreadCrumbModule ], @@ -43,8 +43,10 @@ describe('breadcrumb', () => { }); describe('separator', () => { - let items; - let breadcrumbs; + let fixture: ComponentFixture; + let items: DebugElement[]; + let breadcrumbs: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzBreadCrumbModule, NzIconTestModule ], @@ -69,9 +71,10 @@ describe('breadcrumb', () => { }); describe('auto generated', () => { + let fixture: ComponentFixture; let router: Router; - let breadcrumb; - let items; + let breadcrumb: DebugElement; + let items: DebugElement[]; // TODO: pending this test because of Angular's bug: https://github.com/angular/angular/issues/25837 xit('should auto generating work', fakeAsync(() => { @@ -82,7 +85,7 @@ describe('breadcrumb', () => { fixture = TestBed.createComponent(NzBreadcrumbAutoGenerateDemoComponent); breadcrumb = fixture.debugElement.query(By.directive(NzBreadCrumbComponent)); - fixture.ngZone.run(() => { + fixture.ngZone!.run(() => { router = TestBed.get(Router); router.initialNavigation(); // Generate breadcrumb items. diff --git a/components/button/demo/loading.ts b/components/button/demo/loading.ts index 1f5850501ef..bf7f93e89f9 100644 --- a/components/button/demo/loading.ts +++ b/components/button/demo/loading.ts @@ -27,14 +27,14 @@ export class NzDemoButtonLoadingComponent { loadOne(): void { this.isLoadingOne = true; - setTimeout(_ => { + setTimeout(() => { this.isLoadingOne = false; }, 5000); } loadTwo(): void { this.isLoadingTwo = true; - setTimeout(_ => { + setTimeout(() => { this.isLoadingTwo = false; }, 5000); } diff --git a/components/button/nz-button.component.ts b/components/button/nz-button.component.ts index 1c453c2cdbe..c5dd44ef825 100644 --- a/components/button/nz-button.component.ts +++ b/components/button/nz-button.component.ts @@ -22,7 +22,7 @@ import { import { ANIMATION_MODULE_TYPE } from '@angular/platform-browser/animations'; import { NzUpdateHostClassService } from '../core/services/update-host-class.service'; -import { NzSizeLDSType } from '../core/types/size'; +import { NzSizeLDSType, NzSizeMap } from '../core/types/size'; import { isEmpty } from '../core/util/check'; import { InputBoolean } from '../core/util/convert'; import { findFirstNotEmptyNode, findLastNotEmptyNode } from '../core/util/dom'; @@ -58,7 +58,7 @@ export class NzButtonComponent implements AfterContentInit, OnInit, OnDestroy, O /** temp solution since no method add classMap to host https://github.com/angular/angular/issues/7289 */ setClassMap(): void { const prefixCls = 'ant-btn'; - const sizeMap = { large: 'lg', small: 'sm' }; + const sizeMap: NzSizeMap = { large: 'lg', small: 'sm' }; this.nzUpdateHostClassService.updateHostClass(this.el, { [ `${prefixCls}` ] : true, [ `${prefixCls}-${this.nzType}` ] : this.nzType, diff --git a/components/button/nz-button.spec.ts b/components/button/nz-button.spec.ts index 882f95b9dfe..6a732dc1af2 100644 --- a/components/button/nz-button.spec.ts +++ b/components/button/nz-button.spec.ts @@ -1,5 +1,5 @@ -import { Component, NO_ERRORS_SCHEMA } from '@angular/core'; -import { async, fakeAsync, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, NO_ERRORS_SCHEMA } from '@angular/core'; +import { async, fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzIconTestModule } from '../icon/nz-icon-test.module'; @@ -17,10 +17,10 @@ import { NzButtonComponent } from './nz-button.component'; import { NzButtonModule } from './nz-button.module'; describe('button', () => { - let testComponent; - let fixture; describe('basic', () => { - let buttons; + let fixture: ComponentFixture; + let buttons: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzButtonModule ], @@ -31,7 +31,6 @@ describe('button', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoButtonBasicComponent); - testComponent = fixture.debugElement.componentInstance; buttons = fixture.debugElement.queryAll(By.directive(NzButtonComponent)); }); @@ -43,8 +42,11 @@ describe('button', () => { expect(buttons[ 3 ].nativeElement.classList.contains('ant-btn-danger')).toBe(true); }); }); + describe('button-group', () => { - let buttonGroup; + let fixture: ComponentFixture; + let buttonGroup: DebugElement; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzButtonModule ], @@ -55,7 +57,6 @@ describe('button', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoButtonButtonGroupComponent); - testComponent = fixture.debugElement.componentInstance; buttonGroup = fixture.debugElement.query(By.directive(NzButtonGroupComponent)); }); @@ -65,11 +66,15 @@ describe('button', () => { }); it('should have no white space', () => { fixture.detectChanges(); + // @ts-ignore expect(Array.from(buttonGroup.nativeElement.firstElementChild).some((node: HTMLElement) => node.nodeType === 3)).toBe(false); }); }); + describe('disabled', () => { - let buttons; + let fixture: ComponentFixture; + let buttons: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzButtonModule ], @@ -80,7 +85,6 @@ describe('button', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoButtonDisabledComponent); - testComponent = fixture.debugElement.componentInstance; buttons = fixture.debugElement.queryAll(By.directive(NzButtonComponent)); }); @@ -89,8 +93,11 @@ describe('button', () => { expect(!!buttons[ 1 ].nativeElement.attributes.getNamedItem('disabled')).toBe(true); }); }); + describe('ghost', () => { - let buttons; + let fixture: ComponentFixture; + let buttons: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzButtonModule ], @@ -101,7 +108,6 @@ describe('button', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoButtonGhostComponent); - testComponent = fixture.debugElement.componentInstance; buttons = fixture.debugElement.queryAll(By.directive(NzButtonComponent)); }); @@ -113,8 +119,11 @@ describe('button', () => { expect(buttons[ 3 ].nativeElement.classList.contains('ant-btn-background-ghost')).toBe(true); }); }); + describe('icon', () => { - let buttons; + let fixture: ComponentFixture; + let buttons: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzButtonModule, NzIconTestModule ], @@ -125,7 +134,6 @@ describe('button', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoButtonIconComponent); - testComponent = fixture.debugElement.componentInstance; buttons = fixture.debugElement.queryAll(By.directive(NzButtonComponent)); }); @@ -138,8 +146,11 @@ describe('button', () => { expect(buttons[ 1 ].nativeElement.firstElementChild.style.cssText).toBe('display: inline-block;'); }); }); + describe('loading', () => { - let buttons; + let fixture: ComponentFixture; + let buttons: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzButtonModule, NzIconTestModule ], @@ -150,7 +161,6 @@ describe('button', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoButtonLoadingComponent); - testComponent = fixture.debugElement.componentInstance; buttons = fixture.debugElement.queryAll(By.directive(NzButtonComponent)); }); @@ -158,6 +168,7 @@ describe('button', () => { fixture.detectChanges(); expect(buttons[ 0 ].nativeElement.classList.contains('ant-btn-loading')).toBe(true); }); + it('should loading when click without icon', fakeAsync(() => { const button = buttons[ 2 ]; fixture.detectChanges(); @@ -176,6 +187,7 @@ describe('button', () => { expect(button.nativeElement.classList.contains('ant-btn-loading')).toBe(false); expect(button.nativeElement.firstElementChild.localName).toBe('span'); })); + it('should loading when click with icon', fakeAsync(() => { const button = buttons[ 3 ]; fixture.detectChanges(); @@ -201,9 +213,13 @@ describe('button', () => { expect(button.nativeElement.firstElementChild.localName).toBe('i'); })); }); + describe('size', () => { - let buttons; - let buttonGroup; + let fixture: ComponentFixture; + let testComponent: NzDemoButtonSizeComponent; + let buttons: DebugElement[]; + let buttonGroup: DebugElement; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzButtonModule ], @@ -234,8 +250,11 @@ describe('button', () => { expect(buttonGroup.nativeElement.classList.contains('ant-btn-group-sm')).toBe(true); }); }); + describe('icon', () => { - let button; + let fixture: ComponentFixture; + let button: DebugElement; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzButtonModule ], @@ -246,7 +265,6 @@ describe('button', () => { beforeEach(() => { fixture = TestBed.createComponent(NzTestButtonSearchComponent); - testComponent = fixture.debugElement.componentInstance; button = fixture.debugElement.query(By.directive(NzButtonComponent)); }); @@ -255,8 +273,11 @@ describe('button', () => { expect(button.nativeElement.classList.contains('ant-input-search-button')).toBe(true); }); }); + describe('block', () => { - let buttons; + let fixture: ComponentFixture; + let buttons: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzButtonModule ], @@ -267,7 +288,6 @@ describe('button', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoButtonBlockComponent); - testComponent = fixture.debugElement.componentInstance; buttons = fixture.debugElement.queryAll(By.directive(NzButtonComponent)); }); @@ -284,8 +304,11 @@ describe('button', () => { expect(buttons[ 3 ].nativeElement.classList.contains('ant-btn-block')).toBe(true); }); }); + describe('binding', () => { - let button; + let fixture: ComponentFixture; + let button: DebugElement; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzButtonModule, NzIconTestModule ], @@ -296,7 +319,6 @@ describe('button', () => { beforeEach(() => { fixture = TestBed.createComponent(NzTestButtonBindingComponent); - testComponent = fixture.debugElement.componentInstance; button = fixture.debugElement.query(By.directive(NzButtonComponent)); }); @@ -322,7 +344,6 @@ describe('button', () => { expect(button.nativeElement.querySelector('.anticon-poweroff').style.cssText).toBe('display: inline-block;'); })); }); - }); @Component({ @@ -333,7 +354,7 @@ describe('button', () => { export class NzTestButtonSearchComponent { } -/** https://github.com/NG-ZORRO/ng-zorro-antd/issues/2191 **/ +// https://github.com/NG-ZORRO/ng-zorro-antd/issues/2191 @Component({ selector: 'nz-test-button-binding', template: `` @@ -343,9 +364,6 @@ export class NzTestButtonBindingComponent { load(): void { this.loading = true; - setTimeout(_ => { - this.loading = false; - }, 5000); + setTimeout(() => this.loading = false, 5000); } - } diff --git a/components/carousel/nz-carousel.spec.ts b/components/carousel/nz-carousel.spec.ts index a0e8a005898..5aec779aeb4 100644 --- a/components/carousel/nz-carousel.spec.ts +++ b/components/carousel/nz-carousel.spec.ts @@ -1,6 +1,6 @@ import { LEFT_ARROW, RIGHT_ARROW } from '@angular/cdk/keycodes'; -import { Component, ViewChild } from '@angular/core'; -import { fakeAsync, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, ViewChild } from '@angular/core'; +import { fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { dispatchKeyboardEvent } from '../core/testing'; @@ -18,10 +18,10 @@ describe('carousel', () => { TestBed.compileComponents(); })); describe('carousel basic', () => { - let fixture; - let testComponent; - let carouselWrapper; - let carouselContents; + let fixture: ComponentFixture; + let testComponent: NzTestCarouselBasicComponent; + let carouselWrapper: DebugElement; + let carouselContents: DebugElement[]; beforeEach(() => { fixture = TestBed.createComponent(NzTestCarouselBasicComponent); fixture.detectChanges(); @@ -162,6 +162,7 @@ describe('carousel', () => { expect(carouselContents[ 2 ].nativeElement.classList).toContain('slick-active'); }); it('should resize content after window resized', fakeAsync(() => { + // @ts-ignore const resizeSpy = spyOn(testComponent.nzCarouselComponent, 'renderContent'); window.dispatchEvent(new Event('resize')); tick(200); diff --git a/components/cascader/demo/default-value-and-lazyload.ts b/components/cascader/demo/default-value-and-lazyload.ts index 80e4548cae8..b1a1425ae82 100644 --- a/components/cascader/demo/default-value-and-lazyload.ts +++ b/components/cascader/demo/default-value-and-lazyload.ts @@ -9,7 +9,7 @@ const provinces = [{ label: 'Jiangsu' }]; -const cities = { +const cities: { [ key: string ]: Array<{ value: string, label: string, isLeaf?: boolean }> } = { zhejiang: [{ value: 'hangzhou', label: 'Hangzhou' @@ -24,7 +24,7 @@ const cities = { }] }; -const scenicspots = { +const scenicspots: { [ key: string ]: Array<{ value: string, label: string, isLeaf?: boolean }> } = { hangzhou: [{ value: 'xihu', label: 'West Lake', diff --git a/components/cascader/demo/lazy.ts b/components/cascader/demo/lazy.ts index 3e8c32c5834..e5c0fb41a85 100644 --- a/components/cascader/demo/lazy.ts +++ b/components/cascader/demo/lazy.ts @@ -9,7 +9,7 @@ const provinces = [{ label: 'Jiangsu' }]; -const cities = { +const cities: { [ key: string ]: Array<{ value: string, label: string, isLeaf?: boolean }> } = { zhejiang: [{ value: 'hangzhou', label: 'Hangzhou' @@ -24,7 +24,7 @@ const cities = { }] }; -const scenicspots = { +const scenicspots: { [ key: string ]: Array<{ value: string, label: string, isLeaf?: boolean }> } = { hangzhou: [{ value: 'xihu', label: 'West Lake', diff --git a/components/cascader/nz-cascader.component.ts b/components/cascader/nz-cascader.component.ts index 49c377d8c0a..147f9281429 100644 --- a/components/cascader/nz-cascader.component.ts +++ b/components/cascader/nz-cascader.component.ts @@ -42,7 +42,7 @@ import { NzShowSearchOptions } from './types'; -const defaultDisplayRender = label => label.join(' / '); +const defaultDisplayRender = (labels: string[]) => labels.join(' / '); @Component({ changeDetection : ChangeDetectionStrategy.OnPush, @@ -146,8 +146,8 @@ export class NzCascaderComponent implements OnDestroy, ControlValueAccessor { isFocused = false; private isOpening = false; - private defaultValue; // Default value written by `[ngModel]` - private value; + private defaultValue: any; // tslint:disable-line:no-any // Default value written by `[ngModel]` + private value: any; // tslint:disable-line:no-any private selectedOptions: CascaderOption[] = []; private activatedOptions: CascaderOption[] = []; private columnsSnapshot: CascaderOption[][]; diff --git a/components/cascader/nz-cascader.spec.ts b/components/cascader/nz-cascader.spec.ts index 5f04f246ff0..c7fac20df42 100644 --- a/components/cascader/nz-cascader.spec.ts +++ b/components/cascader/nz-cascader.spec.ts @@ -1,7 +1,7 @@ // tslint:disable:no-any import { ConnectedOverlayPositionChange, OverlayContainer } from '@angular/cdk/overlay'; -import { Component, TemplateRef, ViewChild } from '@angular/core'; -import { async, fakeAsync, flush, inject, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, TemplateRef, ViewChild } from '@angular/core'; +import { async, fakeAsync, flush, inject, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; @@ -18,13 +18,14 @@ import { NzCascaderModule } from './nz-cascader.module'; import { CascaderOption, NzShowSearchOptions } from './types'; describe('cascader', () => { - let fixture; let overlayContainer: OverlayContainer; let overlayContainerElement: HTMLElement; describe('default', () => { - let cascader; + let fixture: ComponentFixture; + let cascader: DebugElement; let testComponent: NzDemoCascaderDefaultComponent; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ FormsModule, ReactiveFormsModule, NoopAnimationsModule, NzCascaderModule ], @@ -1493,7 +1494,8 @@ describe('cascader', () => { }); describe('load data lazily', () => { - let cascader; + let fixture: ComponentFixture; + let cascader: DebugElement; let testComponent: NzDemoCascaderLoadDataComponent; beforeEach(async(() => { TestBed.configureTestingModule({ @@ -1788,7 +1790,7 @@ const options4 = [ { } ] } ]; -const options5 = []; +const options5: any[] = []; // tslint:disable-line:no-any @Component({ selector: 'nz-demo-cascader-default', diff --git a/components/checkbox/nz-checkbox.spec.ts b/components/checkbox/nz-checkbox.spec.ts index b99aa061090..85bf769b64a 100644 --- a/components/checkbox/nz-checkbox.spec.ts +++ b/components/checkbox/nz-checkbox.spec.ts @@ -1,5 +1,5 @@ -import { Component, ViewChild } from '@angular/core'; -import { fakeAsync, flush, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, ViewChild } from '@angular/core'; +import { fakeAsync, flush, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule, FormBuilder, FormGroup, ReactiveFormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; @@ -17,15 +17,17 @@ describe('checkbox', () => { TestBed.compileComponents(); })); describe('checkbox basic', () => { - let fixture; - let testComponent; - let checkbox; + let fixture: ComponentFixture; + let testComponent: NzTestCheckboxSingleComponent; + let checkbox: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestCheckboxSingleComponent); fixture.detectChanges(); testComponent = fixture.debugElement.componentInstance; checkbox = fixture.debugElement.query(By.directive(NzCheckboxComponent)); }); + it('should className correct', () => { fixture.detectChanges(); expect(checkbox.nativeElement.classList.contains('ant-checkbox-wrapper')).toBe(true); @@ -111,10 +113,11 @@ describe('checkbox', () => { }); }); describe('checkbox group basic', () => { - let fixture; - let testComponent; - let checkboxGroup; - let checkboxs; + let fixture: ComponentFixture; + let testComponent: NzTestCheckboxGroupComponent; + let checkboxGroup: DebugElement; + let checkboxs: HTMLElement[]; + beforeEach(fakeAsync(() => { fixture = TestBed.createComponent(NzTestCheckboxGroupComponent); fixture.detectChanges(); @@ -170,10 +173,11 @@ describe('checkbox', () => { })); }); describe('checkbox form', () => { - let fixture; - let testComponent; - let checkbox; - let inputElement; + let fixture: ComponentFixture; + let testComponent: NzTestCheckboxFormComponent; + let checkbox: DebugElement; + let inputElement: HTMLInputElement; + beforeEach(fakeAsync(() => { fixture = TestBed.createComponent(NzTestCheckboxFormComponent); fixture.detectChanges(); @@ -191,23 +195,24 @@ describe('checkbox', () => { })); it('should set disabled work', fakeAsync(() => { flush(); - expect(testComponent.formGroup.get('checkbox').value).toBe(false); + expect(testComponent.formGroup.get('checkbox')!.value).toBe(false); inputElement.click(); flush(); fixture.detectChanges(); - expect(testComponent.formGroup.get('checkbox').value).toBe(true); + expect(testComponent.formGroup.get('checkbox')!.value).toBe(true); testComponent.disable(); inputElement.click(); flush(); fixture.detectChanges(); - expect(testComponent.formGroup.get('checkbox').value).toBe(true); + expect(testComponent.formGroup.get('checkbox')!.value).toBe(true); })); }); describe('checkbox group form', () => { - let fixture; - let testComponent; - let checkboxGroup; - let inputElement; + let fixture: ComponentFixture; + let testComponent: NzTestCheckboxGroupFormComponent; + let checkboxGroup: DebugElement; + let inputElement: HTMLInputElement; + beforeEach(fakeAsync(() => { fixture = TestBed.createComponent(NzTestCheckboxGroupFormComponent); fixture.detectChanges(); @@ -219,13 +224,13 @@ describe('checkbox', () => { })); it('should be in pristine, untouched, and valid states initially', fakeAsync(() => { flush(); - expect(testComponent.formGroup.get('checkboxGroup').valid).toBe(true); - expect(testComponent.formGroup.get('checkboxGroup').pristine).toBe(true); - expect(testComponent.formGroup.get('checkboxGroup').touched).toBe(false); + expect(testComponent.formGroup.get('checkboxGroup')!.valid).toBe(true); + expect(testComponent.formGroup.get('checkboxGroup')!.pristine).toBe(true); + expect(testComponent.formGroup.get('checkboxGroup')!.touched).toBe(false); })); it('should set disabled work', fakeAsync(() => { flush(); - expect(JSON.stringify(testComponent.formGroup.get('checkboxGroup').value)).toBe(JSON.stringify([ + expect(JSON.stringify(testComponent.formGroup.get('checkboxGroup')!.value)).toBe(JSON.stringify([ { label: 'Apple', value: 'Apple', checked: true }, { label: 'Pear', value: 'Pear', disabled: true }, { label: 'Orange', value: 'Orange' } @@ -234,7 +239,7 @@ describe('checkbox', () => { fixture.detectChanges(); flush(); fixture.detectChanges(); - expect(JSON.stringify(testComponent.formGroup.get('checkboxGroup').value)).toBe(JSON.stringify([ + expect(JSON.stringify(testComponent.formGroup.get('checkboxGroup')!.value)).toBe(JSON.stringify([ { label: 'Apple', value: 'Apple', checked: false }, { label: 'Pear', value: 'Pear', disabled: true }, { label: 'Orange', value: 'Orange' } @@ -246,7 +251,7 @@ describe('checkbox', () => { inputElement.click(); flush(); fixture.detectChanges(); - expect(JSON.stringify(testComponent.formGroup.get('checkboxGroup').value)).toBe(JSON.stringify([ + expect(JSON.stringify(testComponent.formGroup.get('checkboxGroup')!.value)).toBe(JSON.stringify([ { label: 'Apple', value: 'Apple', checked: false }, { label: 'Pear', value: 'Pear', disabled: true }, { label: 'Orange', value: 'Orange' } @@ -254,10 +259,11 @@ describe('checkbox', () => { })); }); describe('checkbox wrapper', () => { - let fixture; - let testComponent; - let checkboxWrapper; - let inputElement; + let fixture: ComponentFixture; + let testComponent: NzTestCheckboxWrapperComponent; + let checkboxWrapper: DebugElement; + let inputElement: HTMLInputElement; + beforeEach(fakeAsync(() => { fixture = TestBed.createComponent(NzTestCheckboxWrapperComponent); fixture.detectChanges(); @@ -283,7 +289,8 @@ describe('checkbox', () => { @Component({ selector: 'nz-test-checkbox-single', template: ` - ` + ` }) export class NzTestCheckboxSingleComponent { @ViewChild(NzCheckboxComponent) nzCheckboxComponent: NzCheckboxComponent; @@ -297,7 +304,8 @@ export class NzTestCheckboxSingleComponent { @Component({ selector: 'nz-test-checkbox-group', template: ` - + ` }) export class NzTestCheckboxGroupComponent { diff --git a/components/collapse/nz-collapse.spec.ts b/components/collapse/nz-collapse.spec.ts index c0033c8d7c2..96a075962be 100644 --- a/components/collapse/nz-collapse.spec.ts +++ b/components/collapse/nz-collapse.spec.ts @@ -1,5 +1,5 @@ -import { Component, TemplateRef, ViewChild } from '@angular/core'; -import { fakeAsync, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, TemplateRef, ViewChild } from '@angular/core'; +import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; @@ -16,10 +16,11 @@ describe('collapse', () => { TestBed.compileComponents(); })); describe('collapse basic', () => { - let fixture; - let testComponent; - let collapse; - let panels; + let fixture: ComponentFixture; + let testComponent: NzTestCollapseBasicComponent; + let collapse: DebugElement; + let panels: DebugElement[]; + beforeEach(() => { fixture = TestBed.createComponent(NzTestCollapseBasicComponent); fixture.detectChanges(); @@ -130,8 +131,8 @@ describe('collapse', () => { }); }); describe('collapse template', () => { - let fixture; - let panels; + let fixture: ComponentFixture; + let panels: DebugElement[]; beforeEach(() => { fixture = TestBed.createComponent(NzTestCollapseTemplateComponent); fixture.detectChanges(); @@ -142,9 +143,10 @@ describe('collapse', () => { expect(panels[ 0 ].nativeElement.querySelector('.ant-collapse-header').innerText).toBe('template'); }); }); + describe('collapse icon', () => { - let fixture; - let panels; + let fixture: ComponentFixture; + let panels: DebugElement[]; beforeEach(() => { fixture = TestBed.createComponent(NzTestCollapseIconComponent); fixture.detectChanges(); @@ -164,7 +166,8 @@ describe('collapse', () => { template: ` template - +

Panel01

 diff --git a/components/core/overlay/overlay-position.ts b/components/core/overlay/overlay-position.ts index 54aa55c679f..20102861b21 100644 --- a/components/core/overlay/overlay-position.ts +++ b/components/core/overlay/overlay-position.ts @@ -71,6 +71,7 @@ export const DEFAULT_MENTION_POSITIONS = [ POSITION_MAP.bottomLeft, new Connecti export function getPlacementName(position: ConnectedOverlayPositionChange): string | undefined { const keyList = [ 'originX', 'originY', 'overlayX', 'overlayY' ]; for (const placement in POSITION_MAP) { + // @ts-ignore if (keyList.every(key => position.connectionPair[ key ] === POSITION_MAP[ placement ][ key ])) { return placement; } diff --git a/components/core/polyfill/request-animation.ts b/components/core/polyfill/request-animation.ts index 5325139566f..db902f650e0 100644 --- a/components/core/polyfill/request-animation.ts +++ b/components/core/polyfill/request-animation.ts @@ -26,6 +26,7 @@ function getRequestAnimationFrame(): typeof requestAnimationFrame { const prefix = availablePrefixs.filter(key => `${key}RequestAnimationFrame` in window)[ 0 ]; return prefix + // @ts-ignore ? window[ `${prefix}RequestAnimationFrame` ] : requestAnimationFramePolyfill(); } @@ -45,6 +46,7 @@ export function cancelRequestAnimationFrame(id: number): any { ( (window as any)[ `${prefix}CancelAnimationFrame` ] || (window as any)[ `${prefix}CancelRequestAnimationFrame` ] + // @ts-ignore ).call(this, id) : clearTimeout(id); } diff --git a/components/core/scroll/nz-scroll.service.ts b/components/core/scroll/nz-scroll.service.ts index 811d1bfdc2e..3b5542f3942 100644 --- a/components/core/scroll/nz-scroll.service.ts +++ b/components/core/scroll/nz-scroll.service.ts @@ -62,6 +62,7 @@ export class NzScrollService { const prop = top ? 'pageYOffset' : 'pageXOffset'; const method = top ? 'scrollTop' : 'scrollLeft'; const isWindow = target === window; + // @ts-ignore let ret = isWindow ? target[ prop ] : target[ method ]; if (isWindow && typeof ret !== 'number') { ret = this.doc.documentElement![ method ]; diff --git a/components/core/services/nz-measure-scrollbar.service.ts b/components/core/services/nz-measure-scrollbar.service.ts index 5a725730088..f5435784cf8 100644 --- a/components/core/services/nz-measure-scrollbar.service.ts +++ b/components/core/services/nz-measure-scrollbar.service.ts @@ -1,5 +1,6 @@ import { DOCUMENT } from '@angular/common'; import { Inject, Injectable } from '@angular/core'; +import { IndexableObject } from '../types/indexable'; import { isNotNil } from '../util/check'; @Injectable({ @@ -7,7 +8,7 @@ import { isNotNil } from '../util/check'; }) export class NzMeasureScrollbarService { private _scrollbarWidth: number; - private scrollbarMeasure = { + private scrollbarMeasure: IndexableObject = { position: 'absolute', top : '-9999px', width : '50px', diff --git a/components/core/services/update-host-class.service.ts b/components/core/services/update-host-class.service.ts index 7c2e3bcf8f5..e7154a9e1a5 100644 --- a/components/core/services/update-host-class.service.ts +++ b/components/core/services/update-host-class.service.ts @@ -1,5 +1,7 @@ import { Injectable, Renderer2, RendererFactory2 } from '@angular/core'; +import { NgClassInterface } from '../types/ng-class'; + @Injectable() export class NzUpdateHostClassService { private classMap = {}; @@ -19,7 +21,7 @@ export class NzUpdateHostClassService { } } - private addClass(el: HTMLElement, classMap: object, renderer: Renderer2): void { + private addClass(el: HTMLElement, classMap: NgClassInterface, renderer: Renderer2): void { for (const i in classMap) { if (classMap.hasOwnProperty(i)) { if (classMap[ i ]) { diff --git a/components/core/testing/type-in-element.ts b/components/core/testing/type-in-element.ts index 4a16bf58896..b7b7a4a6c08 100644 --- a/components/core/testing/type-in-element.ts +++ b/components/core/testing/type-in-element.ts @@ -6,7 +6,7 @@ * found in the LICENSE file at https://angular.io/license */ -import {dispatchFakeEvent} from './dispatch-events'; +import { dispatchFakeEvent } from './dispatch-events'; /** * Focuses an input, sets its value and dispatches @@ -14,7 +14,7 @@ import {dispatchFakeEvent} from './dispatch-events'; * @param value Value to be set on the input. * @param element Element onto which to set the value. */ -export function typeInElement(value: string, element: HTMLInputElement) { +export function typeInElement(value: string, element: HTMLInputElement | HTMLTextAreaElement): void { element.focus(); element.value = value; dispatchFakeEvent(element, 'input'); diff --git a/components/core/types/indexable.ts b/components/core/types/indexable.ts new file mode 100644 index 00000000000..55c7973a644 --- /dev/null +++ b/components/core/types/indexable.ts @@ -0,0 +1,3 @@ +export interface IndexableObject { + [ key: string ]: any; // tslint:disable-line:no-any +} diff --git a/components/core/types/size.ts b/components/core/types/size.ts index 60a20d5770f..91773e59a5b 100644 --- a/components/core/types/size.ts +++ b/components/core/types/size.ts @@ -1,3 +1,7 @@ export type NzSizeLDSType = 'large' | 'default' | 'small'; export type NzSizeMDSType = 'middle' | 'default' | 'small'; export type NzSizeDSType = 'default' | 'small'; + +export interface NzSizeMap { + [ size: string ]: string; +} diff --git a/components/core/util/check.ts b/components/core/util/check.ts index 2091c0f73d0..d0deef70bd1 100644 --- a/components/core/util/check.ts +++ b/components/core/util/check.ts @@ -1,4 +1,5 @@ import { TemplateRef, Type } from '@angular/core'; +import { IndexableObject } from '../types/indexable'; // tslint:disable-next-line:no-any export function isNotNil(value: any): boolean { @@ -13,7 +14,7 @@ export function isNil(value: any): value is null | undefined { /** * Examine if two objects are shallowly equaled. */ -export function shallowEqual(objA?: {}, objB?: {}): boolean { +export function shallowEqual(objA?: IndexableObject, objB?: IndexableObject): boolean { if (objA === objB) { return true; } diff --git a/components/core/util/scroll-into-view-if-needed.ts b/components/core/util/scroll-into-view-if-needed.ts index 08494eda6c0..01798662f31 100644 --- a/components/core/util/scroll-into-view-if-needed.ts +++ b/components/core/util/scroll-into-view-if-needed.ts @@ -1,13 +1,10 @@ export function scrollIntoView(node: HTMLElement): void { - - // Non-standard - /* tslint:disable-next-line:no-string-literal */ - if (node['scrollIntoViewIfNeeded']) { + const nodeAsAny = node as any; // tslint:disable-line:no-any + if (nodeAsAny.scrollIntoViewIfNeeded) { /* tslint:disable-next-line:no-string-literal */ - node['scrollIntoViewIfNeeded'](false); + nodeAsAny.scrollIntoViewIfNeeded(false); return; } - if (node.scrollIntoView) { node.scrollIntoView(false); return; diff --git a/components/core/util/textarea-caret-position.ts b/components/core/util/textarea-caret-position.ts index 59498ab59d9..d1f8e733394 100644 --- a/components/core/util/textarea-caret-position.ts +++ b/components/core/util/textarea-caret-position.ts @@ -99,6 +99,7 @@ export function getCaretCoordinates(element: HTMLInputElement | HTMLTextAreaElem // Special case for s because text is rendered centered and line height may be != height style.lineHeight = computed.height; } else { + // @ts-ignore style[prop] = computed[prop]; } }); diff --git a/components/date-picker/abstract-picker.component.ts b/components/date-picker/abstract-picker.component.ts index 4e480380667..2cdf68b9177 100644 --- a/components/date-picker/abstract-picker.component.ts +++ b/components/date-picker/abstract-picker.component.ts @@ -105,8 +105,9 @@ export abstract class AbstractPickerComponent implements OnInit, OnChanges, OnDe onValueChange(value: CompatibleValue): void { this.nzValue = value; if (this.isRange) { - if ((this.nzValue as CandyDate[]).length) { - this.onChangeFn([ this.nzValue[ 0 ].nativeDate, this.nzValue[ 1 ].nativeDate ]); + const vAsRange = this.nzValue as CandyDate[]; + if (vAsRange.length) { + this.onChangeFn([ vAsRange[ 0 ].nativeDate, vAsRange[ 1 ].nativeDate ]); } else { this.onChangeFn([]); } diff --git a/components/date-picker/date-picker.component.spec.ts b/components/date-picker/date-picker.component.spec.ts index 3f5f6ee972d..f542c5771f7 100644 --- a/components/date-picker/date-picker.component.spec.ts +++ b/components/date-picker/date-picker.component.spec.ts @@ -10,6 +10,7 @@ import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import isSameDay from 'date-fns/is_same_day'; import { dispatchKeyboardEvent, dispatchMouseEvent } from '../core/testing'; +import { NGStyleInterface } from '../core/types/ng-class'; import en_US from '../i18n/languages/en_US'; import { NzI18nModule } from '../i18n/nz-i18n.module'; import { NzI18nService } from '../i18n/nz-i18n.service'; @@ -763,10 +764,8 @@ describe('NzDatePickerComponent', () => { [nzSize]="nzSize" [nzStyle]="nzStyle" (nzOnOpenChange)="nzOnOpenChange($event)" - [ngModel]="nzValue" (ngModelChange)="nzOnChange($event)" - [nzDateRender]="nzDateRender" [nzDisabledTime]="nzDisabledTime" [nzRenderExtraFooter]="nzRenderExtraFooter" @@ -801,17 +800,17 @@ class NzTestDatePickerComponent { @ViewChild('tplExtraFooter') tplExtraFooter: TemplateRef; // --- Suite 1 - nzAllowClear; - nzAutoFocus; - nzDisabled; - nzClassName; - nzDisabledDate; - nzLocale; - nzPlaceHolder; - nzPopupStyle; - nzDropdownClassName; - nzSize; - nzStyle; + nzAllowClear: boolean; + nzAutoFocus: boolean; + nzDisabled: boolean; + nzClassName: string; + nzDisabledDate: (d: Date) => boolean; + nzLocale: any; // tslint:disable-line:no-any + nzPlaceHolder: string; + nzPopupStyle: NGStyleInterface; + nzDropdownClassName: string; + nzSize: string; + nzStyle: NGStyleInterface; nzOnOpenChange(): void { } @@ -819,14 +818,14 @@ class NzTestDatePickerComponent { nzOnChange(): void { } - nzValue; + nzValue: Date | null; - nzDateRender; + nzDateRender: any; // tslint:disable-line:no-any nzShowTime: boolean | object = false; - nzDisabledTime; - nzRenderExtraFooter; + nzDisabledTime: any; // tslint:disable-line:no-any + nzRenderExtraFooter: string | (() => TemplateRef | string); nzShowToday = false; - nzMode; + nzMode: string; // nzRanges; nzOnPanelChange(): void { @@ -836,8 +835,8 @@ class NzTestDatePickerComponent { } // --- Suite 2 - nzOpen; + nzOpen: boolean; // --- Suite 3 - modelValue; + modelValue: Date; } diff --git a/components/date-picker/date-range-picker.component.ts b/components/date-picker/date-range-picker.component.ts index 18d733b6d43..480c7913d1a 100644 --- a/components/date-picker/date-range-picker.component.ts +++ b/components/date-picker/date-range-picker.component.ts @@ -13,7 +13,6 @@ import { DisabledTimeFn, PanelMode, PresetRanges } from './standard-types'; @Component({ template: `` // Just for rollup }) - export class DateRangePickerComponent extends AbstractPickerComponent implements OnInit, OnChanges { showWeek: boolean = false; // Should show as week picker @@ -85,8 +84,9 @@ export class DateRangePickerComponent extends AbstractPickerComponent implements // Emitted when done with date selecting onResultOk(): void { if (this.isRange) { - if ((this.nzValue as CandyDate[]).length) { - this.nzOnOk.emit([ this.nzValue![ 0 ].nativeDate, this.nzValue![ 1 ].nativeDate ]); + const value = this.nzValue as CandyDate[]; + if (value.length) { + this.nzOnOk.emit([ value[ 0 ].nativeDate, value[ 1 ].nativeDate ]); } else { this.nzOnOk.emit([]); } diff --git a/components/date-picker/lib/candy-date/candy-date.ts b/components/date-picker/lib/candy-date/candy-date.ts index 59b78facd5f..26b313ccd9c 100644 --- a/components/date-picker/lib/candy-date/candy-date.ts +++ b/components/date-picker/lib/candy-date/candy-date.ts @@ -3,6 +3,7 @@ import addYears from 'date-fns/add_years'; import endOfMonth from 'date-fns/end_of_month'; import setDay from 'date-fns/set_day'; import setMonth from 'date-fns/set_month'; +import { IndexableObject } from '../../../core/types/indexable'; /** * Wrapping kind APIs for date operating and unify @@ -10,7 +11,7 @@ import setMonth from 'date-fns/set_month'; * NOTE: most APIs are based on local time other than customized locale id (this needs tobe support in future) * TODO: support format() against to angular's core API */ -export class CandyDate { +export class CandyDate implements IndexableObject { nativeDate: Date; // locale: string; // Custom specified locale ID diff --git a/components/date-picker/lib/lib-packer-supplements.spec.ts b/components/date-picker/lib/lib-packer-supplements.spec.ts index d73361430a9..c6768ba1c46 100644 --- a/components/date-picker/lib/lib-packer-supplements.spec.ts +++ b/components/date-picker/lib/lib-packer-supplements.spec.ts @@ -30,7 +30,7 @@ describe('Coverage supplements', () => { TestBed.compileComponents(); })); - beforeEach(inject([ NzI18nService, DateHelperService ], (i18nService, dateHelperService) => { + beforeEach(inject([ NzI18nService, DateHelperService ], (i18nService: NzI18nService, dateHelperService: DateHelperService) => { dateHelper = dateHelperService; i18n = i18nService; })); diff --git a/components/date-picker/lib/popups/date-range-popup.component.ts b/components/date-picker/lib/popups/date-range-popup.component.ts index bfe4b70d173..07bca61da57 100644 --- a/components/date-picker/lib/popups/date-range-popup.component.ts +++ b/components/date-picker/lib/popups/date-range-popup.component.ts @@ -1,4 +1,15 @@ -import { ChangeDetectionStrategy, Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, TemplateRef, ViewEncapsulation } from '@angular/core'; +import { + ChangeDetectionStrategy, + Component, + EventEmitter, + Input, + OnChanges, + OnInit, + Output, + SimpleChanges, + TemplateRef, + ViewEncapsulation +} from '@angular/core'; import { FunctionProp } from '../../../core/types/common-wrap'; import { NzCalendarI18nInterface } from '../../../i18n/nz-i18n.interface'; @@ -18,7 +29,7 @@ import { getTimeConfig, isAllowedDate } from '../util'; encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, // tslint:disable-next-line:component-selector - selector : 'date-range-popup', + selector: 'date-range-popup', templateUrl: 'date-range-popup.component.html' }) @@ -34,7 +45,7 @@ export class DateRangePopupComponent implements OnInit, OnChanges { @Input() showToday: boolean; @Input() showTime: SupportTimeOptions | boolean; @Input() extraFooter: TemplateRef | string; - @Input() ranges: FunctionProp; + @Input() ranges: PresetRanges; @Input() dateRender: FunctionProp | string>; @Input() popupStyle: object; @Input() dropdownClassName: string; @@ -63,7 +74,9 @@ export class DateRangePopupComponent implements OnInit, OnChanges { return this.showToday || this.hasTimePicker || !!this.extraFooter || !!this.ranges; } - private partTypeMap: { [ key: string]: number } = { 'left': 0, 'right': 1 }; + private partTypeMap: { [ key: string ]: number } = { 'left': 0, 'right': 1 }; + + [ property: string ]: any // tslint:disable-line:no-any ngOnInit(): void { // Initialization for range properties to prevent errors while later assignment @@ -206,7 +219,7 @@ export class DateRangePopupComponent implements OnInit, OnChanges { // Get single value or part value of a range getValue(partType?: RangePartType): CandyDate { if (this.isRange) { - return this.value![ this.getPartTypeIndex(partType) ]; + return (this.value as CandyDate[])[ this.getPartTypeIndex(partType) ]; } else { return this.value as CandyDate; } @@ -215,7 +228,7 @@ export class DateRangePopupComponent implements OnInit, OnChanges { getValueBySelector(partType?: RangePartType): CandyDate { if (this.isRange) { const valueShow = this.showTimePicker ? this.value : this.valueForRangeShow; // Use the real time value that without decorations when timepicker is shown up - return valueShow![ this.getPartTypeIndex(partType) ]; + return (valueShow as CandyDate[])[ this.getPartTypeIndex(partType) ]; } else { return this.value as CandyDate; } @@ -276,7 +289,9 @@ export class DateRangePopupComponent implements OnInit, OnChanges { getTimeOptions(partType?: RangePartType): SupportTimeOptions | null { if (this.showTime && this.timeOptions) { - return this.isRange ? this.timeOptions[ this.getPartTypeIndex(partType) ] : this.timeOptions; + return this.timeOptions instanceof Array + ? this.timeOptions[ this.getPartTypeIndex(partType) ] + : this.timeOptions; } return null; } @@ -311,10 +326,11 @@ export class DateRangePopupComponent implements OnInit, OnChanges { if (this.showTime) { const showTime = typeof this.showTime === 'object' ? this.showTime : {}; if (this.isRange) { + const value = this.value as CandyDate[]; this.timeOptions = [ - this.overrideTimeOptions(showTime, this.value![ 0 ], 'start'), - this.overrideTimeOptions(showTime, this.value![ 1 ], 'end') - ]; + this.overrideTimeOptions(showTime, value[ 0 ], 'start'), + this.overrideTimeOptions(showTime, value[ 1 ], 'end') + ]; } else { this.timeOptions = this.overrideTimeOptions(showTime, this.value as CandyDate); } diff --git a/components/date-picker/month-picker.component.spec.ts b/components/date-picker/month-picker.component.spec.ts index 3ef36d9f649..d285fda1b31 100644 --- a/components/date-picker/month-picker.component.spec.ts +++ b/components/date-picker/month-picker.component.spec.ts @@ -9,6 +9,7 @@ import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import isBefore from 'date-fns/is_before'; import { dispatchMouseEvent } from '../core/testing'; +import { NGStyleInterface } from '../core/types/ng-class'; import { NzInputModule } from '../input/nz-input.module'; import { NzDatePickerModule } from './date-picker.module'; @@ -467,17 +468,17 @@ class NzTestMonthPickerComponent { @ViewChild('tplExtraFooter') tplExtraFooter: TemplateRef; // --- Suite 1 - nzAllowClear; - nzAutoFocus; - nzDisabled; - nzClassName; - nzDisabledDate; - nzLocale; - nzPlaceHolder; - nzPopupStyle; - nzDropdownClassName; - nzSize; - nzStyle; + nzAllowClear: boolean; + nzAutoFocus: boolean; + nzDisabled: boolean; + nzClassName: string; + nzDisabledDate: (d: Date) => boolean; + nzLocale: any; // tslint:disable-line:no-any + nzPlaceHolder: string; + nzPopupStyle: NGStyleInterface; + nzDropdownClassName: string; + nzSize: string; + nzStyle: NGStyleInterface; nzOnOpenChange(): void { } @@ -485,13 +486,13 @@ class NzTestMonthPickerComponent { nzOnChange(): void { } - nzValue; + nzValue: Date | null; - nzRenderExtraFooter; + nzRenderExtraFooter: string | (() => TemplateRef | string); // --- Suite 2 - nzOpen; + nzOpen: boolean; // --- Suite 3 - modelValue; + modelValue: Date; } diff --git a/components/date-picker/picker.component.ts b/components/date-picker/picker.component.ts index 95e62bb6f3b..e16d43ed64d 100644 --- a/components/date-picker/picker.component.ts +++ b/components/date-picker/picker.component.ts @@ -166,7 +166,7 @@ export class NzPickerComponent implements OnInit, AfterViewInit { getReadableValue(partType?: RangePartType): string | null { let value: CandyDate; if (this.isRange) { - value = this.value![ this.getPartTypeIndex(partType as RangePartType) ]; + value = (this.value as CandyDate[])[ this.getPartTypeIndex(partType as RangePartType) ]; } else { value = this.value as CandyDate; } diff --git a/components/date-picker/range-picker.component.spec.ts b/components/date-picker/range-picker.component.spec.ts index 67b4620c4aa..e1a6d148564 100644 --- a/components/date-picker/range-picker.component.spec.ts +++ b/components/date-picker/range-picker.component.spec.ts @@ -10,6 +10,7 @@ import differenceInDays from 'date-fns/difference_in_days'; import isSameDay from 'date-fns/is_same_day'; import { dispatchMouseEvent } from '../core/testing'; +import { NGStyleInterface } from '../core/types/ng-class'; import { NzDatePickerModule } from './date-picker.module'; import { CandyDate } from './lib/candy-date'; @@ -548,8 +549,8 @@ describe('NzRangePickerComponent', () => { const rightText = right.textContent!.trim(); dispatchMouseEvent(right, 'click'); fixture.detectChanges(); - expect(fixtureInstance.modelValue[0].getDate()).toBe(+leftText); - expect(fixtureInstance.modelValue[1].getDate()).toBe(+rightText); + expect(fixtureInstance.modelValue[0]!.getDate()).toBe(+leftText); + expect(fixtureInstance.modelValue[1]!.getDate()).toBe(+rightText); })); }); @@ -648,31 +649,32 @@ class NzTestRangePickerComponent { @ViewChild('tplExtraFooter') tplExtraFooter: TemplateRef; // --- Suite 1 - nzAllowClear; - nzAutoFocus; - nzDisabled; - nzClassName; - nzDisabledDate; - nzLocale; - nzPlaceHolder; - nzPopupStyle; - nzDropdownClassName; - nzSize; - nzStyle; + nzAllowClear: boolean; + nzAutoFocus: boolean; + nzDisabled: boolean; + nzClassName: string; + nzDisabledDate: (d: Date) => boolean; + nzLocale: any; // tslint:disable-line:no-any + nzPlaceHolder: string[]; + nzPopupStyle: NGStyleInterface; + nzDropdownClassName: string; + nzSize: string; + nzStyle: NGStyleInterface; nzOnOpenChange(): void { } - modelValue; + modelValue: Array; modelValueChange(): void { } - nzDateRender; + nzDateRender: any; // tslint:disable-line:no-any nzShowTime: boolean | object = false; - nzDisabledTime; - nzRenderExtraFooter; + nzDisabledTime: any; // tslint:disable-line:no-any + nzRenderExtraFooter: string | (() => TemplateRef | string); nzShowToday = false; - nzMode; - nzRanges; + nzMode: string[]; + + nzRanges: any; // tslint:disable-line:no-any nzOnPanelChange(): void {} nzOnOk(): void {} // --- Suite 2 - nzOpen; + nzOpen: boolean; } diff --git a/components/date-picker/week-picker.component.spec.ts b/components/date-picker/week-picker.component.spec.ts index fcc1ceb04a9..911bce2e00e 100644 --- a/components/date-picker/week-picker.component.spec.ts +++ b/components/date-picker/week-picker.component.spec.ts @@ -38,7 +38,7 @@ describe('NzWeekPickerComponent', () => { overlayContainer.ngOnDestroy(); }); it('should show week num', fakeAsync(() => { - fixtureInstance.nzFormat = null; // cover branch + fixtureInstance.nzFormat = undefined; // cover branch fixture.detectChanges(); tick(500); fixture.detectChanges(); @@ -71,5 +71,5 @@ describe('NzWeekPickerComponent', () => { ` }) export class NzTestWeekPickerComponent { - nzFormat; + nzFormat?: string; } diff --git a/components/date-picker/year-picker.component.spec.ts b/components/date-picker/year-picker.component.spec.ts index 219ef9764e4..428340ef61e 100644 --- a/components/date-picker/year-picker.component.spec.ts +++ b/components/date-picker/year-picker.component.spec.ts @@ -6,6 +6,7 @@ import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { dispatchMouseEvent } from '../core/testing'; +import { NGStyleInterface } from '../core/types/ng-class'; import { NzInputModule } from '../input/nz-input.module'; import { NzDatePickerModule } from './date-picker.module'; @@ -425,17 +426,17 @@ class NzTestYearPickerComponent { @ViewChild('tplExtraFooter') tplExtraFooter: TemplateRef; // --- Suite 1 - nzAllowClear; - nzAutoFocus; - nzDisabled; - nzDisabledDate; - nzClassName; - nzLocale; - nzPlaceHolder; - nzPopupStyle; - nzDropdownClassName; - nzSize; - nzStyle; + nzAllowClear: boolean; + nzAutoFocus: boolean; + nzDisabled: boolean; + nzClassName: string; + nzDisabledDate: (d: Date) => boolean; + nzLocale: any; // tslint:disable-line:no-any + nzPlaceHolder: string; + nzPopupStyle: NGStyleInterface; + nzDropdownClassName: string; + nzSize: string; + nzStyle: NGStyleInterface; nzOnOpenChange(): void { } @@ -443,13 +444,13 @@ class NzTestYearPickerComponent { nzOnChange(): void { } - nzValue; + nzValue: Date | null; - nzRenderExtraFooter; + nzRenderExtraFooter: string | (() => TemplateRef | string); // --- Suite 2 - nzOpen; + nzOpen: boolean; // --- Suite 3 - modelValue; + modelValue: Date; } diff --git a/components/drawer/demo/service.ts b/components/drawer/demo/service.ts index 94a6b7c08ed..3a54f3e86f4 100644 --- a/components/drawer/demo/service.ts +++ b/components/drawer/demo/service.ts @@ -1,6 +1,6 @@ /* entryComponents: NzDrawerCustomComponent */ -import { Component, Input, ViewChild } from '@angular/core'; +import { Component, Input, TemplateRef, ViewChild } from '@angular/core'; import { NzDrawerRef, NzDrawerService } from 'ng-zorro-antd'; @Component({ @@ -22,8 +22,7 @@ import { NzDrawerRef, NzDrawerService } from 'ng-zorro-antd'; }) export class NzDemoDrawerServiceComponent { - - @ViewChild('drawerTemplate') drawerTemplate; + @ViewChild('drawerTemplate') drawerTemplate: TemplateRef<{ $implicit: { value: string; }; drawerRef: NzDrawerRef; }> ; value = 'ng'; constructor( diff --git a/components/drawer/nz-drawer.spec.ts b/components/drawer/nz-drawer.spec.ts index f0137a43997..af33ab27e74 100644 --- a/components/drawer/nz-drawer.spec.ts +++ b/components/drawer/nz-drawer.spec.ts @@ -438,15 +438,12 @@ class NzTestDrawerComponent { ` }) class NzTestDrawerWithServiceComponent { - @ViewChild('drawerTemplate') drawerTemplate; + @ViewChild('drawerTemplate') drawerTemplate: TemplateRef<{ $implicit: number, drawerRef: NzDrawerRef}>; templateOpenSpy = jasmine.createSpy('template afterOpen spy'); templateCloseSpy = jasmine.createSpy('template afterClose spy'); templateDrawerRef: NzDrawerRef; - constructor( - private drawerService: NzDrawerService - ) { - } + constructor(private drawerService: NzDrawerService) {} openTemplate(): void { this.templateDrawerRef = this.drawerService.create({ @@ -457,7 +454,6 @@ class NzTestDrawerWithServiceComponent { this.templateDrawerRef.afterOpen.subscribe(this.templateOpenSpy); this.templateDrawerRef.afterClose.subscribe(this.templateCloseSpy); } - } @Component({ @@ -470,12 +466,9 @@ class NzTestDrawerWithServiceComponent { ` }) export class NzDrawerCustomComponent { + @Input() value: any; // tslint:disable-line:no-any - @Input() value; - constructor( - private drawerRef: NzDrawerRef - ) { - } + constructor(private drawerRef: NzDrawerRef) {} close(): void { this.drawerRef.close(this.value); diff --git a/components/dropdown/nz-dropdown.spec.ts b/components/dropdown/nz-dropdown.spec.ts index c4c31ba9ea6..542810fb600 100644 --- a/components/dropdown/nz-dropdown.spec.ts +++ b/components/dropdown/nz-dropdown.spec.ts @@ -1,8 +1,8 @@ import { Directionality } from '@angular/cdk/bidi'; import { OverlayContainer } from '@angular/cdk/overlay'; import { ScrollDispatcher } from '@angular/cdk/scrolling'; -import { Component, TemplateRef, ViewChild } from '@angular/core'; -import { async, fakeAsync, flush, inject, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, TemplateRef, ViewChild } from '@angular/core'; +import { async, fakeAsync, flush, inject, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { Subject } from 'rxjs'; @@ -47,14 +47,16 @@ describe('dropdown', () => { overlayContainer.ngOnDestroy(); })); describe('nz-dropdown-directive', () => { - let fixture; - let testComponent; - let link; + let fixture: ComponentFixture; + let testComponent: NzTestDropdownComponent; + let link: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestDropdownComponent); testComponent = fixture.debugElement.componentInstance; link = fixture.debugElement.query(By.directive(NzDropDownDirective)); }); + it('should mouseenter event trigger', fakeAsync(() => { const mouseenterCallback = jasmine.createSpy('mouseenter callback'); testComponent.nzDropDownDirective.hover$.subscribe(mouseenterCallback); @@ -62,6 +64,7 @@ describe('dropdown', () => { fixture.detectChanges(); expect(mouseenterCallback).toHaveBeenCalledTimes(1); })); + it('should mouseleave event trigger', fakeAsync(() => { const mouseleaveCallback = jasmine.createSpy('mouseleave callback'); testComponent.nzDropDownDirective.hover$.subscribe(mouseleaveCallback); @@ -69,6 +72,7 @@ describe('dropdown', () => { fixture.detectChanges(); expect(mouseleaveCallback).toHaveBeenCalledTimes(1); })); + it('should click event trigger', fakeAsync(() => { const clickCallback = jasmine.createSpy('click callback'); testComponent.nzDropDownDirective.$click.subscribe(clickCallback); @@ -76,10 +80,12 @@ describe('dropdown', () => { fixture.detectChanges(); expect(clickCallback).toHaveBeenCalledTimes(1); })); + it('should className add in a', () => { fixture.detectChanges(); expect(link.nativeElement.classList.contains('ant-dropdown-link')).toBe(true); }); + it('should className not add in button', () => { const buttonFixture = TestBed.createComponent(NzTestDropdownWithButtonComponent); buttonFixture.detectChanges(); @@ -87,9 +93,10 @@ describe('dropdown', () => { }); }); describe('nz-dropdown-component', () => { - let fixture; - let testComponent; - let link; + let fixture: ComponentFixture; + let testComponent: NzTestDropdownComponent; + let link: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestDropdownComponent); testComponent = fixture.debugElement.componentInstance; @@ -203,6 +210,7 @@ describe('dropdown', () => { testComponent.visible = false; fixture.detectChanges(); expect(testComponent.visibleChange).toHaveBeenCalledTimes(0); + // @ts-ignore testComponent.nzDropDownComponent.nzMenuDropdownService.menuOpen$.next(true); fixture.detectChanges(); tick(100); @@ -219,6 +227,7 @@ describe('dropdown', () => { const submenu = testComponent.nzSubMenuComponent; submenu.nzOpen = true; submenu.nzSubmenuService.open$.next(false); + // @ts-ignore testComponent.nzDropDownComponent.nzMenuDropdownService.menuOpen$.subscribe(nestedCallback); fixture.detectChanges(); expect(nestedCallback).toHaveBeenCalledWith(false); @@ -235,9 +244,10 @@ describe('dropdown', () => { }); }); describe('nz-dropdown-component-button', () => { - let fixture; - let testComponent; - let button; + let fixture: ComponentFixture; + let testComponent: NzTestDropdownButtonComponent; + let button: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestDropdownButtonComponent); testComponent = fixture.debugElement.componentInstance; @@ -274,6 +284,7 @@ describe('dropdown', () => { fixture.detectChanges(); expect(testComponent.click).toHaveBeenCalledTimes(0); expect(clickCallback).toHaveBeenCalledTimes(0); + // @ts-ignore testComponent.nzDropDownButtonComponent.nzMenuDropdownService.menuOpen$.next(true); fixture.detectChanges(); expect(testComponent.visibleChange).toHaveBeenCalledTimes(0); @@ -286,6 +297,7 @@ describe('dropdown', () => { testComponent.visible = false; fixture.detectChanges(); expect(testComponent.visibleChange).toHaveBeenCalledTimes(0); + // @ts-ignore testComponent.nzDropDownButtonComponent.nzMenuDropdownService.menuOpen$.next(true); fixture.detectChanges(); tick(100); @@ -310,6 +322,7 @@ describe('dropdown', () => { const submenu = testComponent.nzSubMenuComponent; submenu.nzOpen = true; submenu.nzSubmenuService.open$.next(false); + // @ts-ignore testComponent.nzDropDownButtonComponent.nzMenuDropdownService.menuOpen$.subscribe(nestedCallback); fixture.detectChanges(); expect(nestedCallback).toHaveBeenCalledWith(false); @@ -317,8 +330,8 @@ describe('dropdown', () => { }); }); describe('nz-dropdown-service', () => { - let fixture; - let testComponent; + let fixture: ComponentFixture; + let testComponent: NzTestDropdownContextmenuComponent; beforeEach(() => { fixture = TestBed.createComponent(NzTestDropdownContextmenuComponent); testComponent = fixture.debugElement.componentInstance; @@ -385,6 +398,7 @@ describe('dropdown', () => { fixture.detectChanges(); tick(1000); fixture.detectChanges(); + // @ts-ignore const overlayElement = testComponent.nzDropdownService.overlayRef.overlayElement; expect(overlayElement.textContent).not.toBe(''); })); @@ -394,8 +408,9 @@ describe('dropdown', () => { @Component({ selector: 'nz-test-dropdown', template: ` - + Hover me @@ -436,7 +451,8 @@ export class NzTestDropdownComponent { @Component({ selector: 'nz-test-dropdown-button', template: ` - + DropDown
  • 1st menu item
    • diff --git a/components/empty/nz-embed-empty.component.ts b/components/empty/nz-embed-empty.component.ts index 1392c8da97f..c91e6e67243 100644 --- a/components/empty/nz-embed-empty.component.ts +++ b/components/empty/nz-embed-empty.component.ts @@ -1,4 +1,4 @@ -import { ComponentPortal, PortalInjector, TemplatePortal } from '@angular/cdk/portal'; +import { ComponentPortal, Portal, PortalInjector, TemplatePortal } from '@angular/cdk/portal'; import { ChangeDetectionStrategy, ChangeDetectorRef, @@ -29,9 +29,9 @@ export class NzEmbedEmptyComponent implements OnChanges, OnInit, OnDestroy { @Input() nzComponentName: string; @Input() specificContent: NzEmptyCustomContent; - content; + content?: NzEmptyCustomContent; contentType: 'component' | 'template' | 'string' = 'string'; - contentPortal; + contentPortal?: Portal; // tslint:disable-line:no-any defaultSvg = this.sanitizer.bypassSecurityTrustResourceUrl(simpleEmptyImage); size: NzEmptySize = ''; subs_ = new Subscription(); diff --git a/components/empty/nz-empty.component.ts b/components/empty/nz-empty.component.ts index d15eb43e910..dfc6242bc8e 100644 --- a/components/empty/nz-empty.component.ts +++ b/components/empty/nz-empty.component.ts @@ -37,7 +37,7 @@ export class NzEmptyComponent implements OnChanges, OnInit, OnDestroy { defaultSvg = this.sanitizer.bypassSecurityTrustResourceUrl(emptyImage); isContentString = false; - locale = {}; + locale: { [ key: string ]: string } = {}; get shouldRenderContent(): boolean { const content = this.nzNotFoundContent; diff --git a/components/empty/nz-empty.spec.ts b/components/empty/nz-empty.spec.ts index 7701a8eb69d..5750d2e1def 100644 --- a/components/empty/nz-empty.spec.ts +++ b/components/empty/nz-empty.spec.ts @@ -1,6 +1,6 @@ import { CommonModule } from '@angular/common'; -import { Component, Inject, NgModule, TemplateRef, ViewChild } from '@angular/core'; -import { fakeAsync, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, Inject, NgModule, TemplateRef, ViewChild } from '@angular/core'; +import { fakeAsync, tick, ComponentFixture, TestBed, TestBedStatic } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzI18nService } from '../i18n'; @@ -14,13 +14,12 @@ import { NzEmptyModule } from './nz-empty.module'; import { NzEmptyService } from './nz-empty.service'; describe('nz-empty', () => { - let fixture; - let testBed; - let testComponent; - let emptyComponent; - let embedComponent; - describe('basic', () => { + let testBed: TestBedStatic; + let fixture: ComponentFixture; + let testComponent: NzEmptyTestBasicComponent; + let emptyComponent: DebugElement; + beforeEach(() => { testBed = TestBed.configureTestingModule({ imports : [ CommonModule, NzEmptyModule ], @@ -126,6 +125,11 @@ describe('nz-empty', () => { * Config default empty content via `NzEmptyService`'s `setDefaultEmptyContent` method. */ describe('embed', () => { + let fixture: ComponentFixture; + let testComponent: NzEmptyTestServiceComponent; + let embedComponent: DebugElement; + let emptyComponent: DebugElement; + describe('service method', () => { beforeEach(() => { TestBed.configureTestingModule({ @@ -302,9 +306,9 @@ export class NzEmptyTestBasicComponent { @ViewChild('contentTpl') contentTpl: TemplateRef; @ViewChild('footerTpl') footerTpl: TemplateRef; - image = undefined; - content = undefined; - footer = undefined; + image?: TemplateRef | string; + content?: TemplateRef | string; + footer?: TemplateRef | string; } @Component({ @@ -319,7 +323,7 @@ export class NzEmptyTestBasicComponent { export class NzEmptyTestServiceComponent { @ViewChild('tpl') template: TemplateRef; - noResult = undefined; + noResult?: string | null; constructor(public emptyService: NzEmptyService) { } diff --git a/components/form/demo/validate-reactive.ts b/components/form/demo/validate-reactive.ts index efe52cbdfc4..ef3fbafdbe5 100644 --- a/components/form/demo/validate-reactive.ts +++ b/components/form/demo/validate-reactive.ts @@ -12,7 +12,7 @@ import { Observable, Observer } from 'rxjs'; @Component({ selector: 'nz-demo-form-validate-reactive', template: ` -
    + Username @@ -96,7 +96,7 @@ import { Observable, Observer } from 'rxjs'; }) export class NzDemoFormValidateReactiveComponent { validateForm: FormGroup; - submitForm = ($event, value) => { + submitForm = ($event: any, value: any) => { $event.preventDefault(); for (const key in this.validateForm.controls) { this.validateForm.controls[ key ].markAsDirty(); diff --git a/components/form/nz-form-control.spec.ts b/components/form/nz-form-control.spec.ts index fbc0a394374..0efea7f678a 100644 --- a/components/form/nz-form-control.spec.ts +++ b/components/form/nz-form-control.spec.ts @@ -1,6 +1,14 @@ -import { Component } from '@angular/core'; -import { fakeAsync, flush, tick, TestBed } from '@angular/core/testing'; -import { FormsModule, FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, flush, tick, ComponentFixture, TestBed } from '@angular/core/testing'; +import { + FormsModule, + FormBuilder, + FormControl, + FormControlName, + FormGroup, + ReactiveFormsModule, + Validators +} from '@angular/forms'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { NzFormControlComponent } from './nz-form-control.component'; @@ -15,9 +23,9 @@ describe('nz-form-control', () => { TestBed.compileComponents(); })); describe('static status', () => { - let fixture; - let testComponent; - let formControl; + let fixture: ComponentFixture; + let testComponent: NzTestStaticFormControlComponent; + let formControl: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestStaticFormControlComponent); fixture.detectChanges(); @@ -38,7 +46,7 @@ describe('nz-form-control', () => { it('should status work', () => { fixture.detectChanges(); const statusList = [ 'warning', 'validating', 'pending', 'error', 'success' ]; - const statusMap = { + const statusMap: { [ key: string ]: string } = { 'warning' : 'has-warning', 'validating': 'is-validating', 'pending' : 'is-validating', @@ -53,9 +61,9 @@ describe('nz-form-control', () => { }); }); describe('reactive status', () => { - let fixture; - let testComponent; - let formControls; + let fixture: ComponentFixture; + let testComponent: NzTestReactiveFormControlComponent; + let formControls: DebugElement[]; beforeEach(() => { fixture = TestBed.createComponent(NzTestReactiveFormControlComponent); fixture.detectChanges(); @@ -70,15 +78,15 @@ describe('nz-form-control', () => { expect(formControls[ 1 ].nativeElement.querySelector('.ant-form-item-control').className).toBe('ant-form-item-control'); })); it('should valid work', fakeAsync(() => { - testComponent.formGroup.get('input').markAsDirty(); - testComponent.formGroup.get('input2').markAsDirty(); + testComponent.formGroup.get('input')!.markAsDirty(); + testComponent.formGroup.get('input2')!.markAsDirty(); fixture.detectChanges(); flush(); fixture.detectChanges(); - testComponent.formGroup.get('input').setValue('123'); - testComponent.formGroup.get('input2').setValue('123'); - testComponent.formGroup.get('input').updateValueAndValidity(); - testComponent.formGroup.get('input2').updateValueAndValidity(); + testComponent.formGroup.get('input')!.setValue('123'); + testComponent.formGroup.get('input2')!.setValue('123'); + testComponent.formGroup.get('input')!.updateValueAndValidity(); + testComponent.formGroup.get('input2')!.updateValueAndValidity(); fixture.detectChanges(); flush(); fixture.detectChanges(); @@ -88,15 +96,15 @@ describe('nz-form-control', () => { expect(formControls[ 1 ].nativeElement.querySelector('.ant-form-item-control').classList).toContain('has-success'); })); it('should invalid work', fakeAsync(() => { - testComponent.formGroup.get('input').markAsDirty(); - testComponent.formGroup.get('input2').markAsDirty(); + testComponent.formGroup.get('input')!.markAsDirty(); + testComponent.formGroup.get('input2')!.markAsDirty(); fixture.detectChanges(); flush(); fixture.detectChanges(); - testComponent.formGroup.get('input').setValue(''); - testComponent.formGroup.get('input2').setValue(''); - testComponent.formGroup.get('input').updateValueAndValidity(); - testComponent.formGroup.get('input2').updateValueAndValidity(); + testComponent.formGroup.get('input')!.setValue(''); + testComponent.formGroup.get('input2')!.setValue(''); + testComponent.formGroup.get('input')!.updateValueAndValidity(); + testComponent.formGroup.get('input2')!.updateValueAndValidity(); fixture.detectChanges(); flush(); fixture.detectChanges(); @@ -104,25 +112,25 @@ describe('nz-form-control', () => { expect(formControls[ 1 ].nativeElement.querySelector('.ant-form-item-control').classList).toContain('has-error'); })); it('should dirty work', fakeAsync(() => { - testComponent.formGroup.get('input').markAsDirty(); - testComponent.formGroup.get('input2').markAsDirty(); + testComponent.formGroup.get('input')!.markAsDirty(); + testComponent.formGroup.get('input2')!.markAsDirty(); fixture.detectChanges(); flush(); fixture.detectChanges(); - testComponent.formGroup.get('input').updateValueAndValidity(); - testComponent.formGroup.get('input2').updateValueAndValidity(); + testComponent.formGroup.get('input')!.updateValueAndValidity(); + testComponent.formGroup.get('input2')!.updateValueAndValidity(); fixture.detectChanges(); flush(); fixture.detectChanges(); expect(formControls[ 0 ].nativeElement.querySelector('.ant-form-item-control').classList).toContain('has-error'); expect(formControls[ 1 ].nativeElement.querySelector('.ant-form-item-control').classList).toContain('has-error'); - testComponent.formGroup.get('input').markAsPristine(); - testComponent.formGroup.get('input2').markAsPristine(); + testComponent.formGroup.get('input')!.markAsPristine(); + testComponent.formGroup.get('input2')!.markAsPristine(); fixture.detectChanges(); flush(); fixture.detectChanges(); - testComponent.formGroup.get('input').updateValueAndValidity(); - testComponent.formGroup.get('input2').updateValueAndValidity(); + testComponent.formGroup.get('input')!.updateValueAndValidity(); + testComponent.formGroup.get('input2')!.updateValueAndValidity(); fixture.detectChanges(); flush(); fixture.detectChanges(); @@ -130,11 +138,11 @@ describe('nz-form-control', () => { expect(formControls[ 1 ].nativeElement.querySelector('.ant-form-item-control').classList).not.toContain('has-error'); })); it('should pending work', fakeAsync(() => { - testComponent.formGroup.get('input2').markAsDirty(); + testComponent.formGroup.get('input2')!.markAsDirty(); fixture.detectChanges(); flush(); fixture.detectChanges(); - testComponent.formGroup.get('input2').updateValueAndValidity(); + testComponent.formGroup.get('input2')!.updateValueAndValidity(); fixture.detectChanges(); flush(); fixture.detectChanges(); @@ -142,8 +150,8 @@ describe('nz-form-control', () => { })); }); describe('reactive init status', () => { - let fixture; - let formControl; + let fixture: ComponentFixture; + let formControl: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestReactiveFormControlInitStatusComponent); fixture.detectChanges(); @@ -182,7 +190,7 @@ export class NzTestStaticFormControlComponent { }) export class NzTestReactiveFormControlComponent { formGroup: FormGroup; - validateStatus; + validateStatus: string | FormControlName | FormControl; constructor(private formBuilder: FormBuilder) { this.formGroup = this.formBuilder.group({ @@ -190,7 +198,7 @@ export class NzTestReactiveFormControlComponent { input2: [ '', [ Validators.required ] ], input3: [ '', [ Validators.required ] ] }); - this.validateStatus = this.formGroup.get('input2'); + this.validateStatus = this.formGroup.get('input2') as FormControl; } } @@ -209,7 +217,7 @@ export class NzTestReactiveFormControlInitStatusComponent { constructor(private formBuilder: FormBuilder) { this.formGroup = this.formBuilder.group({ - input : [ '', [ Validators.required ] ] + input: [ '', [ Validators.required ] ] }); this.formGroup.controls.input.markAsDirty(); } diff --git a/components/form/nz-form-item.spec.ts b/components/form/nz-form-item.spec.ts index 52b9f368281..2d10d9583a6 100644 --- a/components/form/nz-form-item.spec.ts +++ b/components/form/nz-form-item.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { fakeAsync, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { NzFormExplainComponent } from './nz-form-explain.component'; @@ -15,10 +15,10 @@ describe('nz-form-item', () => { TestBed.compileComponents(); })); describe('default', () => { - let fixture; - let testComponent; - let item; - let explain; + let fixture: ComponentFixture; + let testComponent: NzTestFormItemComponent; + let item: DebugElement; + let explain: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestFormItemComponent); fixture.detectChanges(); diff --git a/components/form/nz-form-label.spec.ts b/components/form/nz-form-label.spec.ts index d6b7c0d9271..635be163b7a 100644 --- a/components/form/nz-form-label.spec.ts +++ b/components/form/nz-form-label.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { fakeAsync, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { NzFormLabelComponent } from './nz-form-label.component'; @@ -13,9 +13,9 @@ describe('nz-form-label', () => { TestBed.compileComponents(); })); describe('default', () => { - let fixture; - let testComponent; - let label; + let fixture: ComponentFixture; + let testComponent: NzTestFormLabelComponent; + let label: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestFormLabelComponent); fixture.detectChanges(); diff --git a/components/form/nz-form-split.spec.ts b/components/form/nz-form-split.spec.ts index 567fbc8b4d2..530da0d8e6d 100644 --- a/components/form/nz-form-split.spec.ts +++ b/components/form/nz-form-split.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { fakeAsync, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { NzFormSplitComponent } from './nz-form-split.component'; @@ -13,8 +13,8 @@ describe('nz-form-split', () => { TestBed.compileComponents(); })); describe('default', () => { - let fixture; - let split; + let fixture: ComponentFixture; + let split: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestFormSplitComponent); fixture.detectChanges(); diff --git a/components/form/nz-form-text.spec.ts b/components/form/nz-form-text.spec.ts index cc6c111b706..a9acf2b2d9d 100644 --- a/components/form/nz-form-text.spec.ts +++ b/components/form/nz-form-text.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { fakeAsync, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { NzFormTextComponent } from './nz-form-text.component'; @@ -13,8 +13,8 @@ describe('nz-form-text', () => { TestBed.compileComponents(); })); describe('default', () => { - let fixture; - let text; + let fixture: ComponentFixture; + let text: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestFormTextComponent); fixture.detectChanges(); diff --git a/components/form/nz-form.spec.ts b/components/form/nz-form.spec.ts index b7feefad21e..4f99cfcc30b 100644 --- a/components/form/nz-form.spec.ts +++ b/components/form/nz-form.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { fakeAsync, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { NzFormDirective } from './nz-form.directive'; @@ -13,9 +13,9 @@ describe('nz-form', () => { TestBed.compileComponents(); })); describe('default', () => { - let fixture; - let testComponent; - let form; + let fixture: ComponentFixture; + let testComponent: NzTestFormDirectiveComponent; + let form: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestFormDirectiveComponent); fixture.detectChanges(); diff --git a/components/grid/demo/flex-order.ts b/components/grid/demo/flex-order.ts index 15e2a94c9c4..766eaf8509e 100755 --- a/components/grid/demo/flex-order.ts +++ b/components/grid/demo/flex-order.ts @@ -15,7 +15,7 @@ export class NzDemoGridFlexOrderComponent implements OnInit { orderList = [ 1, 2, 3, 4 ]; ngOnInit(): void { - setTimeout(_ => { + setTimeout(() => { this.orderList = [ ...this.orderList.reverse() ]; }, 10000); } diff --git a/components/grid/nz-col.directive.ts b/components/grid/nz-col.directive.ts index fd46f5fba1a..4a35323b888 100644 --- a/components/grid/nz-col.directive.ts +++ b/components/grid/nz-col.directive.ts @@ -14,6 +14,7 @@ import { Subject } from 'rxjs'; import { startWith, takeUntil } from 'rxjs/operators'; import { NzUpdateHostClassService } from '../core/services/update-host-class.service'; +import { NgClassInterface } from '../core/types/ng-class'; import { isNotNil } from '../core/util/check'; import { NzRowDirective } from './nz-row.directive'; @@ -47,6 +48,8 @@ export class NzColDirective implements OnInit, OnChanges, AfterViewInit, OnDestr @Input() nzXl: number | EmbeddedProperty; @Input() nzXXl: number | EmbeddedProperty; + [ property: string ]: any // tslint:disable-line:no-any + /** temp solution since no method add classMap to host https://github.com/angular/angular/issues/7289*/ setClassMap(): void { const classMap = { @@ -62,7 +65,7 @@ export class NzColDirective implements OnInit, OnChanges, AfterViewInit, OnDestr generateClass(): object { const listOfSizeInputName = [ 'nzXs', 'nzSm', 'nzMd', 'nzLg', 'nzXl', 'nzXXl' ]; - const listClassMap = {}; + const listClassMap: NgClassInterface = {}; listOfSizeInputName.forEach(name => { const sizeName = name.replace('nz', '').toLowerCase(); if (isNotNil(this[ name ])) { diff --git a/components/grid/nz-grid.spec.ts b/components/grid/nz-grid.spec.ts index dd34e186611..92f404d7a30 100644 --- a/components/grid/nz-grid.spec.ts +++ b/components/grid/nz-grid.spec.ts @@ -1,5 +1,5 @@ -import { NO_ERRORS_SCHEMA } from '@angular/core'; -import { async, fakeAsync, tick, TestBed } from '@angular/core/testing'; +import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core'; +import { async, fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzDemoGridBasicComponent } from './demo/basic'; @@ -17,11 +17,11 @@ import { NzGridModule } from './nz-grid.module'; import { NzRowDirective } from './nz-row.directive'; describe('grid', () => { - let testComponent; - let fixture; describe('basic', () => { - let rows; - let cols; + let fixture: ComponentFixture; + let rows: DebugElement[]; + let cols: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzGridModule ], @@ -32,7 +32,6 @@ describe('grid', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoGridBasicComponent); - testComponent = fixture.debugElement.componentInstance; rows = fixture.debugElement.queryAll(By.directive(NzRowDirective)); cols = fixture.debugElement.queryAll(By.directive(NzColDirective)); }); @@ -52,8 +51,10 @@ describe('grid', () => { }); }); describe('flex', () => { - let rows; - let cols; + let fixture: ComponentFixture; + let rows: DebugElement[]; + let cols: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzGridModule ], @@ -64,7 +65,6 @@ describe('grid', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoGridFlexComponent); - testComponent = fixture.debugElement.componentInstance; rows = fixture.debugElement.queryAll(By.directive(NzRowDirective)); cols = fixture.debugElement.queryAll(By.directive(NzColDirective)); }); @@ -79,9 +79,12 @@ describe('grid', () => { expect(cols.every(col => col.nativeElement.classList.contains('ant-col-4'))).toBe(true); }); }); + describe('flex-align', () => { - let rows; - let cols; + let fixture: ComponentFixture; + let rows: DebugElement[]; + let cols: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzGridModule ], @@ -92,7 +95,6 @@ describe('grid', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoGridFlexAlignComponent); - testComponent = fixture.debugElement.componentInstance; rows = fixture.debugElement.queryAll(By.directive(NzRowDirective)); cols = fixture.debugElement.queryAll(By.directive(NzColDirective)); }); @@ -105,8 +107,11 @@ describe('grid', () => { expect(cols.every(col => col.nativeElement.classList.contains('ant-col-4'))).toBe(true); }); }); + describe('flex-order', () => { - let row; + let fixture: ComponentFixture; + let row: DebugElement; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzGridModule ], @@ -117,7 +122,6 @@ describe('grid', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoGridFlexOrderComponent); - testComponent = fixture.debugElement.componentInstance; row = fixture.debugElement.query(By.directive(NzRowDirective)); }); @@ -141,8 +145,10 @@ describe('grid', () => { }); describe('gutter', () => { - let rows; - let cols; + let fixture: ComponentFixture; + let rows: DebugElement[]; + let cols: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzGridModule ], @@ -153,16 +159,17 @@ describe('grid', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoGridGutterComponent); - testComponent = fixture.debugElement.componentInstance; rows = fixture.debugElement.queryAll(By.directive(NzRowDirective)); cols = fixture.debugElement.queryAll(By.directive(NzColDirective)); }); + it('should number work', () => { fixture.detectChanges(); expect(rows[ 0 ].nativeElement.style.cssText).toBe('margin-left: -8px; margin-right: -8px;'); expect(cols.slice(0, 4).every(col => col.nativeElement.style.cssText === 'padding-left: 8px; padding-right: 8px;')).toBe(true); expect(cols.slice(0, 4).every(col => col.nativeElement.classList.contains('gutter-row'))).toBe(true); }); + it('should responsive work', () => { // TODO: fake media query fixture.detectChanges(); @@ -176,9 +183,11 @@ describe('grid', () => { expect(cols.slice(4, 8).every(col => col.nativeElement.classList.contains('gutter-row'))).toBe(true); }); }); + describe('offset', () => { - let rows; - let cols; + let fixture: ComponentFixture; + let rows: DebugElement[]; + let cols: DebugElement[]; beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzGridModule ], @@ -189,7 +198,6 @@ describe('grid', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoGridOffsetComponent); - testComponent = fixture.debugElement.componentInstance; rows = fixture.debugElement.queryAll(By.directive(NzRowDirective)); cols = fixture.debugElement.queryAll(By.directive(NzColDirective)); }); @@ -205,7 +213,9 @@ describe('grid', () => { }); describe('responsive', () => { - let cols; + let fixture: ComponentFixture; + let cols: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzGridModule ], @@ -216,9 +226,9 @@ describe('grid', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoGridResponsiveComponent); - testComponent = fixture.debugElement.componentInstance; cols = fixture.debugElement.queryAll(By.directive(NzColDirective)); }); + it('should have correct style', () => { fixture.detectChanges(); expect(cols[ 0 ].nativeElement.className).toBe('ant-col-xs-2 ant-col-sm-4 ant-col-md-6 ant-col-lg-8 ant-col-xl-10'); @@ -228,7 +238,9 @@ describe('grid', () => { }); describe('responsive-more', () => { - let cols; + let fixture: ComponentFixture; + let cols: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzGridModule ], @@ -239,7 +251,6 @@ describe('grid', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoGridResponsiveMoreComponent); - testComponent = fixture.debugElement.componentInstance; cols = fixture.debugElement.queryAll(By.directive(NzColDirective)); }); it('should have correct style', () => { @@ -251,7 +262,9 @@ describe('grid', () => { }); describe('sort', () => { - let cols; + let fixture: ComponentFixture; + let cols: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzGridModule ], @@ -262,9 +275,9 @@ describe('grid', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoGridSortComponent); - testComponent = fixture.debugElement.componentInstance; cols = fixture.debugElement.queryAll(By.directive(NzColDirective)); }); + it('should have correct style', () => { fixture.detectChanges(); expect(cols[ 0 ].nativeElement.className).toBe('ant-col-18 ant-col-push-6'); @@ -273,6 +286,9 @@ describe('grid', () => { }); describe('playground', () => { + let fixture: ComponentFixture; + let testComponent: NzDemoGridPlaygroundComponent; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzGridModule ], @@ -286,6 +302,7 @@ describe('grid', () => { fixture = TestBed.createComponent(NzDemoGridPlaygroundComponent); testComponent = fixture.debugElement.componentInstance; }); + it('should update gutter and count correctly', () => { fixture.detectChanges(); const row = fixture.debugElement.query(By.directive(NzRowDirective)); diff --git a/components/grid/nz-row.directive.ts b/components/grid/nz-row.directive.ts index ac9aada8af3..f96e39fb5e4 100644 --- a/components/grid/nz-row.directive.ts +++ b/components/grid/nz-row.directive.ts @@ -16,6 +16,7 @@ import { Platform } from '@angular/cdk/platform'; import { fromEvent, Subject } from 'rxjs'; import { auditTime, takeUntil } from 'rxjs/operators'; import { NzUpdateHostClassService } from '../core/services/update-host-class.service'; +import { IndexableObject } from '../core/types/indexable'; export type NzJustify = 'start' | 'end' | 'center' | 'space-around' | 'space-between'; export type NzAlign = 'top' | 'middle' | 'bottom'; @@ -49,7 +50,7 @@ export class NzRowDirective implements OnInit, OnChanges, AfterViewInit, OnDestr @Input() nzType: NzType; @Input() nzAlign: NzAlign = 'top'; @Input() nzJustify: NzJustify = 'start'; - @Input() nzGutter: number | object; + @Input() nzGutter: number | IndexableObject; private el: HTMLElement = this.elementRef.nativeElement; private prefixCls = 'ant-row'; private breakPoint: Breakpoint; diff --git a/components/i18n/nz-i18n.service.ts b/components/i18n/nz-i18n.service.ts index d7a04e8f1fd..f6d7ed41933 100644 --- a/components/i18n/nz-i18n.service.ts +++ b/components/i18n/nz-i18n.service.ts @@ -1,5 +1,6 @@ import { Inject, Injectable } from '@angular/core'; import { BehaviorSubject, Observable } from 'rxjs'; +import { IndexableObject } from '../core/types/indexable'; import zh_CN from './languages/zh_CN'; import { DateLocale, NzI18nInterface } from './nz-i18n.interface'; @@ -79,7 +80,7 @@ export class NzI18nService { return result || defaultValue; } - private _getObjectPath(obj: object, path: string): string | object | any { // tslint:disable-line:no-any + private _getObjectPath(obj: IndexableObject, path: string): string | object | any { // tslint:disable-line:no-any let res = obj; const paths = path.split('.'); const depth = paths.length; diff --git a/components/icon/page/index.ts b/components/icon/page/index.ts index 95b3c7c2ae4..0da3abd5839 100644 --- a/components/icon/page/index.ts +++ b/components/icon/page/index.ts @@ -4,7 +4,7 @@ import { manifest } from '@ant-design/icons-angular'; import { AccountBookFill } from '@ant-design/icons-angular/icons'; import { NzIconService } from 'ng-zorro-antd'; -const categories = { +const categories: { [ key: string ]: string[] } = { direction: [ 'step-backward', 'step-forward', @@ -431,13 +431,13 @@ export class NzPageDemoIconComponent implements OnInit { displayedNames = {}; categoryNames: string[] = []; currentTheme = 'outline'; - localeObj = locale; + localeObj: { [ key: string ]: string } = locale; trackByFn = (_index: number, item: string) => { return `${item}-${this.currentTheme}`; } - isNewIcon = (name) => { + isNewIcon = (name: string) => { return newIconNames.indexOf(name) > -1; } @@ -482,6 +482,7 @@ export class NzPageDemoIconComponent implements OnInit { const names = Object.keys(categories) .map(category => ({ name : category, + // @ts-ignore icons: categories[ category ].filter(name => manifest[ value ].indexOf(name) > -1) })) .filter(({ icons }) => Boolean(icons.length)); diff --git a/components/input-number/demo/formatter.ts b/components/input-number/demo/formatter.ts index 9713260ab06..e286a1188e7 100644 --- a/components/input-number/demo/formatter.ts +++ b/components/input-number/demo/formatter.ts @@ -16,8 +16,8 @@ import { Component } from '@angular/core'; }) export class NzDemoInputNumberFormatterComponent { demoValue = 100; - formatterPercent = value => `${value} %`; - parserPercent = value => value.replace(' %', ''); - formatterDollar = value => `$ ${value}`; - parserDollar = value => value.replace('$ ', ''); + formatterPercent = (value: number) => `${value} %`; + parserPercent = (value: string) => value.replace(' %', ''); + formatterDollar = (value: number) => `$ ${value}`; + parserDollar = (value: string) => value.replace('$ ', ''); } diff --git a/components/input-number/nz-input-number.component.ts b/components/input-number/nz-input-number.component.ts index a5fbadb3b0a..f5f3acd2564 100644 --- a/components/input-number/nz-input-number.component.ts +++ b/components/input-number/nz-input-number.component.ts @@ -59,7 +59,7 @@ export class NzInputNumberComponent implements ControlValueAccessor, AfterViewIn @Input() nzSize: NzSizeLDSType = 'default'; @Input() nzMin: number = -Infinity; @Input() nzMax: number = Infinity; - @Input() nzParser = (value) => value; + @Input() nzParser = (value: any) => value; // tslint:disable-line:no-any @Input() nzPrecision: number; @Input() nzPlaceHolder = ''; @Input() nzStep = 1; @@ -67,6 +67,8 @@ export class NzInputNumberComponent implements ControlValueAccessor, AfterViewIn @Input() @InputBoolean() nzAutoFocus = false; @Input() nzFormatter: (value: number) => string | number = (value) => value; + [ property: string ]: any // tslint:disable-line:no-any + updateAutoFocus(): void { if (this.nzAutoFocus) { this.renderer.setAttribute(this.inputElement.nativeElement, 'autofocus', 'autofocus'); @@ -102,7 +104,7 @@ export class NzInputNumberComponent implements ControlValueAccessor, AfterViewIn ); } - getValidValue(value: string | number): string | number { + getValidValue(value?: string | number): string | number | undefined { let val = parseFloat(value as string); // https://github.com/ant-design/ant-design/issues/7358 if (isNaN(val)) { @@ -235,7 +237,7 @@ export class NzInputNumberComponent implements ControlValueAccessor, AfterViewIn return; } const value = this.getCurrentValidValue(this.actualValue) || 0; - let val; + let val = 0; if (type === 'up') { val = this.upStep(value, ratio); } else if (type === 'down') { diff --git a/components/input-number/nz-input-number.spec.ts b/components/input-number/nz-input-number.spec.ts index 0334a5198a9..71c57ab21cb 100644 --- a/components/input-number/nz-input-number.spec.ts +++ b/components/input-number/nz-input-number.spec.ts @@ -1,5 +1,5 @@ -import { Component, ViewChild } from '@angular/core'; -import { fakeAsync, flush, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, ViewChild } from '@angular/core'; +import { fakeAsync, flush, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule, FormBuilder, FormGroup, ReactiveFormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; @@ -11,18 +11,19 @@ import { NzInputNumberModule } from './nz-input-number.module'; describe('input number', () => { beforeEach(fakeAsync(() => { TestBed.configureTestingModule({ - imports : [NzInputNumberModule, FormsModule, ReactiveFormsModule], - declarations: [NzTestInputNumberBasicComponent, NzTestInputNumberFormComponent] + imports : [ NzInputNumberModule, FormsModule, ReactiveFormsModule ], + declarations: [ NzTestInputNumberBasicComponent, NzTestInputNumberFormComponent ] }); TestBed.compileComponents(); })); describe('input number basic', () => { - let fixture; - let testComponent; - let inputNumber; - let inputElement; - let upHandler; - let downHandler; + let fixture: ComponentFixture; + let testComponent: NzTestInputNumberBasicComponent; + let inputNumber: DebugElement; + let inputElement: HTMLInputElement; + let upHandler: HTMLElement; + let downHandler: HTMLElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestInputNumberBasicComponent); fixture.detectChanges(); @@ -68,7 +69,7 @@ describe('input number', () => { testComponent.nzInputNumberComponent.ngAfterViewInit(); fixture.detectChanges(); expect(inputElement === document.activeElement).toBe(true); - expect(inputElement.attributes.getNamedItem('autofocus').name).toBe('autofocus'); + expect(inputElement.attributes.getNamedItem('autofocus')!.name).toBe('autofocus'); testComponent.autofocus = false; fixture.detectChanges(); expect(inputElement.attributes.getNamedItem('autofocus')).toBe(null); @@ -377,10 +378,10 @@ describe('input number', () => { fixture.detectChanges(); expect(testComponent.value).toBe(-10); }); - it('should update value immediatelly after formatter changed', (() => { - const newFormatter = v => `${v} %`; - const initValue = '1'; - testComponent.nzInputNumberComponent.onModelChange(initValue); + it('should update value immediately after formatter changed', (() => { + const newFormatter = (v: number) => `${v} %`; + const initValue = 1; + testComponent.nzInputNumberComponent.onModelChange(`${initValue}`); fixture.detectChanges(); testComponent.formatter = newFormatter; fixture.detectChanges(); @@ -402,11 +403,13 @@ describe('input number', () => { expect(inputNumber.nativeElement.classList).not.toContain('ant-input-number-focused'); })); }); + describe('input number form', () => { - let fixture; - let testComponent; - let inputNumber; - let upHandler; + let fixture: ComponentFixture; + let testComponent: NzTestInputNumberFormComponent; + let inputNumber: DebugElement; + let upHandler: HTMLElement; + beforeEach(fakeAsync(() => { fixture = TestBed.createComponent(NzTestInputNumberFormComponent); fixture.detectChanges(); @@ -426,18 +429,18 @@ describe('input number', () => { fixture.detectChanges(); flush(); fixture.detectChanges(); - expect(testComponent.formGroup.get('inputNumber').value).toBe(1); + expect(testComponent.formGroup.get('inputNumber')!.value).toBe(1); dispatchFakeEvent(upHandler, 'mousedown'); fixture.detectChanges(); flush(); fixture.detectChanges(); - expect(testComponent.formGroup.get('inputNumber').value).toBe(10); + expect(testComponent.formGroup.get('inputNumber')!.value).toBe(10); testComponent.disable(); dispatchFakeEvent(upHandler, 'mousedown'); fixture.detectChanges(); flush(); fixture.detectChanges(); - expect(testComponent.formGroup.get('inputNumber').value).toBe(10); + expect(testComponent.formGroup.get('inputNumber')!.value).toBe(10); })); }); }); @@ -463,7 +466,7 @@ describe('input number', () => { }) export class NzTestInputNumberBasicComponent { @ViewChild(NzInputNumberComponent) nzInputNumberComponent: NzInputNumberComponent; - value; + value?: number | string; autofocus = false; disabled = false; min = -1; @@ -471,9 +474,9 @@ export class NzTestInputNumberBasicComponent { size = 'default'; placeholder = 'placeholder'; step = 1; - precision = 2; - formatter = (value) => value; - parser = (value) => value; + precision?: number = 2; + formatter = (value: number) => `${value}`; + parser = (value: number) => value; modelChange = jasmine.createSpy('change callback'); } @@ -490,7 +493,7 @@ export class NzTestInputNumberFormComponent { constructor(private formBuilder: FormBuilder) { this.formGroup = this.formBuilder.group({ - inputNumber: [1] + inputNumber: [ 1 ] }); } diff --git a/components/input/demo/autosize-textarea.ts b/components/input/demo/autosize-textarea.ts index d588de3009a..626a331bc42 100644 --- a/components/input/demo/autosize-textarea.ts +++ b/components/input/demo/autosize-textarea.ts @@ -12,5 +12,5 @@ import { Component } from '@angular/core'; ` }) export class NzDemoInputAutosizeTextareaComponent { - value; + value: string; } diff --git a/components/input/demo/password-input.ts b/components/input/demo/password-input.ts index 538462ca7d4..c63c082a953 100644 --- a/components/input/demo/password-input.ts +++ b/components/input/demo/password-input.ts @@ -20,5 +20,5 @@ import { Component } from '@angular/core'; }) export class NzDemoInputPasswordInputComponent { passwordVisible = false; - password; + password: string; } diff --git a/components/input/nz-autoresize.spec.ts b/components/input/nz-autoresize.spec.ts index 8cccb22d86b..9b8a5dcbc1e 100644 --- a/components/input/nz-autoresize.spec.ts +++ b/components/input/nz-autoresize.spec.ts @@ -1,13 +1,11 @@ import { Component, ViewEncapsulation } from '@angular/core'; -import { async, fakeAsync, flush, TestBed } from '@angular/core/testing'; +import { async, fakeAsync, flush, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; import { NzAutoResizeDirective } from './nz-autoresize.directive'; import { NzInputModule } from './nz-input.module'; describe('autoresize', () => { - let testComponent; - let fixture; beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzInputModule, FormsModule, ReactiveFormsModule ], @@ -15,10 +13,14 @@ describe('autoresize', () => { providers : [] }).compileComponents(); })); + describe('single input', () => { describe('textarea autosize string', () => { - let textarea; - let autosize; + let fixture: ComponentFixture; + let testComponent: NzTestInputWithTextAreaAutoSizeStringComponent; + let textarea: HTMLTextAreaElement; + let autosize: NzAutoResizeDirective; + beforeEach(() => { fixture = TestBed.createComponent(NzTestInputWithTextAreaAutoSizeStringComponent); testComponent = fixture.debugElement.componentInstance; @@ -42,9 +44,9 @@ describe('autoresize', () => { autosize.resizeToFitContent(); expect(textarea.clientHeight) - .toBeGreaterThan(previousHeight, 'Expected textarea to have grown with added content.'); + .toBeGreaterThan(previousHeight, 'Expected textarea to have grown with added content.'); expect(textarea.clientHeight) - .toBe(textarea.scrollHeight, 'Expected textarea height to match its scrollHeight'); + .toBe(textarea.scrollHeight, 'Expected textarea height to match its scrollHeight'); previousHeight = textarea.clientHeight; testComponent.value += ` @@ -59,14 +61,17 @@ describe('autoresize', () => { fixture.detectChanges(); autosize.resizeToFitContent(true); expect(textarea.clientHeight) - .toBeGreaterThan(previousHeight, 'Expected textarea to have grown with added content.'); + .toBeGreaterThan(previousHeight, 'Expected textarea to have grown with added content.'); expect(textarea.clientHeight) - .toBe(textarea.scrollHeight, 'Expected textarea height to match its scrollHeight'); + .toBe(textarea.scrollHeight, 'Expected textarea height to match its scrollHeight'); })); }); describe('textarea autosize object', () => { - let textarea; - let autosize; + let fixture: ComponentFixture; + let testComponent: NzTestInputWithTextAreaAutoSizeObjectComponent; + let textarea: HTMLTextAreaElement; + let autosize: NzAutoResizeDirective; + beforeEach(() => { fixture = TestBed.createComponent(NzTestInputWithTextAreaAutoSizeObjectComponent); testComponent = fixture.debugElement.componentInstance; @@ -75,6 +80,7 @@ describe('autoresize', () => { autosize = fixture.debugElement.query(By.directive(NzAutoResizeDirective)).injector.get(NzAutoResizeDirective); }); it('should set a min-height based on minRows', fakeAsync(() => { + autosize.resizeToFitContent(true); fixture.detectChanges(); flush(); @@ -86,7 +92,7 @@ describe('autoresize', () => { fixture.detectChanges(); autosize.resizeToFitContent(true); expect(parseInt(textarea.style.minHeight as string, 10)) - .toBeGreaterThan(previousMinHeight, 'Expected increased min-height with minRows increase.'); + .toBeGreaterThan(previousMinHeight, 'Expected increased min-height with minRows increase.'); })); it('should set a max-height based on maxRows', fakeAsync(() => { @@ -101,18 +107,18 @@ describe('autoresize', () => { fixture.detectChanges(); autosize.resizeToFitContent(true); expect(parseInt(textarea.style.maxHeight as string, 10)) - .toBeGreaterThan(previousMaxHeight, 'Expected increased max-height with maxRows increase.'); + .toBeGreaterThan(previousMaxHeight, 'Expected increased max-height with maxRows increase.'); })); }); }); }); @Component({ - selector: 'nz-test-input-with-textarea-autosize-string', - template: ``, + selector : 'nz-test-input-with-textarea-autosize-string', + template : ``, encapsulation: ViewEncapsulation.None, - styles: [ - ` + styles : [ + ` textarea.cdk-textarea-autosize-measuring { height: auto !important; overflow: hidden !important; @@ -127,11 +133,11 @@ export class NzTestInputWithTextAreaAutoSizeStringComponent { } @Component({ - selector: 'nz-test-input-with-textarea-autosize-object', - template: ``, + selector : 'nz-test-input-with-textarea-autosize-object', + template : ``, encapsulation: ViewEncapsulation.None, - styles: [ - ` + styles : [ + ` textarea.cdk-textarea-autosize-measuring { height: auto !important; overflow: hidden !important; diff --git a/components/input/nz-input-group.spec.ts b/components/input/nz-input-group.spec.ts index 4976baff347..047e099c5b8 100644 --- a/components/input/nz-input-group.spec.ts +++ b/components/input/nz-input-group.spec.ts @@ -1,5 +1,5 @@ import { Component, TemplateRef, ViewChild } from '@angular/core'; -import { async, TestBed } from '@angular/core/testing'; +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; import { NzIconTestModule } from '../icon/nz-icon-test.module'; @@ -7,8 +7,6 @@ import { NzInputGroupComponent } from './nz-input-group.component'; import { NzInputModule } from './nz-input.module'; describe('input-group', () => { - let testComponent; - let fixture; beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzInputModule, FormsModule, ReactiveFormsModule, NzIconTestModule ], @@ -18,7 +16,10 @@ describe('input-group', () => { })); describe('input group', () => { describe('addon', () => { - let inputGroupElement; + let testComponent: NzTestInputGroupAddonComponent; + let fixture: ComponentFixture; + let inputGroupElement: HTMLElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestInputGroupAddonComponent); testComponent = fixture.debugElement.componentInstance; @@ -33,33 +34,33 @@ describe('input-group', () => { testComponent.beforeContent = 'before'; fixture.detectChanges(); expect(inputGroupElement.firstElementChild!.classList).toContain('ant-input-group'); - expect(inputGroupElement.firstElementChild.children.length).toBe(2); - expect(inputGroupElement.firstElementChild.lastElementChild.classList).toContain('ant-input'); - expect(inputGroupElement.firstElementChild.firstElementChild.innerText).toBe('before'); + expect(inputGroupElement.firstElementChild!.children.length).toBe(2); + expect(inputGroupElement.firstElementChild!.lastElementChild!.classList).toContain('ant-input'); + expect((inputGroupElement.firstElementChild!.firstElementChild as HTMLElement).innerText).toBe('before'); }); it('should before content template work', () => { testComponent.beforeContent = testComponent.beforeTemplate; fixture.detectChanges(); expect(inputGroupElement.firstElementChild!.classList).toContain('ant-input-group'); - expect(inputGroupElement.firstElementChild.children.length).toBe(2); - expect(inputGroupElement.firstElementChild.lastElementChild.classList).toContain('ant-input'); - expect(inputGroupElement.firstElementChild.firstElementChild.innerText).toBe('beforeTemplate'); + expect(inputGroupElement.firstElementChild!.children.length).toBe(2); + expect(inputGroupElement.firstElementChild!.lastElementChild!.classList).toContain('ant-input'); + expect((inputGroupElement.firstElementChild!.firstElementChild as HTMLElement).innerText).toBe('beforeTemplate'); }); it('should after content string work', () => { testComponent.afterContent = 'after'; fixture.detectChanges(); expect(inputGroupElement.firstElementChild!.classList).toContain('ant-input-group'); - expect(inputGroupElement.firstElementChild.children.length).toBe(2); - expect(inputGroupElement.firstElementChild.firstElementChild!.classList).toContain('ant-input'); - expect(inputGroupElement.firstElementChild.lastElementChild.innerText).toBe('after'); + expect(inputGroupElement.firstElementChild!.children.length).toBe(2); + expect(inputGroupElement.firstElementChild!.firstElementChild!.classList).toContain('ant-input'); + expect((inputGroupElement.firstElementChild!.lastElementChild as HTMLElement).innerText).toBe('after'); }); it('should after content template work', () => { testComponent.afterContent = testComponent.afterTemplate; fixture.detectChanges(); expect(inputGroupElement.firstElementChild!.classList).toContain('ant-input-group'); - expect(inputGroupElement.firstElementChild.children.length).toBe(2); - expect(inputGroupElement.firstElementChild.firstElementChild!.classList).toContain('ant-input'); - expect(inputGroupElement.firstElementChild.lastElementChild.innerText).toBe('afterTemplate'); + expect(inputGroupElement.firstElementChild!.children.length).toBe(2); + expect(inputGroupElement.firstElementChild!.firstElementChild!.classList).toContain('ant-input'); + expect((inputGroupElement.firstElementChild!.lastElementChild as HTMLElement).innerText).toBe('afterTemplate'); }); it('should size work', () => { testComponent.beforeContent = 'before'; @@ -74,48 +75,57 @@ describe('input-group', () => { }); }); describe('affix', () => { - let inputGroupElement; + let fixture: ComponentFixture; + let testComponent: NzTestInputGroupAffixComponent; + let inputGroupElement: HTMLElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestInputGroupAffixComponent); testComponent = fixture.debugElement.componentInstance; fixture.detectChanges(); inputGroupElement = fixture.debugElement.query(By.directive(NzInputGroupComponent)).nativeElement; }); + it('should not show addon without before and after content', () => { expect(inputGroupElement.firstElementChild!.classList).toContain('ant-input'); }); + it('should before content string work', () => { testComponent.beforeContent = 'before'; fixture.detectChanges(); expect(inputGroupElement.firstElementChild!.classList).toContain('ant-input-prefix'); expect(inputGroupElement.children.length).toBe(2); - expect(inputGroupElement.lastElementChild.classList).toContain('ant-input'); - expect(inputGroupElement.firstElementChild.innerText).toBe('before'); + expect(inputGroupElement.lastElementChild!.classList).toContain('ant-input'); + expect((inputGroupElement.firstElementChild as HTMLElement).innerText).toBe('before'); }); + it('should before content template work', () => { testComponent.beforeContent = testComponent.beforeTemplate; fixture.detectChanges(); expect(inputGroupElement.firstElementChild!.classList).toContain('ant-input-prefix'); expect(inputGroupElement.children.length).toBe(2); - expect(inputGroupElement.lastElementChild.classList).toContain('ant-input'); - expect(inputGroupElement.firstElementChild.innerText).toBe('beforeTemplate'); + expect(inputGroupElement.lastElementChild!.classList).toContain('ant-input'); + expect((inputGroupElement.firstElementChild as HTMLElement).innerText).toBe('beforeTemplate'); }); + it('should after content string work', () => { testComponent.afterContent = 'after'; fixture.detectChanges(); - expect(inputGroupElement.lastElementChild.classList).toContain('ant-input-suffix'); + expect(inputGroupElement.lastElementChild!.classList).toContain('ant-input-suffix'); expect(inputGroupElement.children.length).toBe(2); expect(inputGroupElement.firstElementChild!.classList).toContain('ant-input'); - expect(inputGroupElement.lastElementChild.innerText).toBe('after'); + expect((inputGroupElement.lastElementChild as HTMLElement).innerText).toBe('after'); }); + it('should after content template work', () => { testComponent.afterContent = testComponent.afterTemplate; fixture.detectChanges(); - expect(inputGroupElement.lastElementChild.classList).toContain('ant-input-suffix'); + expect(inputGroupElement.lastElementChild!.classList).toContain('ant-input-suffix'); expect(inputGroupElement.children.length).toBe(2); expect(inputGroupElement.firstElementChild!.classList).toContain('ant-input'); - expect(inputGroupElement.lastElementChild.innerText).toBe('afterTemplate'); + expect((inputGroupElement.lastElementChild as HTMLElement).innerText).toBe('afterTemplate'); }); + it('should size work', () => { testComponent.beforeContent = 'before'; fixture.detectChanges(); @@ -129,7 +139,9 @@ describe('input-group', () => { }); }); describe('multiple', () => { - let inputGroupElement; + let fixture: ComponentFixture; + let testComponent: NzTestInputGroupMultipleComponent; + let inputGroupElement: HTMLElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestInputGroupMultipleComponent); testComponent = fixture.debugElement.componentInstance; @@ -172,10 +184,10 @@ describe('input-group', () => { }); }); describe('col', () => { - let inputGroupElement; + let fixture: ComponentFixture; + let inputGroupElement: HTMLElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestInputGroupColComponent); - testComponent = fixture.debugElement.componentInstance; fixture.detectChanges(); inputGroupElement = fixture.debugElement.query(By.directive(NzInputGroupComponent)).nativeElement; }); @@ -184,15 +196,16 @@ describe('input-group', () => { }); }); describe('mix', () => { - let inputGroupElement; + let fixture: ComponentFixture; + let inputGroupElement: HTMLElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestInputGroupMixComponent); - testComponent = fixture.debugElement.componentInstance; fixture.detectChanges(); inputGroupElement = fixture.debugElement.query(By.directive(NzInputGroupComponent)).nativeElement; }); it('should mix work', () => { - expect(inputGroupElement.querySelector('.ant-input-affix-wrapper').nextElementSibling.classList).toContain('ant-input-group-addon'); + expect(inputGroupElement.querySelector('.ant-input-affix-wrapper')!.nextElementSibling!.classList).toContain('ant-input-group-addon'); }); }); }); @@ -211,8 +224,8 @@ describe('input-group', () => { export class NzTestInputGroupAddonComponent { @ViewChild('beforeTemplate') beforeTemplate: TemplateRef; @ViewChild('afterTemplate') afterTemplate: TemplateRef; - beforeContent; - afterContent; + beforeContent: string | TemplateRef; + afterContent: string | TemplateRef; size = 'default'; } @@ -229,8 +242,8 @@ export class NzTestInputGroupAddonComponent { export class NzTestInputGroupAffixComponent { @ViewChild('beforeTemplate') beforeTemplate: TemplateRef; @ViewChild('afterTemplate') afterTemplate: TemplateRef; - beforeContent; - afterContent; + beforeContent: string | TemplateRef; + afterContent: string | TemplateRef; size = 'default'; } diff --git a/components/input/nz-input.spec.ts b/components/input/nz-input.spec.ts index 2728d1a03e7..816040d3c9f 100644 --- a/components/input/nz-input.spec.ts +++ b/components/input/nz-input.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { async, fakeAsync, flush, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { async, fakeAsync, flush, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule, FormBuilder, FormGroup, ReactiveFormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; import { NzIconTestModule } from '../icon/nz-icon-test.module'; @@ -7,8 +7,6 @@ import { NzInputDirective } from './nz-input.directive'; import { NzInputModule } from './nz-input.module'; describe('input', () => { - let testComponent; - let fixture; beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzInputModule, FormsModule, ReactiveFormsModule, NzIconTestModule ], @@ -18,7 +16,10 @@ describe('input', () => { })); describe('single input', () => { describe('input with input element', () => { - let inputElement; + let fixture: ComponentFixture; + let testComponent: NzTestInputWithInputComponent; + let inputElement: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestInputWithInputComponent); testComponent = fixture.debugElement.componentInstance; @@ -47,23 +48,30 @@ describe('input', () => { expect(inputElement.nativeElement.classList).toContain('ant-input-lg'); }); }); + describe('input with textarea element', () => { - let inputElement; + let fixture: ComponentFixture; + let inputElement: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestInputWithInputComponent); - testComponent = fixture.debugElement.componentInstance; fixture.detectChanges(); inputElement = fixture.debugElement.query(By.directive(NzInputDirective)); }); + it('should className correct', () => { fixture.detectChanges(); expect(inputElement.nativeElement.classList).toContain('ant-input'); }); }); }); + describe('input form', () => { describe('input with form', () => { - let inputElement; + let fixture: ComponentFixture; + let testComponent: NzTestInputFormComponent; + let inputElement: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestInputFormComponent); testComponent = fixture.debugElement.componentInstance; diff --git a/components/layout/nz-layout.spec.ts b/components/layout/nz-layout.spec.ts index ad36550f227..83d61165eaa 100644 --- a/components/layout/nz-layout.spec.ts +++ b/components/layout/nz-layout.spec.ts @@ -1,6 +1,6 @@ import { MediaMatcher } from '@angular/cdk/layout'; -import { NO_ERRORS_SCHEMA } from '@angular/core'; -import { async, discardPeriodicTasks, fakeAsync, tick, TestBed } from '@angular/core/testing'; +import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core'; +import { async, discardPeriodicTasks, fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzIconTestModule } from '../icon/nz-icon-test.module'; @@ -16,14 +16,14 @@ import { NzLayoutModule } from './nz-layout.module'; import { NzSiderComponent } from './nz-sider.component'; describe('layout', () => { - let testComponent; - let fixture; describe('basic', () => { - let headers; - let contents; - let footers; - let siders; - let layouts; + let fixture: ComponentFixture; + let headers: DebugElement[]; + let contents: DebugElement[]; + let footers: DebugElement[]; + let siders: DebugElement[]; + let layouts: DebugElement[]; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzLayoutModule ], @@ -34,7 +34,6 @@ describe('layout', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoLayoutBasicComponent); - testComponent = fixture.debugElement.componentInstance; headers = fixture.debugElement.queryAll(By.directive(NzHeaderComponent)); contents = fixture.debugElement.queryAll(By.directive(NzContentComponent)); footers = fixture.debugElement.queryAll(By.directive(NzFooterComponent)); @@ -56,8 +55,11 @@ describe('layout', () => { }); }); describe('side', () => { - let sider; - let trigger; + let fixture: ComponentFixture; + let testComponent: NzDemoLayoutSideComponent; + let sider: DebugElement; + let trigger: DebugElement; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzLayoutModule ], @@ -144,6 +146,9 @@ describe('layout', () => { }); }); describe('custom-trigger', () => { + let fixture: ComponentFixture; + let testComponent: NzDemoLayoutCustomTriggerComponent; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzLayoutModule, NzIconTestModule ], @@ -171,7 +176,8 @@ describe('layout', () => { }); }); describe('responsive', () => { - let sider; + let fixture: ComponentFixture; + let sider: DebugElement; class MatchMediaServiceSpy { matchMedia = jasmine.createSpy('matchMedia').and.returnValue({ @@ -195,9 +201,9 @@ describe('layout', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoLayoutResponsiveComponent); - testComponent = fixture.debugElement.componentInstance; sider = fixture.debugElement.query(By.directive(NzSiderComponent)); }); + it('should responsive work', fakeAsync(() => { fixture.detectChanges(); tick(1000); diff --git a/components/mention/demo/avatar.ts b/components/mention/demo/avatar.ts index abf7751fb8d..1bbea5f298e 100755 --- a/components/mention/demo/avatar.ts +++ b/components/mention/demo/avatar.ts @@ -4,28 +4,28 @@ import { Component, ViewEncapsulation } from '@angular/core'; selector : 'nz-demo-mention-avatar', encapsulation: ViewEncapsulation.None, template : ` - - - - - {{ framework.name }} - {{ framework.type }} - - -`, - styles: [` + + + + + {{ framework.name }} - {{ framework.type }} + + + `, + styles : [ ` .ant-avatar.ant-avatar-sm { width: 14px; height: 14px; margin-right: 8px; position: relative } - `] + ` ] }) export class NzDemoMentionAvatarComponent { inputValue: string; @@ -36,7 +36,7 @@ export class NzDemoMentionAvatarComponent { { name: 'Flask', type: 'Python', icon: 'https://zos.alipayobjects.com/rmsportal/xaypBUijfnpAlXE.png' }, ]; - valueWith = data => data.name; + valueWith = (data: { name: string, type: string, icon: string }) => data.name; onSelect(value: string): void { console.log(value); diff --git a/components/mention/demo/controlled.ts b/components/mention/demo/controlled.ts index 60726458325..4d2213849f4 100644 --- a/components/mention/demo/controlled.ts +++ b/components/mention/demo/controlled.ts @@ -44,7 +44,7 @@ export class NzDemoMentionControlledComponent implements OnInit { suggestions = ['afc163', 'benjycui', 'yiminghe', 'RaoHai', '中文', 'にほんご']; validateForm: FormGroup; - @ViewChild('mentions') mentionChild; + @ViewChild('mentions') mentionChild: any; get mention(): AbstractControl { return this.validateForm.get('mention')!; } diff --git a/components/mention/demo/custom-tag.ts b/components/mention/demo/custom-tag.ts index fc9ad1afabc..e31addfaf68 100644 --- a/components/mention/demo/custom-tag.ts +++ b/components/mention/demo/custom-tag.ts @@ -30,7 +30,7 @@ export class NzDemoMentionCustomTagComponent { { name: 'Django', type: 'Python' } ]; - valueWith = data => data.name; + valueWith = (data: { name: string, type: string }) => data.name; onSelect(value: string): void { console.log(value); diff --git a/components/mention/nz-mention.component.ts b/components/mention/nz-mention.component.ts index f5185296f38..b9c5eb8c308 100644 --- a/components/mention/nz-mention.component.ts +++ b/components/mention/nz-mention.component.ts @@ -78,8 +78,8 @@ export class NzMentionComponent implements OnDestroy, AfterContentInit, OnChange @Output() readonly nzOnSelect: EventEmitter = new EventEmitter(); @Output() readonly nzOnSearchChange: EventEmitter = new EventEmitter(); - @ContentChild(NzMentionTriggerDirective) trigger; - @ViewChild(TemplateRef) suggestionsTemp; + @ContentChild(NzMentionTriggerDirective) trigger: NzMentionTriggerDirective; + @ViewChild(TemplateRef) suggestionsTemp: TemplateRef; @ContentChild(NzMentionSuggestionDirective, { read: TemplateRef }) // tslint:disable-next-line:no-any @@ -99,7 +99,7 @@ export class NzMentionComponent implements OnDestroy, AfterContentInit, OnChange private cursorMentionStart: number; private cursorMentionEnd: number; private overlayRef: OverlayRef | null; - private portal: TemplatePortal<{}>; + private portal: TemplatePortal; private positionStrategy: FlexibleConnectedPositionStrategy; private overlayBackdropClickSubscription: Subscription; @@ -203,8 +203,8 @@ export class NzMentionComponent implements OnDestroy, AfterContentInit, OnChange } private bindTriggerEvents(): void { - this.trigger.onInput.subscribe((e) => this.handleInput(e)); - this.trigger.onKeydown.subscribe((e) => this.handleKeydown(e)); + this.trigger.onInput.subscribe((e: KeyboardEvent) => this.handleInput(e)); + this.trigger.onKeydown.subscribe((e: KeyboardEvent) => this.handleKeydown(e)); this.trigger.onClick.subscribe(() => this.handleClick()); } diff --git a/components/mention/nz-mention.spec.ts b/components/mention/nz-mention.spec.ts index d8ef9c3f99e..96fee96d6e0 100644 --- a/components/mention/nz-mention.spec.ts +++ b/components/mention/nz-mention.spec.ts @@ -7,7 +7,7 @@ import { NgZone, ViewChild } from '@angular/core'; -import { async, fakeAsync, flush, inject, tick, TestBed } from '@angular/core/testing'; +import { async, fakeAsync, flush, inject, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; @@ -64,8 +64,8 @@ describe('mention', () => { })); describe('toggling', () => { - let fixture; - let textarea; + let fixture: ComponentFixture; + let textarea: HTMLTextAreaElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestSimpleMentionComponent); @@ -161,8 +161,8 @@ describe('mention', () => { }); describe('keyboard events', () => { - let fixture; - let textarea; + let fixture: ComponentFixture; + let textarea: HTMLTextAreaElement; let DOWN_ARROW_EVENT: KeyboardEvent; let UP_ARROW_EVENT: KeyboardEvent; let ENTER_EVENT: KeyboardEvent; @@ -376,8 +376,8 @@ describe('mention', () => { }); describe('property', () => { - let fixture; - let textarea; + let fixture: ComponentFixture; + let textarea: HTMLTextAreaElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestPropertyMentionComponent); @@ -502,7 +502,7 @@ class NzTestPropertyMentionComponent { ]; loading = false; prefix: string | string[] = '@'; - valueWith = data => data.name; + valueWith = (data: { name: string; type: string }) => data.name; @ViewChild(NzMentionComponent) mention: NzMentionComponent; @ViewChild(NzMentionTriggerDirective) trigger: NzMentionTriggerDirective; diff --git a/components/menu/demo/sider-current.ts b/components/menu/demo/sider-current.ts index 54c447d39de..3465fb89d95 100644 --- a/components/menu/demo/sider-current.ts +++ b/components/menu/demo/sider-current.ts @@ -49,7 +49,7 @@ import { Component } from '@angular/core'; styles : [] }) export class NzDemoMenuSiderCurrentComponent { - openMap = { + openMap: { [ name: string ]: boolean } = { sub1: true, sub2: false, sub3: false diff --git a/components/menu/nz-menu-item.directive.ts b/components/menu/nz-menu-item.directive.ts index a822a338c04..a2144069730 100644 --- a/components/menu/nz-menu-item.directive.ts +++ b/components/menu/nz-menu-item.directive.ts @@ -71,8 +71,9 @@ export class NzMenuItemDirective implements OnInit, OnChanges, OnDestroy { ngOnInit(): void { /** store origin padding in padding */ - if (this.el.style[ 'padding-left' ]) { - this.originalPadding = parseInt(this.el.style[ 'padding-left' ], 10); + const paddingLeft = this.el.style.paddingLeft; + if (paddingLeft) { + this.originalPadding = parseInt(paddingLeft, 10); } merge( this.nzMenuService.mode$, diff --git a/components/menu/nz-menu.spec.ts b/components/menu/nz-menu.spec.ts index 625aad91a04..fdd275e96a3 100644 --- a/components/menu/nz-menu.spec.ts +++ b/components/menu/nz-menu.spec.ts @@ -1,8 +1,16 @@ import { Directionality } from '@angular/cdk/bidi'; import { ConnectedOverlayPositionChange, OverlayContainer } from '@angular/cdk/overlay'; import { ScrollDispatcher } from '@angular/cdk/scrolling'; -import { Component, ElementRef, NO_ERRORS_SCHEMA, QueryList, ViewChild, ViewChildren } from '@angular/core'; -import { async, fakeAsync, inject, tick, TestBed } from '@angular/core/testing'; +import { + Component, + DebugElement, + ElementRef, + NO_ERRORS_SCHEMA, + QueryList, + ViewChild, + ViewChildren +} from '@angular/core'; +import { async, fakeAsync, inject, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { Subject } from 'rxjs'; @@ -51,10 +59,10 @@ describe('menu', () => { })); describe('demo', () => { describe('horizontal', () => { - let fixture; - let items; - let submenu; - let menu; + let fixture: ComponentFixture; + let items: DebugElement[]; + let submenu: DebugElement; + let menu: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzDemoMenuHorizontalComponent); items = fixture.debugElement.queryAll(By.directive(NzMenuItemDirective)); @@ -83,10 +91,10 @@ describe('menu', () => { }); }); describe('inline', () => { - let fixture; - let items; - let submenus; - let menu; + let fixture: ComponentFixture; + let items: DebugElement[]; + let submenus: DebugElement[]; + let menu: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzDemoMenuInlineComponent); items = fixture.debugElement.queryAll(By.directive(NzMenuItemDirective)); @@ -124,10 +132,10 @@ describe('menu', () => { })); }); describe('inline-collapsed', () => { - let fixture; - let testComponent; - let submenus; - let menu; + let fixture: ComponentFixture; + let testComponent: NzDemoMenuInlineCollapsedComponent; + let submenus: DebugElement[]; + let menu: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzDemoMenuInlineCollapsedComponent); testComponent = fixture.debugElement.componentInstance; @@ -166,8 +174,8 @@ describe('menu', () => { }); }); describe('slider-current', () => { - let fixture; - let submenus; + let fixture: ComponentFixture; + let submenus: DebugElement[]; beforeEach(() => { fixture = TestBed.createComponent(NzDemoMenuSiderCurrentComponent); submenus = fixture.debugElement.queryAll(By.directive(NzSubMenuComponent)); @@ -205,9 +213,9 @@ describe('menu', () => { })); }); describe('theme', () => { - let fixture; - let testComponent; - let menu; + let fixture: ComponentFixture; + let testComponent: NzDemoMenuThemeComponent; + let menu: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzDemoMenuThemeComponent); testComponent = fixture.debugElement.componentInstance; @@ -222,10 +230,10 @@ describe('menu', () => { }); }); describe('swich-mode', () => { - let fixture; - let testComponent; - let submenus; - let menu; + let fixture: ComponentFixture; + let testComponent: NzDemoMenuSwitchModeComponent; + let submenus: DebugElement[]; + let menu: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzDemoMenuSwitchModeComponent); testComponent = fixture.debugElement.componentInstance; @@ -246,9 +254,9 @@ describe('menu', () => { }); describe('coverage', () => { describe('horizontal submenu', () => { - let fixture; - let testComponent; - let submenu; + let fixture: ComponentFixture; + let testComponent: NzTestMenuHorizontalComponent; + let submenu: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestMenuHorizontalComponent); testComponent = fixture.debugElement.componentInstance; @@ -376,9 +384,9 @@ describe('menu', () => { }); }); describe('inline submenu', () => { - let fixture; - let testComponent; - let submenu; + let fixture: ComponentFixture; + let testComponent: NzTestMenuInlineComponent; + let submenu: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestMenuInlineComponent); testComponent = fixture.debugElement.componentInstance; diff --git a/components/message/demo/loading.ts b/components/message/demo/loading.ts index 39e5db23bbd..b011a8187ae 100644 --- a/components/message/demo/loading.ts +++ b/components/message/demo/loading.ts @@ -15,7 +15,7 @@ export class NzDemoMessageLoadingComponent { createBasicMessage(): void { const id = this.message.loading('Action in progress..', { nzDuration: 0 }).messageId; - setTimeout(_ => { + setTimeout(() => { this.message.remove(id); }, 2500); } diff --git a/components/modal/demo/service.ts b/components/modal/demo/service.ts index 3d35a6edc20..6dbcfaa03b4 100644 --- a/components/modal/demo/service.ts +++ b/components/modal/demo/service.ts @@ -50,6 +50,7 @@ export class NzDemoModalServiceComponent { tplModal: NzModalRef; tplModalButtonLoading = false; htmlModalVisible = false; + disabled = false; constructor(private modalService: NzModalService) { } @@ -110,7 +111,7 @@ export class NzDemoModalServiceComponent { } createCustomButtonModal(): void { - const modal = this.modalService.create({ + const modal: NzModalRef = this.modalService.create({ nzTitle: 'custom button demo', nzContent: 'pass array of button config to nzFooter to create multiple buttons', nzFooter: [ @@ -150,6 +151,7 @@ export class NzDemoModalServiceComponent { openAndCloseAll(): void { let pos = 0; + // @ts-ignore [ 'create', 'info', 'success', 'error' ].forEach((method) => this.modalService[method]({ nzMask: false, nzTitle: `Test ${method} title`, diff --git a/components/modal/nz-modal.component.ts b/components/modal/nz-modal.component.ts index 4b8206700a5..5758499754a 100644 --- a/components/modal/nz-modal.component.ts +++ b/components/modal/nz-modal.component.ts @@ -43,8 +43,8 @@ export const MODAL_ANIMATE_DURATION = 200; // Duration when perform animations ( type AnimationState = 'enter' | 'leave' | null; @Component({ - selector : 'nz-modal', - templateUrl: './nz-modal.component.html', + selector : 'nz-modal', + templateUrl : './nz-modal.component.html', // Using OnPush for modal caused footer can not to detect changes. we can fix it when 8.x. changeDetection: ChangeDetectionStrategy.Default }) @@ -124,6 +124,8 @@ export class NzModalComponent extends NzModalRef impleme private focusTrap: FocusTrap; private scrollStrategy: BlockScrollStrategy; + [ key: string ]: any // tslint:disable-line:no-any + constructor( private overlay: Overlay, private i18n: NzI18nService, @@ -276,7 +278,7 @@ export class NzModalComponent extends NzModalRef impleme const caseClose = (doClose: boolean | void | {}) => (doClose !== false) && this.close(doClose as R); // Users can return "false" to prevent closing by default if (isPromise(result)) { this[ loadingKey ] = true; - const handleThen = (doClose) => { + const handleThen = (doClose: boolean | void | {}) => { this[ loadingKey ] = false; caseClose(doClose); }; @@ -312,18 +314,18 @@ export class NzModalComponent extends NzModalRef impleme } return Promise - .resolve(animation ? this.animateTo(visible) : undefined) - .then(() => { // Emit open/close event after animations over - if (visible) { - this.nzAfterOpen.emit(); - } else { - this.nzAfterClose.emit(closeResult); - this.restoreFocus(); - this.scrollStrategy.disable(); - // Mark the for check so it can react if the view container is using OnPush change detection. - this.cdr.markForCheck(); - } - }); + .resolve(() => animation ? this.animateTo(visible) : undefined) + .then(() => { // Emit open/close event after animations over + if (visible) { + this.nzAfterOpen.emit(); + } else { + this.nzAfterClose.emit(closeResult); + this.restoreFocus(); + this.scrollStrategy.disable(); + // Mark the for check so it can react if the view container is using OnPush change detection. + this.cdr.markForCheck(); + } + }); } // Lookup a button's property, if the prop is a function, call & then return the result, otherwise, return itself. @@ -388,12 +390,12 @@ export class NzModalComponent extends NzModalRef impleme return buttons.map((button) => { return { ...{ - type: 'default', - size: 'default', + type : 'default', + size : 'default', autoLoading: true, - show: true, - loading: false, - disabled: false + show : true, + loading : false, + disabled : false }, ...button }; diff --git a/components/modal/nz-modal.service.ts b/components/modal/nz-modal.service.ts index 8ac7df79fff..fe48a8ca7d9 100644 --- a/components/modal/nz-modal.service.ts +++ b/components/modal/nz-modal.service.ts @@ -2,6 +2,7 @@ import { Overlay, OverlayRef } from '@angular/cdk/overlay'; import { ComponentPortal } from '@angular/cdk/portal'; import { ComponentRef, Injectable } from '@angular/core'; import { Observable } from 'rxjs'; +import { IndexableObject } from '../core/types/indexable'; import { LoggerService } from '../core/util/logger/logger.service'; @@ -120,13 +121,14 @@ export class NzModalService { } private simpleConfirm(options: ModalOptionsForService = {}, confirmType: ConfirmType): NzModalRef { + const iconMap: IndexableObject = { + 'info' : 'info-circle', + 'success': 'check-circle', + 'error' : 'close-circle', + 'warning': 'exclamation-circle' + }; if (!('nzIconType' in options)) { - options.nzIconType = { - 'info' : 'info-circle', - 'success': 'check-circle', - 'error' : 'close-circle', - 'warning': 'exclamation-circle' - }[ confirmType ]; + options.nzIconType = iconMap[ confirmType ]; } if (!('nzCancelText' in options)) { // Remove the Cancel button if the user not specify a Cancel button options.nzCancelText = undefined; diff --git a/components/modal/nz-modal.spec.ts b/components/modal/nz-modal.spec.ts index aa9be1e82e2..284b6f10004 100644 --- a/components/modal/nz-modal.spec.ts +++ b/components/modal/nz-modal.spec.ts @@ -26,16 +26,14 @@ import { NzModalService } from './nz-modal.service'; let counter = 0; describe('modal testing (legacy)', () => { - let instance; - let fixture: ComponentFixture<{}>; - describe('demo-async', () => { + let fixture: ComponentFixture; let modalElement: HTMLElement; let buttonShow: HTMLButtonElement; beforeEach(async(() => { TestBed.configureTestingModule({ - imports: [ NoopAnimationsModule, NzButtonModule, NzModalModule ], + imports : [ NoopAnimationsModule, NzButtonModule, NzModalModule ], declarations: [ NzDemoModalAsyncComponent ], providers : [ NzMeasureScrollbarService ] }).compileComponents(); @@ -43,7 +41,6 @@ describe('modal testing (legacy)', () => { beforeEach(() => { fixture = TestBed.createComponent(NzDemoModalAsyncComponent); - instance = fixture.debugElement.componentInstance; modalElement = fixture.debugElement.query(By.directive(NzModalComponent)).nativeElement; buttonShow = fixture.debugElement.query(By.directive(NzButtonComponent)).nativeElement; }); @@ -69,12 +66,14 @@ describe('modal testing (legacy)', () => { describe('demo-confirm-promise', () => { const tempModalId = generateUniqueId(); // Temp unique id to mark the confirm modal that created by service + let fixture: ComponentFixture; + let instance: NzDemoModalConfirmPromiseComponent; let modalAgent: NzModalRef; let buttonShow: HTMLButtonElement; beforeEach(async(() => { TestBed.configureTestingModule({ - imports: [ NoopAnimationsModule, NzButtonModule, NzModalModule ], + imports : [ NoopAnimationsModule, NzButtonModule, NzModalModule ], declarations: [ NzDemoModalConfirmPromiseComponent ], providers : [ NzMeasureScrollbarService ] }).compileComponents(); @@ -115,14 +114,16 @@ describe('modal testing (legacy)', () => { }); // /confirm-promise describe('NormalModal: created by service with most APIs', () => { - let tempModalId; // Temp unique id to mark the confirm modal that created by service + let tempModalId: string; // Temp unique id to mark the confirm modal that created by service + let fixture: ComponentFixture; + let instance: TestBasicServiceComponent; let modalAgent: NzModalRef; let modalElement: HTMLElement; - let modalInstance; + let modalInstance: NzModalComponent; beforeEach(async(() => { TestBed.configureTestingModule({ - imports: [ NoopAnimationsModule, NzModalModule, NzIconTestModule ], + imports : [ NoopAnimationsModule, NzModalModule, NzIconTestModule ], declarations: [ TestBasicServiceComponent ], providers : [ NzMeasureScrollbarService ] }).compileComponents(); @@ -139,10 +140,9 @@ describe('modal testing (legacy)', () => { }); it('should correctly render all basic props', fakeAsync(() => { - spyOn(console, 'log'); // [Hack] Codes that can't be covered by normal operations - // tslint:disable-next-line:no-any - expect((modalInstance as any).changeVisibleFromInside(true) instanceof Promise).toBe(true); + // @ts-ignore + expect(modalInstance.changeVisibleFromInside(true) instanceof Promise).toBe(true); expect((modalElement.querySelector('.ant-modal-wrap') as HTMLElement).style.zIndex).toBe('1888'); expect((modalElement.querySelector('.ant-modal-wrap') as HTMLElement).classList.contains('test-wrap-class-name')).toBe(true); @@ -209,12 +209,14 @@ describe('modal testing (legacy)', () => { describe('NormalModal: created by service with vary nzContent and nzFooter', () => { const tempModalId = generateUniqueId(); // Temp unique id to mark the confirm modal that created by service + let fixture: ComponentFixture; + let instance: TestVaryServiceComponent; let modalAgent: NzModalRef; let modalElement: HTMLElement; beforeEach(async(() => { TestBed.configureTestingModule({ - imports: [ NoopAnimationsModule, NzModalModule ], + imports : [ NoopAnimationsModule, NzModalModule ], declarations: [ TestVaryServiceComponent, TestVaryServiceCustomComponent ], providers : [ NzMeasureScrollbarService ] }); @@ -261,9 +263,12 @@ describe('modal testing (legacy)', () => { }); describe('ConfirmModal: should apply options correctly', () => { + let fixture: ComponentFixture; + let instance: TestConfirmModalComponent; + beforeEach(async(() => { TestBed.configureTestingModule({ - imports: [ NoopAnimationsModule, NzModalModule ], + imports : [ NoopAnimationsModule, NzModalModule ], declarations: [ TestConfirmModalComponent ], providers : [ NzMeasureScrollbarService ] }).compileComponents(); @@ -275,6 +280,7 @@ describe('modal testing (legacy)', () => { }); it('boundary detection for options', fakeAsync(() => { + // @ts-ignore const logger = instance.modalService.logger; spyOn(logger, 'warn'); @@ -303,11 +309,12 @@ describe('modal testing (legacy)', () => { }); describe('css-unit.pipe', () => { + let fixture: ComponentFixture; let testElement: HTMLDivElement; beforeEach(async(() => { TestBed.configureTestingModule({ - imports: [ NoopAnimationsModule ], + imports : [ NoopAnimationsModule ], declarations: [ CssUnitPipe, TestCssUnitPipeComponent ] }).compileComponents(); })); @@ -331,8 +338,10 @@ describe('modal testing (legacy)', () => { }); it('#i18n', () => { + let fixture: ComponentFixture; + const injector = TestBed.configureTestingModule({ - imports: [ NoopAnimationsModule, NzButtonModule, NzModalModule ], + imports : [ NoopAnimationsModule, NzButtonModule, NzModalModule ], declarations: [ NzDemoModalAsyncComponent ], providers : [ NzMeasureScrollbarService ] }); @@ -356,8 +365,8 @@ describe('NzModal', () => { beforeEach(fakeAsync(() => { TestBed.configureTestingModule({ - imports: [ NoopAnimationsModule, NzModalModule ], - providers: [ NzMeasureScrollbarService ], + imports : [ NoopAnimationsModule, NzModalModule ], + providers : [ NzMeasureScrollbarService ], declarations: [ NzDemoModalBasicComponent, ModalByServiceComponent @@ -482,7 +491,8 @@ describe('NzModal', () => { modalService.afterAllClose.subscribe(spy); fixture.componentInstance.nonServiceModalVisible = true; // Show non-service modal - modalMethods.forEach(method => modalService[method]({ nzWrapClassName: uniqueId(method) })); // Service modals + // @ts-ignore + modalMethods.forEach(method => modalService[ method ]({ nzWrapClassName: uniqueId(method) })); // Service modals fixture.detectChanges(); tick(600); @@ -526,7 +536,7 @@ describe('NzModal', () => { const spyOk = jasmine.createSpy('ok spy'); const spyCancel = jasmine.createSpy('cancel spy'); const modalRef: NzModalRef = modalService.create({ - nzOnOk: spyOk, + nzOnOk : spyOk, nzOnCancel: spyCancel }); @@ -583,11 +593,12 @@ class NzDemoModalBasicComponent { - +

    content

     `, - styles: [] + styles : [] }) class NzDemoModalAsyncComponent { isVisible = false; @@ -624,9 +635,9 @@ class NzDemoModalConfirmPromiseComponent { showConfirm(): void { this.confirmModal = this.modal.confirm({ - nzTitle: 'Do you Want to delete these items?', + nzTitle : 'Do you Want to delete these items?', nzContent: 'When clicked the OK button, this dialog will be closed after 1 second', - nzOnOk: () => new Promise((resolve, reject) => { + nzOnOk : () => new Promise((resolve, reject) => { setTimeout(Math.random() > 0.5 ? resolve : reject, 1000); }).catch(() => console.log('Oops errors!')) }); @@ -644,30 +655,33 @@ class TestBasicServiceComponent { // Testing for creating modal immediately this.basicModal = this.modalService.create({ - nzGetContainer: () => document.body, - nzZIndex: 1888, - nzWidth: 250, - nzWrapClassName: 'test-wrap-class-name', - nzClassName: 'test-class-name', - nzStyle: { left: '10px', top: '20pt', border: '2px solid red' }, - nzTitle: 'TEST BOLD TITLE', - nzContent: '

    test html content

    ', - nzClosable: false, - nzKeyboard: false, - nzMask: false, - nzMaskClosable: false, - nzMaskStyle: { opacity: 0.4 }, - nzBodyStyle: { background: 'gray' }, + nzGetContainer : () => document.body, + nzZIndex : 1888, + nzWidth : 250, + nzWrapClassName : 'test-wrap-class-name', + nzClassName : 'test-class-name', + nzStyle : { left: '10px', top: '20pt', border: '2px solid red' }, + nzTitle : 'TEST BOLD TITLE', + nzContent : '

    test html content

    ', + nzClosable : false, + nzKeyboard : false, + nzMask : false, + nzMaskClosable : false, + nzMaskStyle : { opacity: 0.4 }, + nzBodyStyle : { background: 'gray' }, // nzFooter: '
    custom html footer: OK
    ', - nzOkText: 'custom ok', - nzOkType: 'success', - nzOkLoading: false, - nzOkDisabled: false, + nzOkText : 'custom ok', + nzOkType : 'success', + nzOkLoading : false, + nzOkDisabled : false, nzCancelDisabled: false, - nzOnOk: () => { console.log('click ok'); return false; }, - nzCancelText: 'custom cancel', - nzCancelLoading: true, - nzOnCancel: () => console.log('click cancel') + nzOnOk : () => { + console.log('click ok'); + return false; + }, + nzCancelText : 'custom cancel', + nzCancelLoading : true, + nzOnCancel : () => console.log('click cancel') }); } } @@ -680,18 +694,18 @@ class TestVaryServiceComponent { createWithVary(): NzModalRef { const modal = this.modalService.create({ - nzContent: TestVaryServiceCustomComponent, + nzContent : TestVaryServiceCustomComponent, nzComponentParams: { title: 'internal title', subtitle: 'subtitle' }, - nzFooter: [ + nzFooter : [ { - label: 'change title from outside', + label : 'change title from outside', onClick: (componentInstance) => { componentInstance!.title = 'internal title changed'; return Promise.resolve(); } }, { - label: 'show loading', + label : 'show loading', onClick: () => Promise.reject(null) } ] @@ -700,6 +714,7 @@ class TestVaryServiceComponent { return modal; } } + @Component({ template: `

    {{ title }}

    {{ subtitle }}

    @@ -737,21 +752,24 @@ export class TestConfirmModalComponent { createOtherModals(): string[] { return [ 'info', 'success', 'error', 'warning' ].map(type => { const modalId = generateUniqueId(); - this.modalService[type]({ nzClassName: modalId }); - this.modalService[type](); // [Testing Required] Only for coverage temporarily + // @ts-ignore + this.modalService[ type ]({ nzClassName: modalId }); + // @ts-ignore + this.modalService[ type ](); // [Testing Required] Only for coverage temporarily return modalId; }); } } @Component({ - template: `
    ` + template: ` +
    ` }) -class TestCssUnitPipeComponent { } +class TestCssUnitPipeComponent {} @Component({ - selector: 'nz-modal-by-service', - template: ` + selector : 'nz-modal-by-service', + template : ` `, providers: [ NzModalControlService ] // Testing for service with parent service diff --git a/components/modal/nz-modal.type.ts b/components/modal/nz-modal.type.ts index 52778fb0d2d..4320e5a04cc 100644 --- a/components/modal/nz-modal.type.ts +++ b/components/modal/nz-modal.type.ts @@ -63,4 +63,7 @@ export interface ModalButtonOptions { // tslint:disable-line:no-any loading?: boolean | ((this: ModalButtonOptions, contentComponentInstance?: T) => boolean); // This prop CAN'T use with autoLoading=true disabled?: boolean | ((this: ModalButtonOptions, contentComponentInstance?: T) => boolean); onClick?(this: ModalButtonOptions, contentComponentInstance?: T): (void | {}) | Promise<(void | {})>; + + // tslint:disable-next-line:no-any + [ key: string ]: any; } diff --git a/components/pagination/nz-pagination.spec.ts b/components/pagination/nz-pagination.spec.ts index 72525f1a2fe..ca0885e6fcd 100644 --- a/components/pagination/nz-pagination.spec.ts +++ b/components/pagination/nz-pagination.spec.ts @@ -1,5 +1,5 @@ -import { Component, Injector, ViewChild } from '@angular/core'; -import { async, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, Injector, ViewChild } from '@angular/core'; +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import en_US from '../i18n/languages/en_US'; import { NzI18nService } from '../i18n/nz-i18n.service'; @@ -20,10 +20,10 @@ describe('pagination', () => { })); describe('pagination complex', () => { - let fixture; - let testComponent; - let pagination; - let paginationElement; + let fixture: ComponentFixture; + let testComponent: NzTestPaginationComponent; + let pagination: DebugElement; + let paginationElement: HTMLElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestPaginationComponent); testComponent = fixture.debugElement.componentInstance; @@ -37,11 +37,11 @@ describe('pagination', () => { expect(paginationElement.classList.contains('ant-pagination')).toBe(true); expect(paginationElement.firstElementChild!.classList.contains('ant-pagination-prev')).toBe(true); expect(paginationElement.firstElementChild!.classList.contains('ant-pagination-disabled')).toBe(true); - expect(paginationElement.lastElementChild.classList.contains('ant-pagination-next')).toBe(true); + expect(paginationElement.lastElementChild!.classList.contains('ant-pagination-next')).toBe(true); const length = paginationElement.children.length; const array = Array.prototype.slice.call(paginationElement.children).slice(1, length - 1); expect(array[ 0 ].classList.contains('ant-pagination-item-active')).toBe(true); - expect(array.every(node => node.classList.contains('ant-pagination-item'))).toBe(true); + expect(array.every((node: HTMLElement) => node.classList.contains('ant-pagination-item'))).toBe(true); }); it('should small size className correct', () => { testComponent.size = 'small'; @@ -78,7 +78,7 @@ describe('pagination', () => { it('should pre button disabled', () => { fixture.detectChanges(); expect(testComponent.pageIndexChange).toHaveBeenCalledTimes(0); - paginationElement.children[ 0 ].click(); + (paginationElement.children[ 0 ] as HTMLElement).click(); fixture.detectChanges(); expect(testComponent.pageIndexChange).toHaveBeenCalledTimes(0); expect(testComponent.pageIndex).toBe(1); @@ -87,7 +87,7 @@ describe('pagination', () => { testComponent.pageIndex = 5; fixture.detectChanges(); expect(testComponent.pageIndexChange).toHaveBeenCalledTimes(0); - paginationElement.children[ 0 ].click(); + (paginationElement.children[ 0 ] as HTMLElement).click(); fixture.detectChanges(); expect(testComponent.pageIndexChange).toHaveBeenCalledTimes(1); expect(testComponent.pageIndex).toBe(4); @@ -96,7 +96,7 @@ describe('pagination', () => { testComponent.pageIndex = 5; fixture.detectChanges(); expect(testComponent.pageIndexChange).toHaveBeenCalledTimes(0); - paginationElement.lastElementChild.click(); + (paginationElement.lastElementChild as HTMLElement).click(); fixture.detectChanges(); expect(testComponent.pageIndexChange).toHaveBeenCalledTimes(0); expect(testComponent.pageIndex).toBe(5); @@ -104,7 +104,7 @@ describe('pagination', () => { it('should next button work', () => { fixture.detectChanges(); expect(testComponent.pageIndexChange).toHaveBeenCalledTimes(0); - paginationElement.lastElementChild.click(); + (paginationElement.lastElementChild as HTMLElement).click(); fixture.detectChanges(); expect(testComponent.pageIndex).toBe(2); expect(testComponent.pageIndexChange).toHaveBeenCalledTimes(1); @@ -112,7 +112,7 @@ describe('pagination', () => { it('should click pageIndex work', () => { fixture.detectChanges(); expect(testComponent.pageIndexChange).toHaveBeenCalledTimes(0); - paginationElement.children[ 3 ].click(); + (paginationElement.children[ 3 ] as HTMLElement).click(); fixture.detectChanges(); expect(testComponent.pageIndex).toBe(3); expect(testComponent.pageIndexChange).toHaveBeenCalledTimes(1); @@ -127,7 +127,7 @@ describe('pagination', () => { fixture.detectChanges(); testComponent.pageIndex = 46; fixture.detectChanges(); - paginationElement.children[ 8 ].click(); + (paginationElement.children[ 8 ] as HTMLElement).click(); fixture.detectChanges(); expect(testComponent.pageIndex).toBe(50); expect(testComponent.pageIndexChange).toHaveBeenCalledTimes(1); @@ -139,7 +139,7 @@ describe('pagination', () => { testComponent.pageIndex = 5; fixture.detectChanges(); expect(paginationElement.children.length).toBe(11); - paginationElement.children[ 2 ].click(); + (paginationElement.children[ 2 ] as HTMLElement).click(); fixture.detectChanges(); expect(testComponent.pageIndex).toBe(1); expect(testComponent.pageIndexChange).toHaveBeenCalledTimes(1); @@ -152,7 +152,7 @@ describe('pagination', () => { fixture.detectChanges(); fixture.whenStable().then(() => { expect(paginationElement.children.length).toBe(10); - expect(paginationElement.lastElementChild.classList.contains('ant-pagination-options')).toBe(true); + expect(paginationElement.lastElementChild!.classList.contains('ant-pagination-options')).toBe(true); }); })); it('should change pageSize correct', () => { @@ -208,7 +208,7 @@ describe('pagination', () => { it('should simple className work', () => { expect(paginationElement.classList.contains('ant-pagination-simple')).toBe(true); expect(paginationElement.firstElementChild!.classList.contains('ant-pagination-prev')).toBe(true); - expect(paginationElement.lastElementChild.classList.contains('ant-pagination-next')).toBe(true); + expect(paginationElement.lastElementChild!.classList.contains('ant-pagination-next')).toBe(true); }); it('should simple pager jump', () => { fixture.detectChanges(); @@ -244,9 +244,9 @@ describe('pagination', () => { }); }); describe('pagination render items', () => { - let fixture; - let pagination; - let paginationElement; + let fixture: ComponentFixture; + let pagination: DebugElement; + let paginationElement: HTMLElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestPaginationRenderComponent); pagination = fixture.debugElement.query(By.directive(NzPaginationComponent)); @@ -255,16 +255,16 @@ describe('pagination', () => { }); it('should render correct', () => { fixture.detectChanges(); - expect(paginationElement.firstElementChild.innerText).toBe('Previous'); - expect(paginationElement.lastElementChild.innerText).toBe('Next'); - expect(paginationElement.children[ 1 ].innerText).toBe('2'); + expect((paginationElement.firstElementChild as HTMLElement).innerText).toBe('Previous'); + expect((paginationElement.lastElementChild as HTMLElement).innerText).toBe('Next'); + expect((paginationElement.children[ 1 ] as HTMLElement).innerText).toBe('2'); }); }); describe('pagination total items', () => { - let fixture; - let testComponent; - let pagination; - let paginationElement; + let fixture: ComponentFixture; + let testComponent: NzTestPaginationTotalComponent; + let pagination: DebugElement; + let paginationElement: HTMLElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestPaginationTotalComponent); testComponent = fixture.debugElement.componentInstance; @@ -274,13 +274,13 @@ describe('pagination', () => { }); it('should render correct', () => { fixture.detectChanges(); - expect(paginationElement.firstElementChild.innerText.trim()).toBe('1-20 of 85 items'); + expect((paginationElement.firstElementChild as HTMLElement).innerText.trim()).toBe('1-20 of 85 items'); testComponent.pageIndex = 2; fixture.detectChanges(); - expect(paginationElement.firstElementChild.innerText.trim()).toBe('21-40 of 85 items'); + expect((paginationElement.firstElementChild as HTMLElement).innerText.trim()).toBe('21-40 of 85 items'); testComponent.pageIndex = 5; fixture.detectChanges(); - expect(paginationElement.firstElementChild.innerText.trim()).toBe('81-85 of 85 items'); + expect((paginationElement.firstElementChild as HTMLElement).innerText.trim()).toBe('81-85 of 85 items'); }); }); diff --git a/components/popconfirm/nz-popconfirm.spec.ts b/components/popconfirm/nz-popconfirm.spec.ts index b21e7488d2c..003cb7d9201 100644 --- a/components/popconfirm/nz-popconfirm.spec.ts +++ b/components/popconfirm/nz-popconfirm.spec.ts @@ -1,6 +1,6 @@ import { OverlayContainer } from '@angular/cdk/overlay'; import { Component, ElementRef, ViewChild } from '@angular/core'; -import { fakeAsync, inject, tick, TestBed } from '@angular/core/testing'; +import { fakeAsync, inject, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { dispatchMouseEvent } from '../core/testing'; @@ -11,8 +11,6 @@ import { NzPopconfirmModule } from './nz-popconfirm.module'; describe('NzPopconfirm', () => { let overlayContainer: OverlayContainer; let overlayContainerElement: HTMLElement; - let fixture; - let component; beforeEach(fakeAsync(() => { TestBed.configureTestingModule({ @@ -27,11 +25,15 @@ describe('NzPopconfirm', () => { overlayContainer = oc; overlayContainerElement = oc.getContainerElement(); })); + afterEach(() => { overlayContainer.ngOnDestroy(); }); describe('should not bring break changes', () => { + let fixture: ComponentFixture; + let component: NzpopconfirmTestWrapperComponent; + beforeEach(() => { fixture = TestBed.createComponent(NzpopconfirmTestWrapperComponent); component = fixture.componentInstance; @@ -155,11 +157,15 @@ describe('NzPopconfirm', () => { })); }); describe('should support directive usage', () => { + let fixture: ComponentFixture; + let component: NzpopconfirmTestNewComponent; + beforeEach(() => { fixture = TestBed.createComponent(NzpopconfirmTestNewComponent); component = fixture.componentInstance; fixture.detectChanges(); }); + it('should show/hide with title string', fakeAsync(() => { const triggerElement = component.stringTemplate.nativeElement; dispatchMouseEvent(triggerElement, 'click'); @@ -301,7 +307,7 @@ export class NzpopconfirmTestNewComponent { @ViewChild('stringTemplate') stringTemplate: ElementRef; @ViewChild('templateTemplate') templateTemplate: ElementRef; @ViewChild('inBtnGroup') inBtnGroup: ElementRef; - @ViewChild('iconTemplate') iconTemplate: ElementRef; + @ViewChild('iconTemplate') iconTemplate: ElementRef; } @Component({ diff --git a/components/popover/nz-popover.spec.ts b/components/popover/nz-popover.spec.ts index a9e422de730..b13664312ba 100644 --- a/components/popover/nz-popover.spec.ts +++ b/components/popover/nz-popover.spec.ts @@ -1,6 +1,6 @@ import { OverlayContainer } from '@angular/cdk/overlay'; import { Component, ElementRef, ViewChild } from '@angular/core'; -import { fakeAsync, inject, tick, TestBed } from '@angular/core/testing'; +import { fakeAsync, inject, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { dispatchMouseEvent } from '../core/testing'; @@ -12,8 +12,6 @@ import { NzPopoverModule } from './nz-popover.module'; describe('NzPopover', () => { let overlayContainer: OverlayContainer; let overlayContainerElement: HTMLElement; - let fixture; - let component; beforeEach(fakeAsync(() => { TestBed.configureTestingModule({ @@ -34,6 +32,9 @@ describe('NzPopover', () => { }); describe('should not bring break changes', () => { + let fixture: ComponentFixture; + let component: NzPopoverTestWrapperComponent; + beforeEach(() => { fixture = TestBed.createComponent(NzPopoverTestWrapperComponent); component = fixture.componentInstance; @@ -120,6 +121,9 @@ describe('NzPopover', () => { })); }); describe('should support directive usage', () => { + let fixture: ComponentFixture; + let component: NzPopoverTestNewComponent; + beforeEach(() => { fixture = TestBed.createComponent(NzPopoverTestNewComponent); component = fixture.componentInstance; diff --git a/components/progress/demo/format.ts b/components/progress/demo/format.ts index c017dd473db..514246384f0 100644 --- a/components/progress/demo/format.ts +++ b/components/progress/demo/format.ts @@ -17,6 +17,6 @@ import {Component} from '@angular/core'; ] }) export class NzDemoProgressFormatComponent { - formatOne = percent => `${percent} Days`; + formatOne = (percent: number) => `${percent} Days`; formatTwo = () => `Done`; } diff --git a/components/progress/nz-progress.component.html b/components/progress/nz-progress.component.html index 3c99c43fac5..15edad37dba 100644 --- a/components/progress/nz-progress.component.html +++ b/components/progress/nz-progress.component.html @@ -2,7 +2,7 @@ - + {{ nzFormat(nzPercent) }} diff --git a/components/progress/nz-progress.component.ts b/components/progress/nz-progress.component.ts index bf290026491..993c1c2aaff 100644 --- a/components/progress/nz-progress.component.ts +++ b/components/progress/nz-progress.component.ts @@ -3,6 +3,7 @@ import { Input, OnInit } from '@angular/core'; +import { ThemeType } from '@ant-design/icons-angular'; export type NzProgressGapPositionType = 'top' | 'bottom' | 'left' | 'right'; export type NzProgressStatusType = 'success' | 'exception' | 'active' | 'normal'; @@ -29,14 +30,14 @@ export class NzProgressComponent implements OnInit { trailPathStyle: { [ key: string ]: string }; strokePathStyle: { [ key: string ]: string }; pathString: string; - icon; - iconTheme; + icon: string; + iconTheme: ThemeType; isStatusSet = false; isStrokeWidthSet = false; isFormatSet = false; isGapDegreeSet = false; isGapPositionSet = false; - statusColorMap = { + statusColorMap: { [ key: string ]: string } = { normal : '#108ee9', exception: '#ff5500', success : '#87d068' diff --git a/components/progress/nz-progress.spec.ts b/components/progress/nz-progress.spec.ts index 637bd599dbd..a937ee27540 100644 --- a/components/progress/nz-progress.spec.ts +++ b/components/progress/nz-progress.spec.ts @@ -1,8 +1,8 @@ -import { Component } from '@angular/core'; -import { fakeAsync, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; -import { NzProgressComponent } from './nz-progress.component'; +import { NzProgressComponent, NzProgressGapPositionType } from './nz-progress.component'; import { NzProgressModule } from './nz-progress.module'; describe('progress', () => { @@ -14,9 +14,10 @@ describe('progress', () => { TestBed.compileComponents(); })); describe('progress line', () => { - let fixture; - let testComponent; - let progress; + let fixture: ComponentFixture; + let testComponent: NzTestProgressLineComponent; + let progress: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestProgressLineComponent); fixture.detectChanges(); @@ -54,7 +55,7 @@ describe('progress', () => { expect(progress.nativeElement.querySelector('.ant-progress-success-bg').style.height).toBe('8px'); }); it('should format work', () => { - testComponent.format = (percent) => `${percent} percent`; + testComponent.format = (percent: number) => `${percent} percent`; fixture.detectChanges(); expect(progress.nativeElement.querySelector('.ant-progress-text').innerText.trim()).toBe('0 percent'); testComponent.percent = 100; @@ -118,9 +119,9 @@ describe('progress', () => { }); }); describe('progress dashboard', () => { - let fixture; - let testComponent; - let progress; + let fixture: ComponentFixture; + let testComponent: NzTestProgressDashBoardComponent; + let progress: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestProgressDashBoardComponent); fixture.detectChanges(); @@ -132,7 +133,7 @@ describe('progress', () => { expect(progress.nativeElement.firstElementChild.className).toBe('ant-progress ant-progress-status-normal ant-progress-show-info ant-progress-circle'); }); it('should format work', () => { - testComponent.format = (percent) => `${percent} percent`; + testComponent.format = (percent: number) => `${percent} percent`; fixture.detectChanges(); expect(progress.nativeElement.querySelector('.ant-progress-text').innerText.trim()).toBe('0 percent'); testComponent.percent = 100; @@ -182,9 +183,10 @@ describe('progress', () => { }); }); describe('progress circle', () => { - let fixture; - let testComponent; - let progress; + let fixture: ComponentFixture; + let testComponent: NzTestProgressCircleComponent; + let progress: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestProgressCircleComponent); fixture.detectChanges(); @@ -252,15 +254,15 @@ describe('progress', () => { ` }) export class NzTestProgressLineComponent { - size; - status; - format; - strokeWidth; + size: string; + status: string; + format: (percent: number) => string; + strokeWidth: number; percent = 0; successPercent = 0; showInfo = true; strokeLinecap = 'round'; - strokeColor; + strokeColor: string; } @Component({ @@ -279,11 +281,10 @@ export class NzTestProgressLineComponent { ` }) export class NzTestProgressDashBoardComponent { - status; - format; - strokeWidth; + status: string; + format: (percent: number) => string; + strokeWidth: number; percent = 0; - successPercent = 0; showInfo = true; width = 132; strokeLinecap = 'round'; @@ -302,8 +303,8 @@ export class NzTestProgressDashBoardComponent { ` }) export class NzTestProgressCircleComponent { - gapDegree; - gapPosition; + gapDegree: number; + gapPosition: NzProgressGapPositionType; strokeLinecap = 'round'; - strokeColor; + strokeColor: string; } diff --git a/components/radio/nz-radio.spec.ts b/components/radio/nz-radio.spec.ts index e8f63c3affd..05743e40851 100644 --- a/components/radio/nz-radio.spec.ts +++ b/components/radio/nz-radio.spec.ts @@ -1,5 +1,5 @@ -import { Component, OnInit, ViewChild } from '@angular/core'; -import { fakeAsync, flush, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, OnInit, ViewChild } from '@angular/core'; +import { fakeAsync, flush, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule, FormBuilder, FormGroup, ReactiveFormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; @@ -17,9 +17,10 @@ describe('radio', () => { TestBed.compileComponents(); })); describe('single radio basic', () => { - let fixture; - let testComponent; - let radio; + let fixture: ComponentFixture; + let testComponent: NzTestRadioSingleComponent; + let radio: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestRadioSingleComponent); fixture.detectChanges(); @@ -85,8 +86,9 @@ describe('radio', () => { }); }); describe('single radio button', () => { - let fixture; - let radio; + let fixture: ComponentFixture; + let radio: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestRadioButtonComponent); fixture.detectChanges(); @@ -99,11 +101,13 @@ describe('radio', () => { expect(radio.nativeElement.firstElementChild.lastElementChild.classList).toContain('ant-radio-button-inner'); }); }); + describe('radio group', () => { - let fixture; - let testComponent; - let radios; - let radioGroup; + let fixture: ComponentFixture; + let testComponent: NzTestRadioGroupComponent; + let radios: DebugElement[]; + let radioGroup: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestRadioGroupComponent); fixture.detectChanges(); @@ -158,9 +162,9 @@ describe('radio', () => { })); }); describe('radio group disabled', () => { - let fixture; - let testComponent; - let radios; + let fixture: ComponentFixture; + let testComponent: NzTestRadioGroupDisabledComponent; + let radios: DebugElement[]; beforeEach(() => { fixture = TestBed.createComponent(NzTestRadioGroupDisabledComponent); fixture.detectChanges(); @@ -195,8 +199,8 @@ describe('radio', () => { })); }); describe('radio group solid', () => { - let fixture; - let radioGroup; + let fixture: ComponentFixture; + let radioGroup: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestRadioGroupSolidComponent); fixture.detectChanges(); @@ -208,10 +212,10 @@ describe('radio', () => { }); }); describe('radio form', () => { - let fixture; - let testComponent; - let radio; - let inputElement; + let fixture: ComponentFixture; + let testComponent: NzTestRadioFormComponent; + let radio: DebugElement; + let inputElement: HTMLElement; beforeEach(fakeAsync(() => { fixture = TestBed.createComponent(NzTestRadioFormComponent); fixture.detectChanges(); @@ -229,27 +233,28 @@ describe('radio', () => { })); it('should set disabled work', fakeAsync(() => { flush(); - expect(testComponent.formGroup.get('radio').value).toBe(false); + expect(testComponent.formGroup.get('radio')!.value).toBe(false); inputElement.click(); fixture.detectChanges(); - expect(testComponent.formGroup.get('radio').value).toBe(true); + expect(testComponent.formGroup.get('radio')!.value).toBe(true); fixture.detectChanges(); flush(); fixture.detectChanges(); - testComponent.formGroup.get('radio').setValue(false); + testComponent.formGroup.get('radio')!.setValue(false); testComponent.disable(); fixture.detectChanges(); flush(); fixture.detectChanges(); inputElement.click(); fixture.detectChanges(); - expect(testComponent.formGroup.get('radio').value).toBe(false); + expect(testComponent.formGroup.get('radio')!.value).toBe(false); })); }); describe('radio group form', () => { - let fixture; - let testComponent; - let radios; + let fixture: ComponentFixture; + let testComponent: NzTestRadioGroupFormComponent; + let radios: DebugElement[]; + beforeEach(fakeAsync(() => { fixture = TestBed.createComponent(NzTestRadioGroupFormComponent); fixture.detectChanges(); @@ -266,10 +271,10 @@ describe('radio', () => { })); it('should set disabled work', fakeAsync(() => { flush(); - expect(testComponent.formGroup.get('radioGroup').value).toBe('B'); + expect(testComponent.formGroup.get('radioGroup')!.value).toBe('B'); radios[ 0 ].nativeElement.click(); fixture.detectChanges(); - expect(testComponent.formGroup.get('radioGroup').value).toBe('A'); + expect(testComponent.formGroup.get('radioGroup')!.value).toBe('A'); testComponent.disable(); fixture.detectChanges(); flush(); @@ -278,7 +283,7 @@ describe('radio', () => { fixture.detectChanges(); flush(); fixture.detectChanges(); - expect(testComponent.formGroup.get('radioGroup').value).toBe('A'); + expect(testComponent.formGroup.get('radioGroup')!.value).toBe('A'); })); }); describe('radio group disable form', () => { @@ -294,7 +299,8 @@ describe('radio', () => { @Component({ selector: 'nz-test-radio-single', template: ` - ` + ` }) export class NzTestRadioSingleComponent { @ViewChild(NzRadioComponent) nzRadioComponent: NzRadioComponent; @@ -315,7 +321,8 @@ export class NzTestRadioButtonComponent { @Component({ selector: 'nz-test-radio-group', template: ` - + diff --git a/components/rate/nz-rate.spec.ts b/components/rate/nz-rate.spec.ts index 0f6ece192dc..615ce454baf 100644 --- a/components/rate/nz-rate.spec.ts +++ b/components/rate/nz-rate.spec.ts @@ -1,5 +1,5 @@ -import { Component, ViewChild } from '@angular/core'; -import { fakeAsync, flush, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, ViewChild } from '@angular/core'; +import { fakeAsync, flush, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule, FormBuilder, FormGroup, ReactiveFormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; @@ -17,10 +17,12 @@ describe('rate', () => { }); TestBed.compileComponents(); })); + describe('basic rate', () => { - let fixture; - let testComponent; - let rate; + let fixture: ComponentFixture; + let testComponent: NzTestRateBasicComponent; + let rate: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestRateBasicComponent); fixture.detectChanges(); @@ -34,12 +36,12 @@ describe('rate', () => { it('should set ngModel work', fakeAsync(() => { fixture.detectChanges(); const children = Array.prototype.slice.call(rate.nativeElement.firstElementChild.children); - expect(children.every(item => item.classList.contains('ant-rate-star-zero'))).toBe(true); + expect(children.every((item: HTMLElement) => item.classList.contains('ant-rate-star-zero'))).toBe(true); testComponent.value = 5; fixture.detectChanges(); flush(); fixture.detectChanges(); - expect(children.every(item => item.classList.contains('ant-rate-star-full'))).toBe(true); + expect(children.every((item: HTMLElement) => item.classList.contains('ant-rate-star-full'))).toBe(true); expect(testComponent.modelChange).toHaveBeenCalledTimes(0); })); it('should click work', fakeAsync(() => { @@ -192,9 +194,10 @@ describe('rate', () => { })); }); describe('rate form', () => { - let fixture; - let testComponent; - let rate; + let fixture: ComponentFixture; + let testComponent: NzTestRateFormComponent; + let rate: DebugElement; + beforeEach(fakeAsync(() => { fixture = TestBed.createComponent(NzTestRateFormComponent); fixture.detectChanges(); @@ -211,21 +214,21 @@ describe('rate', () => { })); it('should set disabled work', fakeAsync(() => { flush(); - expect(testComponent.formGroup.get('rate').value).toBe(1); - rate.nativeElement.firstElementChild.children[3].firstElementChild.firstElementChild.click(); + expect(testComponent.formGroup.get('rate')!.value).toBe(1); + rate.nativeElement.firstElementChild.children[ 3 ].firstElementChild.firstElementChild.click(); fixture.detectChanges(); - expect(testComponent.formGroup.get('rate').value).toBe(4); + expect(testComponent.formGroup.get('rate')!.value).toBe(4); fixture.detectChanges(); flush(); fixture.detectChanges(); - testComponent.formGroup.get('rate').setValue(2); + testComponent.formGroup.get('rate')!.setValue(2); testComponent.disable(); fixture.detectChanges(); flush(); fixture.detectChanges(); - rate.nativeElement.firstElementChild.children[3].firstElementChild.firstElementChild.click(); + rate.nativeElement.firstElementChild.children[ 3 ].firstElementChild.firstElementChild.click(); fixture.detectChanges(); - expect(testComponent.formGroup.get('rate').value).toBe(2); + expect(testComponent.formGroup.get('rate')!.value).toBe(2); })); }); }); diff --git a/components/select/demo/coordinate.ts b/components/select/demo/coordinate.ts index a947f9920b8..3899994c2bc 100644 --- a/components/select/demo/coordinate.ts +++ b/components/select/demo/coordinate.ts @@ -24,7 +24,7 @@ export class NzDemoSelectCoordinateComponent { selectedProvince = 'Zhejiang'; selectedCity = 'Hangzhou'; provinceData = [ 'Zhejiang', 'Jiangsu' ]; - cityData = { + cityData: { [ place: string]: string[] } = { Zhejiang: [ 'Hangzhou', 'Ningbo', 'Wenzhou' ], Jiangsu : [ 'Nanjing', 'Suzhou', 'Zhenjiang' ] }; diff --git a/components/select/demo/custom-content.ts b/components/select/demo/custom-content.ts index 1484a45649c..7b42ad2cf81 100644 --- a/components/select/demo/custom-content.ts +++ b/components/select/demo/custom-content.ts @@ -11,5 +11,5 @@ import { Component } from '@angular/core'; ` }) export class NzDemoSelectCustomContentComponent { - selectedOS; + selectedOS = ''; } diff --git a/components/select/demo/scroll-load.ts b/components/select/demo/scroll-load.ts index 997b60fe003..008785bb3ed 100644 --- a/components/select/demo/scroll-load.ts +++ b/components/select/demo/scroll-load.ts @@ -22,12 +22,13 @@ import { map } from 'rxjs/operators'; export class NzDemoSelectScrollLoadComponent implements OnInit { randomUserUrl = 'https://api.randomuser.me/?results=10'; optionList: string[] = []; - selectedUser; + selectedUser = ''; isLoading = false; - // tslint:disable-next-line:no-any + // tslint:disable:no-any getRandomNameList: Observable = this.http.get(`${this.randomUserUrl}`).pipe(map((res: any) => res.results)).pipe(map((list: any) => { - return list.map(item => `${item.name.first}`); + return list.map((item: any) => `${item.name.first}`); })); + // tslint:enable:no-any loadMore(): void { this.isLoading = true; diff --git a/components/select/demo/search-box.ts b/components/select/demo/search-box.ts index eaa4714f294..6f562c24056 100644 --- a/components/select/demo/search-box.ts +++ b/components/select/demo/search-box.ts @@ -21,7 +21,7 @@ import { Component } from '@angular/core'; ` }) export class NzDemoSelectSearchBoxComponent { - selectedValue; + selectedValue = ''; listOfOption: Array<{ value: string, text: string }> = []; nzFilterOption = () => true; diff --git a/components/select/demo/search.ts b/components/select/demo/search.ts index 5c61c11d41c..c55397c5113 100644 --- a/components/select/demo/search.ts +++ b/components/select/demo/search.ts @@ -11,5 +11,5 @@ import { Component } from '@angular/core'; ` }) export class NzDemoSelectSearchComponent { - selectedValue; + selectedValue = ''; } diff --git a/components/select/demo/select-users.ts b/components/select/demo/select-users.ts index beb443c2984..fb9ced183b6 100644 --- a/components/select/demo/select-users.ts +++ b/components/select/demo/select-users.ts @@ -25,7 +25,7 @@ export class NzDemoSelectSelectUsersComponent implements OnInit { randomUserUrl = 'https://api.randomuser.me/?results=5'; searchChange$ = new BehaviorSubject(''); optionList: string[] = []; - selectedUser; + selectedUser = ''; isLoading = false; onSearch(value: string): void { @@ -39,7 +39,7 @@ export class NzDemoSelectSelectUsersComponent implements OnInit { ngOnInit(): void { // tslint:disable-next-line:no-any const getRandomNameList = (name: string) => this.http.get(`${this.randomUserUrl}`).pipe(map((res: any) => res.results)).pipe(map((list: any) => { - return list.map(item => `${item.name.first} ${name}`); + return list.map((item: any) => `${item.name.first} ${name}`); })); const optionList$: Observable = this.searchChange$.asObservable().pipe(debounceTime(500)).pipe(switchMap(getRandomNameList)); optionList$.subscribe(data => { diff --git a/components/select/nz-option-container.component.ts b/components/select/nz-option-container.component.ts index ee9fcedc840..1ccf2fb14e0 100644 --- a/components/select/nz-option-container.component.ts +++ b/components/select/nz-option-container.component.ts @@ -44,11 +44,11 @@ export class NzOptionContainerComponent implements OnDestroy, OnInit { const targetOption = this.listOfNzOptionLiComponent.find( o => this.nzSelectService.compareWith(o.nzOption.nzValue, option.nzValue) ); - /* tslint:disable-next-line:no-string-literal */ - if (targetOption && targetOption.el && targetOption.el[ 'scrollIntoViewIfNeeded' ]) { - /* tslint:disable-next-line:no-string-literal */ - targetOption.el[ 'scrollIntoViewIfNeeded' ](false); + /* tslint:disable:no-any */ + if (targetOption && targetOption.el && (targetOption.el as any).scrollIntoViewIfNeeded) { + (targetOption.el as any).scrollIntoViewIfNeeded(false); } + /* tslint:enable:no-any */ } }); } diff --git a/components/select/nz-option-container.spec.ts b/components/select/nz-option-container.spec.ts index cbd839fc3c1..74e3e6a400a 100644 --- a/components/select/nz-option-container.spec.ts +++ b/components/select/nz-option-container.spec.ts @@ -1,5 +1,5 @@ -import { Component, QueryList, ViewEncapsulation } from '@angular/core'; -import { fakeAsync, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, QueryList, ViewEncapsulation } from '@angular/core'; +import { fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { ReplaySubject, Subject } from 'rxjs'; @@ -11,7 +11,7 @@ import { defaultFilterOption } from './nz-option.pipe'; import { NzSelectModule } from './nz-select.module'; import { NzSelectService } from './nz-select.service'; -export const createListOfOption = (count, prefix = 'option') => { +export const createListOfOption = (count: number, prefix = 'option') => { const list: NzOptionComponent[] = []; for (let i = 0; i < count; i++) { const option = new NzOptionComponent(); @@ -21,7 +21,8 @@ export const createListOfOption = (count, prefix = 'option') => { } return list; }; -export const createListOfGroupOption = (groupCount, optionCount) => { + +export const createListOfGroupOption = (groupCount: number, optionCount: number) => { const list: NzOptionGroupComponent[] = []; for (let i = 0; i < groupCount; i++) { const queryList = new QueryList(); @@ -56,9 +57,10 @@ describe('nz-select option container', () => { TestBed.compileComponents(); })); describe('default', () => { - let fixture; - let testComponent; - let oc; + let fixture: ComponentFixture; + let testComponent: NzOptionContainerSpecComponent; + let oc: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzOptionContainerSpecComponent); fixture.detectChanges(); @@ -90,12 +92,13 @@ describe('nz-select option container', () => { fixture.detectChanges(); expect(checkSpy).toHaveBeenCalledTimes(0); const nzSelectService = fixture.debugElement.injector.get(NzSelectService); - nzSelectService.check$.next(); + // TODO: observable does not have next method. + (nzSelectService.check$ as any).next(); // tslint:disable-line:no-any fixture.detectChanges(); expect(checkSpy).toHaveBeenCalledTimes(1); testComponent.destroy = true; fixture.detectChanges(); - nzSelectService.check$.next(); + (nzSelectService.check$ as any).next(); // tslint:disable-line:no-any fixture.detectChanges(); expect(checkSpy).toHaveBeenCalledTimes(1); }); @@ -105,10 +108,10 @@ describe('nz-select option container', () => { @Component({ template : `
    + *ngIf="!destroy" + [nzMenuItemSelectedIcon]="iconTemplate" + [nzNotFoundContent]="notFoundContent" + (nzScrollToBottom)="scrollToBottom($event)">
    icon `, diff --git a/components/select/nz-option-li.spec.ts b/components/select/nz-option-li.spec.ts index f2822f71783..003b47ebd63 100644 --- a/components/select/nz-option-li.spec.ts +++ b/components/select/nz-option-li.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { fakeAsync, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { ReplaySubject, Subject } from 'rxjs'; import { dispatchFakeEvent } from '../core/testing'; @@ -24,11 +24,11 @@ describe('select option li', () => { TestBed.compileComponents(); })); describe('default', () => { - let fixture; - let testComponent; - let li; - let liComponent; - let nzSelectService; + let fixture: ComponentFixture; + let testComponent: NzTestSelectOptionLiComponent; + let li: DebugElement; + let liComponent: NzOptionLiComponent; + let nzSelectService: NzSelectService; beforeEach(() => { fixture = TestBed.createComponent(NzTestSelectOptionLiComponent); fixture.detectChanges(); @@ -40,9 +40,11 @@ describe('select option li', () => { it('should selected work', () => { fixture.detectChanges(); expect(liComponent.selected).toBe(false); + // @ts-ignore nzSelectService.listOfSelectedValue$.next([ '01_value' ]); fixture.detectChanges(); expect(liComponent.selected).toBe(true); + // @ts-ignore nzSelectService.listOfSelectedValue$.next([ '01_label' ]); fixture.detectChanges(); expect(liComponent.selected).toBe(false); @@ -62,13 +64,16 @@ describe('select option li', () => { }); it('should destroy piped', () => { fixture.detectChanges(); + // @ts-ignore const checkSpy = spyOn(liComponent.cdr, 'markForCheck'); expect(checkSpy).toHaveBeenCalledTimes(0); + // @ts-ignore nzSelectService.listOfSelectedValue$.next([ '01_value' ]); fixture.detectChanges(); expect(checkSpy).toHaveBeenCalledTimes(1); testComponent.destroy = true; fixture.detectChanges(); + // @ts-ignore nzSelectService.listOfSelectedValue$.next([ '01_value' ]); fixture.detectChanges(); expect(checkSpy).toHaveBeenCalledTimes(1); diff --git a/components/select/nz-select-top-control.spec.ts b/components/select/nz-select-top-control.spec.ts index 1c04eab6bf4..5bda5a0a6bc 100644 --- a/components/select/nz-select-top-control.spec.ts +++ b/components/select/nz-select-top-control.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { fakeAsync, flush, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, flush, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { Subject } from 'rxjs'; @@ -38,11 +38,11 @@ describe('nz-select top control', () => { TestBed.compileComponents(); })); describe('default', () => { - let fixture; - let testComponent; - let tc; - let tcComponent; - let nzSelectService; + let fixture: ComponentFixture; + let testComponent: NzTestSelectTopControlComponent; + let tc: DebugElement; + let tcComponent: NzSelectTopControlComponent; + let nzSelectService: NzSelectService; beforeEach(() => { fixture = TestBed.createComponent(NzTestSelectTopControlComponent); fixture.detectChanges(); @@ -99,6 +99,7 @@ describe('nz-select top control', () => { expect(tcComponent.selectedValueStyle.opacity).toBe('1'); tcComponent.nzShowSearch = true; tcComponent.nzOpen = true; + // @ts-ignore tcComponent.inputValue = true; tcComponent.isComposing = true; fixture.detectChanges(); @@ -106,6 +107,7 @@ describe('nz-select top control', () => { expect(tcComponent.selectedValueStyle.opacity).toBe('1'); tcComponent.nzShowSearch = true; tcComponent.nzOpen = true; + // @ts-ignore tcComponent.inputValue = true; tcComponent.isComposing = false; fixture.detectChanges(); @@ -113,6 +115,7 @@ describe('nz-select top control', () => { expect(tcComponent.selectedValueStyle.opacity).toBe('1'); tcComponent.nzShowSearch = true; tcComponent.nzOpen = true; + // @ts-ignore tcComponent.inputValue = false; tcComponent.isComposing = true; fixture.detectChanges(); @@ -120,6 +123,7 @@ describe('nz-select top control', () => { expect(tcComponent.selectedValueStyle.opacity).toBe('1'); tcComponent.nzShowSearch = true; tcComponent.nzOpen = true; + // @ts-ignore tcComponent.inputValue = false; tcComponent.isComposing = false; fixture.detectChanges(); @@ -129,23 +133,28 @@ describe('nz-select top control', () => { it('should open focus', () => { fixture.detectChanges(); expect(tc.nativeElement.querySelector('.ant-select-search__field') === document.activeElement).toBeFalsy(); + // @ts-ignore nzSelectService.open$.next(false); fixture.detectChanges(); expect(tc.nativeElement.querySelector('.ant-select-search__field') === document.activeElement).toBeFalsy(); + // @ts-ignore nzSelectService.open$.next(true); fixture.detectChanges(); expect(tc.nativeElement.querySelector('.ant-select-search__field') === document.activeElement).toBeTruthy(); }); it('should destroy piped', () => { fixture.detectChanges(); + // @ts-ignore const checkSpy = spyOn(tcComponent.cdr, 'markForCheck'); fixture.detectChanges(); expect(checkSpy).toHaveBeenCalledTimes(0); + // @ts-ignore nzSelectService.check$.next(); fixture.detectChanges(); expect(checkSpy).toHaveBeenCalledTimes(1); testComponent.destroy = true; fixture.detectChanges(); + // @ts-ignore nzSelectService.check$.next(); fixture.detectChanges(); expect(checkSpy).toHaveBeenCalledTimes(1); diff --git a/components/select/nz-select-unselectable.spec.ts b/components/select/nz-select-unselectable.spec.ts index 20683757bb2..3d2d593bd2f 100644 --- a/components/select/nz-select-unselectable.spec.ts +++ b/components/select/nz-select-unselectable.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { fakeAsync, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzSelectUnselectableDirective } from './nz-select-unselectable.directive'; @@ -12,8 +12,8 @@ describe('select unselectable', () => { TestBed.compileComponents(); })); describe('basic select unselectable', () => { - let fixture; - let unselectable; + let fixture: ComponentFixture; + let unselectable: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestSelectUnselectableComponent); fixture.detectChanges(); diff --git a/components/select/nz-select.component.spec.ts b/components/select/nz-select.component.spec.ts index ddc257a8629..667b5d7c06c 100644 --- a/components/select/nz-select.component.spec.ts +++ b/components/select/nz-select.component.spec.ts @@ -1,6 +1,6 @@ import { DOWN_ARROW, ENTER, ESCAPE, SPACE, TAB, UP_ARROW } from '@angular/cdk/keycodes'; -import { Component } from '@angular/core'; -import { async, fakeAsync, flush, inject, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { async, fakeAsync, flush, inject, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule, FormBuilder, FormGroup, ReactiveFormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; @@ -31,10 +31,10 @@ describe('nz-select component', () => { overlayContainer.ngOnDestroy(); })); describe('default', () => { - let fixture; - let testComponent; - let select; - let selectComponent; + let fixture: ComponentFixture; + let testComponent: NzTestSelectDefaultComponent; + let select: DebugElement; + let selectComponent: NzSelectComponent; beforeEach(() => { fixture = TestBed.createComponent(NzTestSelectDefaultComponent); fixture.detectChanges(); @@ -232,10 +232,11 @@ describe('nz-select component', () => { })); }); describe('tags', () => { - let fixture; - let testComponent; - let select; - let selectComponent; + let fixture: ComponentFixture; + let testComponent: NzTestSelectTagsComponent; + let select: DebugElement; + let selectComponent: NzSelectComponent; + beforeEach(() => { fixture = TestBed.createComponent(NzTestSelectTagsComponent); fixture.detectChanges(); @@ -274,10 +275,12 @@ describe('nz-select component', () => { })); }); + describe('form', () => { - let fixture; - let testComponent; - let select; + let fixture: ComponentFixture; + let testComponent: NzTestSelectFormComponent; + let select: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestSelectFormComponent); fixture.detectChanges(); @@ -327,18 +330,21 @@ describe('nz-select component', () => { expect(testComponent.formGroup.value.select).toBe('jack'); })); }); + describe('option change', () => { - let fixture; - let testComponent; - let select; - let selectComponent; + let fixture: ComponentFixture; + let testComponent: NzTestOptionChangeComponent; + let select: DebugElement; + let selectComponent: NzSelectComponent; + beforeEach(() => { fixture = TestBed.createComponent(NzTestOptionChangeComponent); fixture.detectChanges(); testComponent = fixture.debugElement.componentInstance; select = fixture.debugElement.query(By.directive(NzSelectComponent)); - selectComponent = select.injector.get(NzSelectComponent); + selectComponent = select.injector.get(NzSelectComponent)!; }); + it('should option change work', () => { fixture.detectChanges(); const changeSpy = spyOn(selectComponent.nzSelectService, 'updateTemplateOption'); @@ -393,7 +399,7 @@ export class NzTestSelectDefaultComponent { size = 'default'; mode = 'default'; autoFocus = false; - compareWith = (o1, o2) => o1 === o2; + compareWith = (o1: any, o2: any) => o1 === o2; // tslint:disable-line:no-any disabled = false; onSearch = jasmine.createSpy('on search'); showSearch = false; diff --git a/components/skeleton/nz-skeleton.spec.ts b/components/skeleton/nz-skeleton.spec.ts index 77f30513300..6d0a3058ab9 100644 --- a/components/skeleton/nz-skeleton.spec.ts +++ b/components/skeleton/nz-skeleton.spec.ts @@ -2,6 +2,7 @@ import { Component, DebugElement } from '@angular/core'; import { ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzSkeletonModule } from './nz-skeleton.module'; +import { NzSkeletonAvatar, NzSkeletonParagraph, NzSkeletonTitle } from './nz-skeleton.type'; describe('skeleton', () => { let fixture: ComponentFixture; @@ -70,14 +71,14 @@ describe('skeleton', () => { }); for (const type of ['square', 'circle']) { it(`should customize shape ${type} work`, () => { - testComp.nzAvatar = { shape: type }; + testComp.nzAvatar = { shape: type } as NzSkeletonAvatar; fixture.detectChanges(); expect(dl.query(By.css(`.ant-skeleton-avatar-${type}`)) !== null).toBe(true); }); } for (const type of [{ size: 'large', cls: 'lg' }, { size: 'small', cls: 'sm' }]) { it(`should customize size ${type.size} work`, () => { - testComp.nzAvatar = { size: type.size }; + testComp.nzAvatar = { size: type.size } as NzSkeletonAvatar; fixture.detectChanges(); expect(dl.query(By.css(`.ant-skeleton-avatar-${type.cls}`)) !== null).toBe(true); }); @@ -143,8 +144,8 @@ describe('skeleton', () => { ` }) export class NzTestSkeletonComponent { - nzActive; - nzAvatar; - nzTitle; - nzParagraph; + nzActive: boolean; + nzAvatar: NzSkeletonAvatar | boolean; + nzTitle: NzSkeletonTitle | boolean; + nzParagraph: NzSkeletonParagraph | boolean ; } diff --git a/components/slider/demo/event.ts b/components/slider/demo/event.ts index 188ae2b9b4a..df0c125ea5c 100644 --- a/components/slider/demo/event.ts +++ b/components/slider/demo/event.ts @@ -11,11 +11,11 @@ export class NzDemoSliderEventComponent { singleValue = 30; rangeValue = [ 20, 50 ]; - onChange(value) { + onChange(value: number): void { console.log(`onChange: ${value}`); } - onAfterChange(value) { + onAfterChange(value: number): void { console.log(`onAfterChange: ${value}`); } diff --git a/components/slider/demo/icon-slider.ts b/components/slider/demo/icon-slider.ts index 040596c6248..31de34d5a3e 100644 --- a/components/slider/demo/icon-slider.ts +++ b/components/slider/demo/icon-slider.ts @@ -47,17 +47,18 @@ export class NzDemoSliderIconSliderComponent implements OnInit { mid = parseFloat(((this.max - this.min) / 2).toFixed(5)); preHighLight = false; nextHighLight = false; - _sliderValue; + _sliderValue = 0; + set sliderValue(value: number) { this._sliderValue = value; this.highlightIcon(); } - get sliderValue() { + get sliderValue(): number { return this._sliderValue; } - ngOnInit() { + ngOnInit(): void { this.sliderValue = 0; } diff --git a/components/slider/demo/tip-formatter.ts b/components/slider/demo/tip-formatter.ts index fac44243784..918b2e114fb 100644 --- a/components/slider/demo/tip-formatter.ts +++ b/components/slider/demo/tip-formatter.ts @@ -8,9 +8,7 @@ import { Component } from '@angular/core'; ` }) export class NzDemoSliderTipFormatterComponent { - - formatter(value) { + formatter(value: number): string { return `${value}%`; } - } diff --git a/components/slider/nz-slider-handle.component.ts b/components/slider/nz-slider-handle.component.ts index 5623d81debf..53e3faf2c19 100644 --- a/components/slider/nz-slider-handle.component.ts +++ b/components/slider/nz-slider-handle.component.ts @@ -10,6 +10,7 @@ import { ViewEncapsulation } from '@angular/core'; import { Subscription } from 'rxjs'; +import { NGStyleInterface } from '../core/types/ng-class'; import { InputBoolean } from '../core/util/convert'; import { NzToolTipComponent } from '../tooltip/nz-tooltip.component'; @@ -39,7 +40,7 @@ export class NzSliderHandleComponent implements OnChanges, OnDestroy { @Input() @InputBoolean() nzActive = false; tooltipTitle: string; - style: object = {}; + style: NGStyleInterface = {}; private hovers_ = new Subscription(); diff --git a/components/slider/nz-slider-track.component.ts b/components/slider/nz-slider-track.component.ts index 18f5165f352..16d637aff1a 100644 --- a/components/slider/nz-slider-track.component.ts +++ b/components/slider/nz-slider-track.component.ts @@ -1,6 +1,6 @@ import { ChangeDetectionStrategy, Component, Input, OnChanges, SimpleChanges, ViewEncapsulation } from '@angular/core'; -import { InputBoolean } from '../core/util/convert'; +import { InputBoolean, InputNumber } from '../core/util/convert'; export interface NzSliderTrackStyle { bottom?: string | null; @@ -18,8 +18,8 @@ export interface NzSliderTrackStyle { templateUrl : './nz-slider-track.component.html' }) export class NzSliderTrackComponent implements OnChanges { - @Input() nzOffset; - @Input() nzLength; + @Input() @InputNumber() nzOffset: number; + @Input() @InputNumber() nzLength: number; @Input() @InputBoolean() nzVertical = false; @Input() @InputBoolean() nzIncluded = false; diff --git a/components/slider/nz-slider.component.ts b/components/slider/nz-slider.component.ts index c9ac014839a..d67afc79c92 100644 --- a/components/slider/nz-slider.component.ts +++ b/components/slider/nz-slider.component.ts @@ -24,7 +24,14 @@ import { getElementOffset, silentEvent, MouseTouchObserverConfig } from '../core import { arraysEqual, shallowCopyArray } from '../core/util/array'; import { ensureNumberInRange, getPercent, getPrecision } from '../core/util/number'; -import { isValueARange, ExtendedMark, Marks, SliderHandler, SliderShowTooltip, SliderValue } from './nz-slider-definitions'; +import { + isValueARange, + ExtendedMark, + Marks, + SliderHandler, + SliderShowTooltip, + SliderValue +} from './nz-slider-definitions'; import { getValueTypeNotMatchError } from './nz-slider-error'; @Component({ @@ -62,7 +69,7 @@ export class NzSliderComponent implements ControlValueAccessor, OnInit, OnChange cacheSliderStart: number | null = null; cacheSliderLength: number | null = null; activeValueIndex: number | undefined = undefined; // Current activated handle's index ONLY for range=true - track = { offset: null, length: null }; // Track's offset and length + track: { offset: null | number, length: null | number } = { offset: null, length: null }; // Track's offset and length handles: SliderHandler[]; // Handles' offset marksArray: ExtendedMark[] | null; // "steps" in array type with more data & FILTER out the invalid mark bounds: { lower: SliderValue | null, upper: SliderValue | null } = { lower: null, upper: null }; // now for nz-slider-step @@ -167,9 +174,9 @@ export class NzSliderComponent implements ControlValueAccessor, OnInit, OnChange private setActiveValueIndex(pointerValue: number): void { const value = this.getValue(); if (isValueARange(value)) { - let minimal = null; - let gap; - let activeIndex; + let minimal: number | null = null; + let gap: number; + let activeIndex = -1; value.forEach((val, index) => { gap = Math.abs(pointerValue - val); if (minimal === null || gap < minimal!) { @@ -199,12 +206,14 @@ export class NzSliderComponent implements ControlValueAccessor, OnInit, OnChange const offset = this.getValueToOffset(value); const valueSorted = this.getValue(true); const offsetSorted = this.getValueToOffset(valueSorted); - const boundParts = this.nzRange ? valueSorted as number[] : [ 0, valueSorted ]; - const trackParts = this.nzRange ? [ offsetSorted[ 0 ], offsetSorted[ 1 ] - offsetSorted[ 0 ] ] : [ 0, offsetSorted ]; + const boundParts = isValueARange(valueSorted) ? valueSorted : [ 0, valueSorted ]; + const trackParts = isValueARange(offsetSorted) + ? [ offsetSorted[ 0 ], offsetSorted[ 1 ] - offsetSorted[ 0 ] ] + : [ 0, offsetSorted ]; this.handles.forEach((handle, index) => { - handle.offset = this.nzRange ? offset[ index ] : offset; - handle.value = this.nzRange ? value[ index ] : value || 0; + handle.offset = isValueARange(offset) ? offset[ index ] : offset; + handle.value = isValueARange(value) ? value[ index ] : value || 0; }); [ this.bounds.lower, this.bounds.upper ] = boundParts; diff --git a/components/spin/nz-spin.spec.ts b/components/spin/nz-spin.spec.ts index 64700c58b12..ad341e458e6 100644 --- a/components/spin/nz-spin.spec.ts +++ b/components/spin/nz-spin.spec.ts @@ -1,5 +1,5 @@ -import { Component, TemplateRef, ViewChild } from '@angular/core'; -import { fakeAsync, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, TemplateRef, ViewChild } from '@angular/core'; +import { fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzIconTestModule } from '../icon/nz-icon-test.module'; @@ -16,9 +16,9 @@ describe('spin', () => { TestBed.compileComponents(); })); describe('spin basic', () => { - let fixture; - let testComponent; - let spin; + let fixture: ComponentFixture; + let testComponent: NzTestSpinBasicComponent; + let spin: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestSpinBasicComponent); fixture.detectChanges(); @@ -123,7 +123,7 @@ export class NzTestSpinBasicComponent { size = 'default'; delay = 0; spinning = true; - indicator; - tip; + indicator: TemplateRef; + tip: string; simple = false; } diff --git a/components/statistic/nz-countdown.spec.ts b/components/statistic/nz-countdown.spec.ts index 29c1a55b214..28198411057 100644 --- a/components/statistic/nz-countdown.spec.ts +++ b/components/statistic/nz-countdown.spec.ts @@ -1,14 +1,14 @@ import { CommonModule } from '@angular/common'; -import { Component, TemplateRef, ViewChild } from '@angular/core'; -import { fakeAsync, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, TemplateRef, ViewChild } from '@angular/core'; +import { fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzCountdownComponent } from './nz-countdown.component'; import { NzStatisticModule } from './nz-statistic.module'; describe('nz-countdown', () => { - let fixture; - let testComponent; - let countdownEl; + let fixture: ComponentFixture; + let testComponent: NzTestCountdownComponent; + let countdownEl: DebugElement; beforeEach(() => { TestBed.configureTestingModule({ @@ -75,9 +75,9 @@ export class NzTestCountdownComponent { @ViewChild(NzCountdownComponent) countdown: NzCountdownComponent; @ViewChild('tpl') tpl: TemplateRef; - format; - value; - template; + format: string; + value: number; + template: TemplateRef; resetTimerWithFormat(format: string): void { this.format = format; diff --git a/components/statistic/nz-statistic-number.spec.ts b/components/statistic/nz-statistic-number.spec.ts index 75aca64de4a..83120fd5dab 100644 --- a/components/statistic/nz-statistic-number.spec.ts +++ b/components/statistic/nz-statistic-number.spec.ts @@ -1,14 +1,14 @@ import { CommonModule } from '@angular/common'; -import { Component, TemplateRef, ViewChild } from '@angular/core'; -import { TestBed } from '@angular/core/testing'; +import { Component, DebugElement, TemplateRef, ViewChild } from '@angular/core'; +import { ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzStatisticNumberComponent } from './nz-statistic-number.component'; import { NzStatisticModule } from './nz-statistic.module'; describe('nz-number', () => { - let fixture; - let testComponent; - let numberEl; + let fixture: ComponentFixture; + let testComponent: NzTestNumberComponent; + let numberEl: DebugElement; beforeEach(() => { TestBed.configureTestingModule({ @@ -51,9 +51,7 @@ describe('nz-number', () => { @Component({ selector: 'nz-test-number-component', template: ` - + It's {{ value }} ` }) @@ -61,5 +59,5 @@ export class NzTestNumberComponent { @ViewChild('tpl') tpl: TemplateRef; value = 1; - template; + template: TemplateRef; } diff --git a/components/statistic/nz-statistic.spec.ts b/components/statistic/nz-statistic.spec.ts index 9a213568559..5e4446bfe7a 100644 --- a/components/statistic/nz-statistic.spec.ts +++ b/components/statistic/nz-statistic.spec.ts @@ -1,14 +1,14 @@ import { CommonModule } from '@angular/common'; -import { Component } from '@angular/core'; -import { TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzStatisticComponent } from './nz-statistic.component'; import { NzStatisticModule } from './nz-statistic.module'; describe('nz-statistic', () => { - let fixture; - let testComponent; - let statisticEl; + let fixture: ComponentFixture; + let testComponent: NzTestStatisticComponent; + let statisticEl: DebugElement; beforeEach(() => { TestBed.configureTestingModule({ diff --git a/components/steps/nz-steps.spec.ts b/components/steps/nz-steps.spec.ts index 77f4e3ec2da..27b7ef75545 100644 --- a/components/steps/nz-steps.spec.ts +++ b/components/steps/nz-steps.spec.ts @@ -1,5 +1,5 @@ -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, TemplateRef, ViewChild } from '@angular/core'; -import { async, fakeAsync, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, TemplateRef, ViewChild } from '@angular/core'; +import { async, fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzIconTestModule } from '../icon/nz-icon-test.module'; @@ -17,10 +17,11 @@ describe('steps', () => { TestBed.compileComponents(); })); describe('outer steps', () => { - let fixture; - let testComponent; - let outStep; - let innerSteps; + let fixture: ComponentFixture; + let testComponent: NzTestOuterStepsComponent; + let outStep: DebugElement; + let innerSteps: DebugElement[]; + beforeEach(() => { fixture = TestBed.createComponent(NzTestOuterStepsComponent); testComponent = fixture.debugElement.componentInstance; @@ -171,9 +172,10 @@ describe('steps', () => { })); }); describe('inner step string', () => { - let fixture; - let testComponent; - let innerSteps; + let fixture: ComponentFixture; + let testComponent: NzTestInnerStepStringComponent; + let innerSteps: DebugElement[]; + beforeEach(() => { fixture = TestBed.createComponent(NzTestInnerStepStringComponent); testComponent = fixture.debugElement.componentInstance; @@ -210,8 +212,9 @@ describe('steps', () => { }); }); describe('inner step template', () => { - let fixture; - let innerSteps; + let fixture: ComponentFixture; + let innerSteps: DebugElement[]; + beforeEach(() => { fixture = TestBed.createComponent(NzTestInnerStepTemplateComponent); innerSteps = fixture.debugElement.queryAll(By.directive(NzStepComponent)); @@ -251,7 +254,8 @@ describe('steps', () => { @Component({ selector: 'nz-test-outer-steps', template: ` - + @@ -270,7 +274,7 @@ export class NzTestOuterStepsComponent { labelPlacement = 'horizontal'; size = 'default'; status = 'process'; - progressDot = false; + progressDot: boolean | TemplateRef = false; startIndex = 0; constructor (public cdr: ChangeDetectorRef) {} } diff --git a/components/switch/nz-switch.spec.ts b/components/switch/nz-switch.spec.ts index 4fb3ed79f51..30a06a25500 100644 --- a/components/switch/nz-switch.spec.ts +++ b/components/switch/nz-switch.spec.ts @@ -1,6 +1,6 @@ import { ENTER, LEFT_ARROW, RIGHT_ARROW, SPACE } from '@angular/cdk/keycodes'; -import { Component, TemplateRef, ViewChild } from '@angular/core'; -import { fakeAsync, flush, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, TemplateRef, ViewChild } from '@angular/core'; +import { fakeAsync, flush, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule, FormBuilder, FormGroup, ReactiveFormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; @@ -19,9 +19,9 @@ describe('switch', () => { TestBed.compileComponents(); })); describe('basic switch', () => { - let fixture; - let testComponent; - let switchElement; + let fixture: ComponentFixture; + let testComponent: NzTestSwitchBasicComponent; + let switchElement: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestSwitchBasicComponent); fixture.detectChanges(); @@ -166,8 +166,8 @@ describe('switch', () => { }); }); describe('template switch', () => { - let fixture; - let switchElement; + let fixture: ComponentFixture; + let switchElement: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestSwitchTemplateComponent); fixture.detectChanges(); @@ -186,9 +186,10 @@ describe('switch', () => { })); }); describe('switch form', () => { - let fixture; - let testComponent; - let switchElement; + let fixture: ComponentFixture; + let testComponent: NzTestSwitchFormComponent; + let switchElement: DebugElement; + beforeEach(fakeAsync(() => { fixture = TestBed.createComponent(NzTestSwitchFormComponent); fixture.detectChanges(); @@ -205,21 +206,21 @@ describe('switch', () => { })); it('should set disabled work', fakeAsync(() => { flush(); - expect(testComponent.formGroup.get('switchValue').value).toBe(true); + expect(testComponent.formGroup.get('switchValue')!.value).toBe(true); switchElement.nativeElement.click(); fixture.detectChanges(); - expect(testComponent.formGroup.get('switchValue').value).toBe(false); + expect(testComponent.formGroup.get('switchValue')!.value).toBe(false); fixture.detectChanges(); flush(); fixture.detectChanges(); - testComponent.formGroup.get('switchValue').setValue(true); + testComponent.formGroup.get('switchValue')!.setValue(true); testComponent.disable(); fixture.detectChanges(); flush(); fixture.detectChanges(); switchElement.nativeElement.click(); fixture.detectChanges(); - expect(testComponent.formGroup.get('switchValue').value).toBe(true); + expect(testComponent.formGroup.get('switchValue')!.value).toBe(true); })); }); }); diff --git a/components/table/demo/custom-filter-panel.ts b/components/table/demo/custom-filter-panel.ts index 29ef670e006..eadcb3b56aa 100644 --- a/components/table/demo/custom-filter-panel.ts +++ b/components/table/demo/custom-filter-panel.ts @@ -5,28 +5,29 @@ import { Component } from '@angular/core'; template: ` - - - Name - - -
    - - - -
    -     - - Age - Address - + + + Name + + +
    + + + +
    +     + + Age + Address + - - {{data.name}} - {{data.age}} - {{data.address}} - + + {{data.name}} + {{data.age}} + {{data.address}} +     `, styles : [ @@ -101,11 +102,12 @@ export class NzDemoTableCustomFilterPanelComponent { } search(): void { - const filterFunc = (item) => { + const filterFunc = (item: { name: string, age: number, address: string }) => { return (this.listOfSearchAddress.length ? this.listOfSearchAddress.some(address => item.address.indexOf(address) !== -1) : true) && (item.name.indexOf(this.searchValue) !== -1); }; - const data = this.listOfData.filter(item => filterFunc(item)); + const data = this.listOfData.filter((item: { name: string, age: number, address: string }) => filterFunc(item)); + // @ts-ignore this.listOfDisplayData = data.sort((a, b) => (this.sortValue === 'ascend') ? (a[ this.sortName! ] > b[ this.sortName! ] ? 1 : -1) : (b[ this.sortName! ] > a[ this.sortName! ] ? 1 : -1)); } } diff --git a/components/table/demo/default-filter.ts b/components/table/demo/default-filter.ts index d4d84117556..389ffa5de2b 100644 --- a/components/table/demo/default-filter.ts +++ b/components/table/demo/default-filter.ts @@ -66,10 +66,11 @@ export class NzDemoTableDefaultFilterComponent { search(): void { /** filter data **/ - const filterFunc = item => (this.searchAddress ? item.address.indexOf(this.searchAddress) !== -1 : true) && (this.listOfSearchName.length ? this.listOfSearchName.some(name => item.name.indexOf(name) !== -1) : true); + const filterFunc = (item: { name: string, age: number, address: string }) => (this.searchAddress ? item.address.indexOf(this.searchAddress) !== -1 : true) && (this.listOfSearchName.length ? this.listOfSearchName.some(name => item.name.indexOf(name) !== -1) : true); const data = this.listOfData.filter(item => filterFunc(item)); /** sort data **/ if (this.sortName && this.sortValue) { + // @ts-ignore this.listOfDisplayData = data.sort((a, b) => (this.sortValue === 'ascend') ? (a[ this.sortName! ] > b[ this.sortName! ] ? 1 : -1) : (b[ this.sortName! ] > a[ this.sortName! ] ? 1 : -1)); } else { this.listOfDisplayData = data; diff --git a/components/table/demo/edit-row.ts b/components/table/demo/edit-row.ts index c518264d5b5..dced996214b 100644 --- a/components/table/demo/edit-row.ts +++ b/components/table/demo/edit-row.ts @@ -62,7 +62,7 @@ import { Component, OnInit } from '@angular/core'; ] }) export class NzDemoTableEditRowComponent implements OnInit { - editCache = {}; + editCache: { [ key: string ]: any } = {}; listOfData: any[] = []; startEdit(id: string): void { diff --git a/components/table/demo/expand-children.ts b/components/table/demo/expand-children.ts index 56a8993dc92..4d461d3211a 100644 --- a/components/table/demo/expand-children.ts +++ b/components/table/demo/expand-children.ts @@ -15,28 +15,28 @@ export interface TreeNodeInterface { template: ` - - Name - Age - Address - + + Name + Age + Address + - - - - - {{item.name}} - - {{item.age}} - {{item.address}} - - + + + + + {{item.name}} + + {{item.age}} + {{item.address}} + + ` }) @@ -103,7 +103,7 @@ export class NzDemoTableExpandChildrenComponent implements OnInit { address: 'Sidney No. 1 Lake Park' } ]; - mapOfExpandedData = {}; + mapOfExpandedData: { [ key: string ]: TreeNodeInterface[] } = {}; collapse(array: TreeNodeInterface[], data: TreeNodeInterface, $event: boolean): void { if ($event === false) { @@ -138,7 +138,7 @@ export class NzDemoTableExpandChildrenComponent implements OnInit { return array; } - visitNode(node: TreeNodeInterface, hashMap: object, array: TreeNodeInterface[]): void { + visitNode(node: TreeNodeInterface, hashMap: { [ key: string ]: any }, array: TreeNodeInterface[]): void { if (!hashMap[ node.key ]) { hashMap[ node.key ] = true; array.push(node); diff --git a/components/table/demo/expand.ts b/components/table/demo/expand.ts index 2fcd8f661f9..8be4f8a1489 100644 --- a/components/table/demo/expand.ts +++ b/components/table/demo/expand.ts @@ -30,7 +30,7 @@ import { Component } from '@angular/core'; styles : [] }) export class NzDemoTableExpandComponent { - mapOfExpandData = {}; + mapOfExpandData: { [ key: string ]: boolean } = {}; listOfData = [ { id : 1, diff --git a/components/table/demo/grouping-columns.ts b/components/table/demo/grouping-columns.ts index 79e955de08b..32c67668832 100644 --- a/components/table/demo/grouping-columns.ts +++ b/components/table/demo/grouping-columns.ts @@ -54,7 +54,7 @@ export class NzDemoTableGroupingColumnsComponent implements OnInit { search(searchName: string[]): void { this.searchName = searchName; - const filterFunc = (item) => { + const filterFunc = (item: any) => { return this.searchName.length ? this.searchName.some(name => item.name.indexOf(name) !== -1) : true; }; const listOfData = this.listOfData.filter(item => filterFunc(item)); diff --git a/components/table/demo/head.ts b/components/table/demo/head.ts index b4663510516..3bee844fd60 100644 --- a/components/table/demo/head.ts +++ b/components/table/demo/head.ts @@ -65,10 +65,11 @@ export class NzDemoTableHeadComponent { search(): void { /** filter data **/ - const filterFunc = item => (this.searchAddress ? item.address.indexOf(this.searchAddress) !== -1 : true) && (this.listOfSearchName.length ? this.listOfSearchName.some(name => item.name.indexOf(name) !== -1) : true); + const filterFunc = (item: { name: string, age: number, address: string }) => (this.searchAddress ? item.address.indexOf(this.searchAddress) !== -1 : true) && (this.listOfSearchName.length ? this.listOfSearchName.some(name => item.name.indexOf(name) !== -1) : true); const data = this.listOfData.filter(item => filterFunc(item)); /** sort data **/ if (this.sortName && this.sortValue) { + // @ts-ignore this.listOfDisplayData = data.sort((a, b) => (this.sortValue === 'ascend') ? (a[ this.sortName! ] > b[ this.sortName! ] ? 1 : -1) : (b[ this.sortName! ] > a[ this.sortName! ] ? 1 : -1)); } else { this.listOfDisplayData = data; diff --git a/components/table/demo/reset-filter.ts b/components/table/demo/reset-filter.ts index 137e62b4c24..d3416f8e6fc 100644 --- a/components/table/demo/reset-filter.ts +++ b/components/table/demo/reset-filter.ts @@ -1,5 +1,13 @@ import { Component } from '@angular/core'; +interface Data { + name: string; + age: number; + address: string; + + [ key: string ]: any; +} + @Component({ selector: 'nz-demo-table-reset-filter', template: ` @@ -47,7 +55,7 @@ export class NzDemoTableResetFilterComponent { { text: 'London', value: 'London' }, { text: 'Sidney', value: 'Sidney' } ]; - listOfData = [ + listOfData: Data[] = [ { name : 'John Brown', age : 32, @@ -70,7 +78,7 @@ export class NzDemoTableResetFilterComponent { } ]; listOfDisplayData = [ ...this.listOfData ]; - mapOfSort = { + mapOfSort: { [ key: string ]: any } = { name : null, age : null, address: null @@ -90,8 +98,8 @@ export class NzDemoTableResetFilterComponent { search(listOfSearchName: string[], listOfSearchAddress: string[]): void { this.listOfSearchName = listOfSearchName; this.listOfSearchAddress = listOfSearchAddress; - const filterFunc = item => (this.listOfSearchAddress.length ? this.listOfSearchAddress.some(address => item.address.indexOf(address) !== -1) : true) && (this.listOfSearchName.length ? this.listOfSearchName.some(name => item.name.indexOf(name) !== -1) : true); - const listOfData = this.listOfData.filter(item => filterFunc(item)); + const filterFunc = (item: Data) => (this.listOfSearchAddress.length ? this.listOfSearchAddress.some(address => item.address.indexOf(address) !== -1) : true) && (this.listOfSearchName.length ? this.listOfSearchName.some(name => item.name.indexOf(name) !== -1) : true); + const listOfData = this.listOfData.filter((item: Data) => filterFunc(item)); if (this.sortName && this.sortValue) { this.listOfDisplayData = listOfData.sort((a, b) => (this.sortValue === 'ascend') ? (a[ this.sortName! ] > b[ this.sortName! ] ? 1 : -1) diff --git a/components/table/demo/row-selection-and-operation.ts b/components/table/demo/row-selection-and-operation.ts index f6dff6fab06..c2ab899b473 100644 --- a/components/table/demo/row-selection-and-operation.ts +++ b/components/table/demo/row-selection-and-operation.ts @@ -1,5 +1,13 @@ import { Component, OnInit } from '@angular/core'; +export interface Data { + id: number; + name: string; + age: number; + address: string; + disabled: boolean; +} + @Component({ selector: 'nz-demo-table-row-selection-and-operation', template: ` @@ -45,12 +53,12 @@ export class NzDemoTableRowSelectionAndOperationComponent implements OnInit { isAllDisplayDataChecked = false; isOperating = false; isIndeterminate = false; - listOfDisplayData: any[] = []; - listOfAllData: any[] = []; - mapOfCheckedId = {}; + listOfDisplayData: Data[] = []; + listOfAllData: Data[] = []; + mapOfCheckedId: { [ key: string ]: boolean } = {}; numberOfChecked = 0; - currentPageDataChange($event: Array<{ id: number, name: string; age: number; address: string; disabled: boolean }>): void { + currentPageDataChange($event: Data[]): void { this.listOfDisplayData = $event; this.refreshStatus(); } diff --git a/components/table/demo/row-selection-custom.ts b/components/table/demo/row-selection-custom.ts index ca91f7feff5..e13590c3e67 100644 --- a/components/table/demo/row-selection-custom.ts +++ b/components/table/demo/row-selection-custom.ts @@ -52,7 +52,7 @@ export class NzDemoTableRowSelectionCustomComponent implements OnInit { isIndeterminate = false; listOfDisplayData: any[] = []; listOfAllData: any[] = []; - mapOfCheckedId = {}; + mapOfCheckedId: { [ key: string ]: boolean } = {}; currentPageDataChange($event: Array<{ id: number, name: string; age: number; address: string}>): void { this.listOfDisplayData = $event; diff --git a/components/table/nz-table.spec.ts b/components/table/nz-table.spec.ts index 5f3f086e717..9d520b88895 100644 --- a/components/table/nz-table.spec.ts +++ b/components/table/nz-table.spec.ts @@ -1,5 +1,5 @@ -import { Component, Injector, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; -import { async, fakeAsync, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, Injector, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; +import { async, fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import en_US from '../i18n/languages/en_US'; import { NzI18nService } from '../i18n/nz-i18n.service'; @@ -8,6 +8,7 @@ import { NzTableModule } from './nz-table.module'; describe('nz-table', () => { let injector: Injector; + beforeEach(async(() => { injector = TestBed.configureTestingModule({ imports : [ NzTableModule ], @@ -15,10 +16,12 @@ describe('nz-table', () => { }); TestBed.compileComponents(); })); + describe('basic nz-table', () => { - let fixture; - let testComponent; - let table; + let fixture: ComponentFixture; + let testComponent: NzTestTableBasicComponent; + let table: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestTableBasicComponent); fixture.detectChanges(); @@ -172,7 +175,7 @@ describe('nz-table', () => { it('should fixed header work', () => { fixture.detectChanges(); expect(table.nativeElement.querySelector('.ant-table-scroll')).toBe(null); - testComponent.fixedHeader = true; + testComponent.fixHeader = true; expect(table.nativeElement.querySelector('.ant-table-scroll')).toBeDefined(); }); it('should width config', () => { @@ -210,9 +213,10 @@ describe('nz-table', () => { }); }); describe('scroll nz-table', () => { - let fixture; - let testComponent; - let table; + let fixture: ComponentFixture; + let testComponent: NzTestTableScrollComponent; + let table: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestTableScrollComponent); fixture.detectChanges(); @@ -295,13 +299,15 @@ describe('nz-table', () => { }); }); describe('double binding nz-table', () => { - let fixture; - let testComponent; + let fixture: ComponentFixture; + let testComponent: NzTableSpecCrashComponent; + beforeEach(() => { fixture = TestBed.createComponent(NzTableSpecCrashComponent); fixture.detectChanges(); testComponent = fixture.debugElement.componentInstance; }); + it('should not crash when double binding pageSize and pageIndex', () => { fixture.detectChanges(); expect(testComponent.pageIndexChange).toHaveBeenCalledTimes(0); @@ -363,7 +369,7 @@ export class NzTestTableBasicComponent implements OnInit { pageIndexChange = jasmine.createSpy('pageIndex callback'); pageSize = 10; pageSizeChange = jasmine.createSpy('pageSize callback'); - dataSet: Array<{ name: string, age: string, address: string, description: string, checked: boolean, expand: boolean }> = []; + dataSet: Array<{ name?: string, age?: string, address?: string, description?: string, checked?: boolean, expand?: boolean }> = []; noResult = ''; showSizeChanger = false; showQuickJumper = false; @@ -377,7 +383,7 @@ export class NzTestTableBasicComponent implements OnInit { fixHeader = false; simple = false; size = 'small'; - widthConfig = []; + widthConfig: string[] = []; ngOnInit(): void { for (let i = 1; i <= 20; i++) { @@ -458,20 +464,21 @@ export class NzTestTableScrollComponent implements OnInit { /** https://github.com/NG-ZORRO/ng-zorro-antd/issues/3004 **/ @Component({ template: ` - + - - ID - NAME - + + ID + NAME + - - - {{item.id}} - {{item.name}} - - + + + {{item.id}} + {{item.name}} + + ` diff --git a/components/table/nz-tbody.spec.ts b/components/table/nz-tbody.spec.ts index 88e18b389fd..8b85a1a24fa 100644 --- a/components/table/nz-tbody.spec.ts +++ b/components/table/nz-tbody.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { fakeAsync, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzMeasureScrollbarService } from '../core/services/nz-measure-scrollbar.service'; import { NzTableModule } from './nz-table.module'; @@ -15,21 +15,25 @@ describe('nz-tbody', () => { TestBed.compileComponents(); })); describe('nz-tbody in table', () => { - let fixture; - let tbody; + let fixture: ComponentFixture; + let tbody: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTbodyTestTableComponent); fixture.detectChanges(); tbody = fixture.debugElement.query(By.directive(NzTbodyDirective)); }); + it('should not add class', () => { fixture.detectChanges(); expect(tbody.nativeElement.classList).not.toContain('ant-table-tbody'); }); }); + describe('nz-tbody in nz-table', () => { - let fixture; - let tbody; + let fixture: ComponentFixture; + let tbody: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTbodyTestNzTableComponent); fixture.detectChanges(); diff --git a/components/table/nz-td.spec.ts b/components/table/nz-td.spec.ts index d3a8bbe80e0..8cc256a5695 100644 --- a/components/table/nz-td.spec.ts +++ b/components/table/nz-td.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { fakeAsync, flush, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, flush, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; import { NzCheckboxModule } from '../checkbox'; @@ -15,9 +15,9 @@ describe('nz-td', () => { TestBed.compileComponents(); })); describe('basic nz-td', () => { - let fixture; - let testComponent; - let td; + let fixture: ComponentFixture; + let testComponent: NzTestTdComponent; + let td: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestTdComponent); fixture.detectChanges(); @@ -181,9 +181,9 @@ export class NzTestTdComponent { showExpand = false; expand = false; expandChange = jasmine.createSpy('expand change'); - indentSize; - left; - right; + indentSize: number; + left: string | number; + right: string | number; } @Component({ diff --git a/components/table/nz-th.spec.ts b/components/table/nz-th.spec.ts index fff5c3f0742..38b20dd0cf1 100644 --- a/components/table/nz-th.spec.ts +++ b/components/table/nz-th.spec.ts @@ -1,5 +1,5 @@ -import { Component, ViewChild } from '@angular/core'; -import { fakeAsync, flush, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, ViewChild } from '@angular/core'; +import { fakeAsync, flush, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { NzIconTestModule } from '../icon/nz-icon-test.module'; @@ -16,10 +16,10 @@ describe('nz-th', () => { TestBed.compileComponents(); })); describe('nz-th in nz-table', () => { - let fixture; - let testComponent; - let th; - let table; + let fixture: ComponentFixture; + let testComponent: NzThTestNzTableComponent; + let th: DebugElement; + let table: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzThTestNzTableComponent); fixture.detectChanges(); @@ -277,8 +277,8 @@ describe('nz-th', () => { })); }); describe('nz-th with default filter in nz-table', () => { - let fixture; - let testComponent; + let fixture: ComponentFixture; + let testComponent: NzThTestTableDefaultFilterComponent; beforeEach(() => { fixture = TestBed.createComponent(NzThTestTableDefaultFilterComponent); fixture.detectChanges(); @@ -326,11 +326,11 @@ export class NzThTestNzTableComponent { checkedChange = jasmine.createSpy('show change'); indeterminate = false; disabled = false; - left; - right; - width; + left: string | number; + right: string | number; + width: string | number; showSort = false; - sort = null; + sort: string | null = null; sortChange = jasmine.createSpy('sort change'); showRowSelection = false; selections = [ @@ -354,18 +354,22 @@ export class NzThTestNzTableComponent { template: ` - - Name - Age - Address - + + Name + + Age + Address + + - - {{data.name}} - {{data.age}} - {{data.address}} - + + {{data.name}} + {{data.age}} + {{data.address}} + ` }) @@ -422,10 +426,15 @@ export class NzThTestTableDefaultFilterComponent { search(): void { /** filter data **/ - const filterFunc = item => (this.searchAddress ? item.address.indexOf(this.searchAddress) !== -1 : true) && (this.listOfSearchName.length ? this.listOfSearchName.some(name => item.name.indexOf(name) !== -1) : true); + const filterFunc = (item: { name: string; address: string; age: number }) => ( + this.searchAddress + ? item.address.indexOf(this.searchAddress) !== -1 : true) && (this.listOfSearchName.length + ? this.listOfSearchName.some(name => item.name.indexOf(name) !== -1) + : true); const data = this.data.filter(item => filterFunc(item)); /** sort data **/ if (this.sortName && this.sortValue) { + // @ts-ignore this.displayData = data.sort((a, b) => (this.sortValue === 'ascend') ? (a[ this.sortName! ] > b[ this.sortName! ] ? 1 : -1) : (b[ this.sortName! ] > a[ this.sortName! ] ? 1 : -1)); } else { this.displayData = data; diff --git a/components/table/nz-thead.spec.ts b/components/table/nz-thead.spec.ts index e2f6653657d..5b4fb23eab1 100644 --- a/components/table/nz-thead.spec.ts +++ b/components/table/nz-thead.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { fakeAsync, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzMeasureScrollbarService } from '../core/services/nz-measure-scrollbar.service'; import { NzIconTestModule } from '../icon/nz-icon-test.module'; @@ -16,9 +16,9 @@ describe('nz-thead', () => { TestBed.compileComponents(); })); describe('nz-thead in nz-table', () => { - let fixture; - let testComponent; - let table; + let fixture: ComponentFixture; + let testComponent: NzTheadTestNzTableComponent; + let table: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTheadTestNzTableComponent); fixture.detectChanges(); diff --git a/components/table/nz-tr.spec.ts b/components/table/nz-tr.spec.ts index 91d6d2282cf..7a5c5b07c8a 100644 --- a/components/table/nz-tr.spec.ts +++ b/components/table/nz-tr.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { fakeAsync, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzMeasureScrollbarService } from '../core/services/nz-measure-scrollbar.service'; import { NzTableModule } from './nz-table.module'; @@ -14,33 +14,40 @@ describe('nz-tr', () => { }); TestBed.compileComponents(); })); + describe('nz-tr in table', () => { - let fixture; - let tr; + let fixture: ComponentFixture; + let tr: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTrTestTableComponent); fixture.detectChanges(); tr = fixture.debugElement.query(By.directive(NzTrDirective)); }); + it('should not add class', () => { fixture.detectChanges(); expect(tr.nativeElement.classList).not.toContain('ant-table-row'); }); }); + describe('nz-tr in nz-table', () => { - let fixture; - let testComponent; - let tr; + let fixture: ComponentFixture; + let testComponent: NzTrTestNzTableComponent; + let tr: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTrTestNzTableComponent); fixture.detectChanges(); testComponent = fixture.debugElement.componentInstance; tr = fixture.debugElement.query(By.directive(NzTrDirective)); }); + it('should not add class', () => { fixture.detectChanges(); expect(tr.nativeElement.classList).toContain('ant-table-row'); }); + it('should expand work', () => { fixture.detectChanges(); testComponent.expand = true; diff --git a/components/tabs/nz-tabs.spec.ts b/components/tabs/nz-tabs.spec.ts index 6cdabfd84d1..7c02c4a08f9 100644 --- a/components/tabs/nz-tabs.spec.ts +++ b/components/tabs/nz-tabs.spec.ts @@ -1,9 +1,10 @@ -import { Component, TemplateRef, ViewChild, ViewEncapsulation } from '@angular/core'; -import { fakeAsync, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, TemplateRef, ViewChild, ViewEncapsulation } from '@angular/core'; +import { fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; +import { NGStyleInterface } from '../core/types/ng-class'; import { NzTabsModule } from './nz-tabs.module'; -import { NzTabSetComponent } from './nz-tabset.component'; +import { NzAnimatedInterface, NzTabSetComponent } from './nz-tabset.component'; describe('tabs', () => { beforeEach(fakeAsync(() => { @@ -14,19 +15,22 @@ describe('tabs', () => { TestBed.compileComponents(); })); describe('basic tabs', () => { - let fixture; - let testComponent; - let tabs; + let fixture: ComponentFixture; + let testComponent: NzTestTabsBasicComponent; + let tabs: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestTabsBasicComponent); fixture.detectChanges(); testComponent = fixture.debugElement.componentInstance; tabs = fixture.debugElement.query(By.directive(NzTabSetComponent)); }); + it('should className correct', () => { fixture.detectChanges(); expect(tabs.nativeElement.className).toBe('ant-tabs ant-tabs-top ant-tabs-line'); }); + it('should size work', () => { fixture.detectChanges(); testComponent.size = 'large'; @@ -36,6 +40,7 @@ describe('tabs', () => { fixture.detectChanges(); expect(tabs.nativeElement.classList).toContain('ant-tabs-small'); }); + it('should type work', () => { fixture.detectChanges(); expect(tabs.nativeElement.classList).toContain('ant-tabs-line'); @@ -43,6 +48,7 @@ describe('tabs', () => { fixture.detectChanges(); expect(tabs.nativeElement.classList).toContain('ant-tabs-card'); }); + it('should tabBarExtraContent work', () => { fixture.detectChanges(); expect(tabs.nativeElement.querySelector('.ant-tabs-extra-content')).toBeNull(); @@ -50,6 +56,7 @@ describe('tabs', () => { fixture.detectChanges(); expect(tabs.nativeElement.querySelector('.ant-tabs-extra-content').innerText).toBe('extra'); }); + it('should tabBarStyle work', () => { fixture.detectChanges(); expect(tabs.nativeElement.querySelector('[nz-tabs-nav]').style.cssText).toBe(''); @@ -57,6 +64,7 @@ describe('tabs', () => { fixture.detectChanges(); expect(tabs.nativeElement.querySelector('[nz-tabs-nav]').style.cssText).toBe('top: 0px;'); }); + it('should animated work', () => { fixture.detectChanges(); expect(tabs.nativeElement.querySelector('.ant-tabs-content').classList).toContain('ant-tabs-content-animated'); @@ -74,6 +82,7 @@ describe('tabs', () => { expect(tabs.nativeElement.querySelector('.ant-tabs-content').classList).toContain('ant-tabs-content-animated'); expect(tabs.nativeElement.querySelector('.ant-tabs-ink-bar').classList).toContain('ant-tabs-ink-bar-no-animated'); }); + it('should tabPosition work', () => { fixture.detectChanges(); expect(tabs.nativeElement.className).toBe('ant-tabs ant-tabs-top ant-tabs-line'); @@ -87,6 +96,7 @@ describe('tabs', () => { fixture.detectChanges(); expect(tabs.nativeElement.className).toBe('ant-tabs ant-tabs-bottom ant-tabs-line'); }); + it('should tabBarGutter work', () => { fixture.detectChanges(); expect(tabs.nativeElement.querySelector('.ant-tabs-tab').style.marginRight).toBe(''); @@ -94,6 +104,7 @@ describe('tabs', () => { fixture.detectChanges(); expect(tabs.nativeElement.querySelector('.ant-tabs-tab').style.marginRight).toBe('10px'); }); + it('should hideAll work', () => { fixture.detectChanges(); expect(tabs.nativeElement.querySelector('.ant-tabs-tabpane').classList).toContain('ant-tabs-tabpane-active'); @@ -103,18 +114,21 @@ describe('tabs', () => { expect(tabs.nativeElement.querySelector('.ant-tabs-tabpane').classList).toContain('ant-tabs-tabpane-inactive'); expect(tabs.nativeElement.querySelector('.ant-tabs-ink-bar').attributes.getNamedItem('hidden').name).toBe('hidden'); }); + it('should title work', () => { fixture.detectChanges(); const titles = tabs.nativeElement.querySelectorAll('.ant-tabs-tab'); expect(titles[ 0 ].innerText).toBe('title'); expect(titles[ 1 ].innerText).toBe('template'); }); + it('should content work', () => { fixture.detectChanges(); const contents = tabs.nativeElement.querySelectorAll('.ant-tabs-tabpane'); expect(contents[ 0 ].innerText).toBe('Content 1'); expect(contents[ 1 ].innerText).toBe('Content 2'); }); + it('should selectedIndex work', fakeAsync(() => { fixture.detectChanges(); tick(); @@ -521,13 +535,13 @@ export class NzTestTabsBasicComponent { selectedIndex = 0; selectedIndexChange = jasmine.createSpy('selectedIndex callback'); selectChange = jasmine.createSpy('selectedIndex callback'); - animated = true; + animated: NzAnimatedInterface | boolean = true; size = 'default'; - tabBarExtraContent; - tabBarStyle; + tabBarExtraContent: TemplateRef; + tabBarStyle: NGStyleInterface; tabPosition = 'top'; type = 'line'; - tabBarGutter; + tabBarGutter: number; hideAll = false; disabled = false; click00 = jasmine.createSpy('click00 callback'); @@ -556,5 +570,5 @@ export class NzTestTabsBasicComponent { ` }) export class NzTestTabsTabPositionLeftComponent { - tabs = [1, 2, 3]; + tabs = [ 1, 2, 3 ]; } diff --git a/components/tag/nz-tag.spec.ts b/components/tag/nz-tag.spec.ts index b14ad4fe439..c27ccfbbf74 100644 --- a/components/tag/nz-tag.spec.ts +++ b/components/tag/nz-tag.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { fakeAsync, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { fakeAsync, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { NzTagComponent } from './nz-tag.component'; @@ -14,9 +14,10 @@ describe('tag', () => { TestBed.compileComponents(); })); describe('basic tag', () => { - let fixture; - let testComponent; - let tag; + let fixture: ComponentFixture; + let testComponent: NzTestTagBasicComponent; + let tag: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestTagBasicComponent); fixture.detectChanges(); @@ -87,8 +88,9 @@ describe('tag', () => { }); }); describe('prevent tag', () => { - let fixture; - let tag; + let fixture: ComponentFixture; + let tag: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestTagPreventComponent); fixture.detectChanges(); @@ -121,7 +123,7 @@ describe('tag', () => { }) export class NzTestTagBasicComponent { mode = 'default'; - color; + color: string | undefined; checked = false; onClose = jasmine.createSpy('on close'); afterClose = jasmine.createSpy('after close'); diff --git a/components/time-picker/nz-time-picker-panel.component.spec.ts b/components/time-picker/nz-time-picker-panel.component.spec.ts index fd096823efe..739f07a17f0 100644 --- a/components/time-picker/nz-time-picker-panel.component.spec.ts +++ b/components/time-picker/nz-time-picker-panel.component.spec.ts @@ -1,13 +1,11 @@ -import { Component, NO_ERRORS_SCHEMA, ViewChild, ViewEncapsulation } from '@angular/core'; -import { async, fakeAsync, flush, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, NO_ERRORS_SCHEMA, ViewChild, ViewEncapsulation } from '@angular/core'; +import { async, fakeAsync, flush, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; import { NzI18nModule } from '../i18n/nz-i18n.module'; import { NzTimePickerPanelComponent } from './nz-time-picker-panel.component'; describe('time-picker-panel', () => { - let testComponent; - let fixture; beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ FormsModule, NzI18nModule ], @@ -16,19 +14,24 @@ describe('time-picker-panel', () => { }); TestBed.compileComponents(); })); + describe('basic time-picker-panel', () => { - let panelElement; + let fixture: ComponentFixture; + let testComponent: NzTestTimePanelComponent; + let panelElement: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestTimePanelComponent); testComponent = fixture.debugElement.componentInstance; fixture.detectChanges(); panelElement = fixture.debugElement.query(By.directive(NzTimePickerPanelComponent)); }); + it('should init correct', () => { - testComponent.inDatePicker = true; fixture.detectChanges(); expect(panelElement.nativeElement.classList).toContain('ant-time-picker-panel'); }); + it('should format work', () => { fixture.detectChanges(); expect(testComponent.nzTimePickerPanelComponent.hourEnabled).toBe(true); @@ -57,8 +60,8 @@ describe('time-picker-panel', () => { expect(listOfSelectedLi[ 0 ].innerText).toBe('10'); expect(listOfSelectedLi[ 1 ].innerText).toBe('11'); expect(listOfSelectedLi[ 2 ].innerText).toBe('12'); - listOfSelectedLi.forEach(li => { - expect(li.parentElement.parentElement.scrollTop).toBe(li.offsetTop); + listOfSelectedLi.forEach((li: HTMLElement) => { + expect(li.parentElement!.parentElement!.scrollTop).toBe(li.offsetTop); }); testComponent.value = new Date(0, 0, 0, 8, 9, 10); fixture.detectChanges(); @@ -109,33 +112,37 @@ describe('time-picker-panel', () => { }); }); describe('disabled time-picker-panel', () => { - let panelElement; + let fixture: ComponentFixture; + let testComponent: NzTestTimePanelDisabledComponent; + let panelElement: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestTimePanelDisabledComponent); testComponent = fixture.debugElement.componentInstance; fixture.detectChanges(); panelElement = fixture.debugElement.query(By.directive(NzTimePickerPanelComponent)); }); + it('should disabled work', fakeAsync(() => { fixture.detectChanges(); flush(); fixture.detectChanges(); flush(); const listOfSelectContainer = panelElement.nativeElement.querySelectorAll('.ant-time-picker-panel-select'); - expect(listOfSelectContainer[0].querySelectorAll('.ant-time-picker-panel-select-option-disabled').length).toBe(3); - expect(listOfSelectContainer[1].querySelectorAll('.ant-time-picker-panel-select-option-disabled').length).toBe(0); - expect(listOfSelectContainer[2].querySelectorAll('.ant-time-picker-panel-select-option-disabled').length).toBe(0); + expect(listOfSelectContainer[ 0 ].querySelectorAll('.ant-time-picker-panel-select-option-disabled').length).toBe(3); + expect(listOfSelectContainer[ 1 ].querySelectorAll('.ant-time-picker-panel-select-option-disabled').length).toBe(0); + expect(listOfSelectContainer[ 2 ].querySelectorAll('.ant-time-picker-panel-select-option-disabled').length).toBe(0); testComponent.nzTimePickerPanelComponent.selectHour({ index: 4, disabled: false }); fixture.detectChanges(); - expect(listOfSelectContainer[1].querySelectorAll('.ant-time-picker-panel-select-option-disabled').length).toBe(6); + expect(listOfSelectContainer[ 1 ].querySelectorAll('.ant-time-picker-panel-select-option-disabled').length).toBe(6); testComponent.nzTimePickerPanelComponent.selectHour({ index: 5, disabled: false }); testComponent.nzTimePickerPanelComponent.selectMinute({ index: 1, disabled: false }); fixture.detectChanges(); - expect(listOfSelectContainer[2].querySelectorAll('.ant-time-picker-panel-select-option-disabled').length).toBe(6); + expect(listOfSelectContainer[ 2 ].querySelectorAll('.ant-time-picker-panel-select-option-disabled').length).toBe(6); testComponent.hideDisabledOptions = true; fixture.detectChanges(); - expect(listOfSelectContainer[0].firstElementChild.children.length).toBe(21); - expect(listOfSelectContainer[2].firstElementChild.children.length).toBe(54); + expect(listOfSelectContainer[ 0 ].firstElementChild.children.length).toBe(21); + expect(listOfSelectContainer[ 2 ].firstElementChild.children.length).toBe(54); })); }); }); @@ -162,9 +169,9 @@ export class NzTestTimePanelComponent { minuteStep = 1; hourStep = 1; @ViewChild(NzTimePickerPanelComponent) nzTimePickerPanelComponent: NzTimePickerPanelComponent; - value; + value: Date; openValue = new Date(0, 0, 0, 10, 11, 12); - format = 'HH:mm:ss'; + format: string | null = 'HH:mm:ss'; } @Component({ diff --git a/components/time-picker/nz-time-picker-panel.component.ts b/components/time-picker/nz-time-picker-panel.component.ts index 34ddacf7b17..402bde05028 100644 --- a/components/time-picker/nz-time-picker-panel.component.ts +++ b/components/time-picker/nz-time-picker-panel.component.ts @@ -1,7 +1,7 @@ import { ChangeDetectionStrategy, ChangeDetectorRef, - Component, + Component, DebugElement, ElementRef, Input, OnDestroy, @@ -61,9 +61,9 @@ export class NzTimePickerPanelComponent implements ControlValueAccessor, OnInit, minuteRange: ReadonlyArray<{ index: number, disabled: boolean }>; secondRange: ReadonlyArray<{ index: number, disabled: boolean }>; @ViewChild(NzTimeValueAccessorDirective) nzTimeValueAccessorDirective: NzTimeValueAccessorDirective; - @ViewChild('hourListElement') hourListElement; - @ViewChild('minuteListElement') minuteListElement; - @ViewChild('secondListElement') secondListElement; + @ViewChild('hourListElement') hourListElement: DebugElement; + @ViewChild('minuteListElement') minuteListElement: DebugElement; + @ViewChild('secondListElement') secondListElement: DebugElement; @Input() nzInDatePicker: boolean = false; // If inside a date-picker, more diff works need to be done @Input() nzAddOn: TemplateRef; @Input() nzHideDisabledOptions = false; diff --git a/components/time-picker/nz-time-picker.component.spec.ts b/components/time-picker/nz-time-picker.component.spec.ts index 23405aad2b5..aae34ddba7c 100644 --- a/components/time-picker/nz-time-picker.component.spec.ts +++ b/components/time-picker/nz-time-picker.component.spec.ts @@ -1,6 +1,6 @@ import { OverlayContainer } from '@angular/cdk/overlay'; -import { Component, NO_ERRORS_SCHEMA, ViewChild } from '@angular/core'; -import { async, fakeAsync, inject, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, NO_ERRORS_SCHEMA, ViewChild } from '@angular/core'; +import { async, fakeAsync, inject, 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'; @@ -14,8 +14,6 @@ registerLocaleData(zh); describe('time-picker', () => { let overlayContainer: OverlayContainer; - let testComponent; - let fixture; beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NoopAnimationsModule, FormsModule, NzI18nModule, NzTimePickerModule ], @@ -32,7 +30,9 @@ describe('time-picker', () => { overlayContainer.ngOnDestroy(); })); describe('basic time-picker', () => { - let timeElement; + let testComponent: NzTestTimePickerComponent; + let fixture: ComponentFixture; + let timeElement: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestTimePickerComponent); testComponent = fixture.debugElement.componentInstance; diff --git a/components/time-picker/nz-time-picker.component.ts b/components/time-picker/nz-time-picker.component.ts index a0c69f366f8..d9779ffdcbc 100644 --- a/components/time-picker/nz-time-picker.component.ts +++ b/components/time-picker/nz-time-picker.component.ts @@ -172,7 +172,7 @@ export class NzTimePickerComponent implements ControlValueAccessor, OnInit, Afte constructor(private element: ElementRef, private renderer: Renderer2, private updateCls: UpdateCls, - private cdr: ChangeDetectorRef) { + public cdr: ChangeDetectorRef) { } ngOnInit(): void { diff --git a/components/time-picker/nz-time-value-accessor.directive.spec.ts b/components/time-picker/nz-time-value-accessor.directive.spec.ts index 431b550a64d..299855c2210 100644 --- a/components/time-picker/nz-time-value-accessor.directive.spec.ts +++ b/components/time-picker/nz-time-value-accessor.directive.spec.ts @@ -1,18 +1,18 @@ -import { Component, ViewChild } from '@angular/core'; -import { async, fakeAsync, flush, TestBed } from '@angular/core/testing'; +import { registerLocaleData } from '@angular/common'; +import zh from '@angular/common/locales/zh'; +import { Component, DebugElement, ViewChild } from '@angular/core'; +import { async, fakeAsync, flush, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; + import { dispatchFakeEvent } from '../core/testing'; import { NzI18nModule } from '../i18n/nz-i18n.module'; + import { NzTimeValueAccessorDirective } from './nz-time-value-accessor.directive'; -import { registerLocaleData } from '@angular/common'; -import zh from '@angular/common/locales/zh'; registerLocaleData(zh); describe('input-time', () => { - let testComponent; - let fixture; beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ FormsModule, NzI18nModule ], @@ -20,14 +20,19 @@ describe('input-time', () => { }); TestBed.compileComponents(); })); + describe('basic input-time', () => { - let inputElement; + let fixture: ComponentFixture; + let testComponent: NzTestTimeInputComponent; + let inputElement: DebugElement; + beforeEach(() => { fixture = TestBed.createComponent(NzTestTimeInputComponent); testComponent = fixture.debugElement.componentInstance; fixture.detectChanges(); inputElement = fixture.debugElement.query(By.directive(NzTimeValueAccessorDirective)); }); + it('should nzFormat correct', fakeAsync(() => { fixture.detectChanges(); testComponent.value = new Date(0, 0, 0, 0, 0, 0); @@ -36,6 +41,7 @@ describe('input-time', () => { flush(); expect(inputElement.nativeElement.value).toBe('00:00:00'); })); + it('should parse correct', fakeAsync(() => { inputElement.nativeElement.value = '01:01:01'; dispatchFakeEvent(inputElement.nativeElement, 'keyup'); @@ -46,6 +52,7 @@ describe('input-time', () => { flush(); expect(testComponent.value).toEqual(new Date(1970, 0, 1, 1, 1, 1)); })); + it('should focus work', fakeAsync(() => { fixture.detectChanges(); flush(); diff --git a/components/timeline/nz-timeline.spec.ts b/components/timeline/nz-timeline.spec.ts index ab4513099e7..8206749231a 100644 --- a/components/timeline/nz-timeline.spec.ts +++ b/components/timeline/nz-timeline.spec.ts @@ -1,5 +1,5 @@ -import { Component } from '@angular/core'; -import { async, TestBed } from '@angular/core/testing'; +import { Component, DebugElement } from '@angular/core'; +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzTimelineItemComponent } from './nz-timeline-item.component'; @@ -15,16 +15,18 @@ describe('timeline', () => { TestBed.compileComponents(); })); describe('basic timeline', () => { - let fixture; - let testComponent; - let timeline; - let items; + let fixture: ComponentFixture; + let testComponent: NzTestTimelineBasicComponent; + let timeline: DebugElement; + let items: DebugElement[]; + beforeEach(() => { fixture = TestBed.createComponent(NzTestTimelineBasicComponent); testComponent = fixture.debugElement.componentInstance; timeline = fixture.debugElement.query(By.directive(NzTimelineComponent)); items = fixture.debugElement.queryAll(By.directive(NzTimelineItemComponent)); }); + it('should init className correct', () => { fixture.detectChanges(); expect(timeline.nativeElement.firstElementChild!.classList).toContain('ant-timeline'); @@ -32,6 +34,7 @@ describe('timeline', () => { expect(items[ 0 ].nativeElement.firstElementChild!.classList).not.toContain('ant-timeline-item-last'); expect(items[ 3 ].nativeElement.firstElementChild!.classList).toContain('ant-timeline-item-last'); }); + it('should color work', () => { fixture.detectChanges(); expect(items[ 0 ].nativeElement.querySelector('.ant-timeline-item-head').classList).toContain('ant-timeline-item-head-blue'); @@ -42,11 +45,13 @@ describe('timeline', () => { fixture.detectChanges(); expect(items[ 0 ].nativeElement.querySelector('.ant-timeline-item-head').classList).toContain('ant-timeline-item-head-green'); }); + it('should dot work', () => { fixture.detectChanges(); expect(items[ 0 ].nativeElement.querySelector('.ant-timeline-item-head').innerText).toBe('dot'); expect(items[ 1 ].nativeElement.querySelector('.ant-timeline-item-head').innerText).toBe('template'); }); + it('should last work', () => { fixture.detectChanges(); expect(items.length).toBe(4); @@ -56,6 +61,7 @@ describe('timeline', () => { expect(items.length).toBe(5); expect(items[ 4 ].nativeElement.firstElementChild!.classList).toContain('ant-timeline-item-last'); }); + it('should pending work', () => { fixture.detectChanges(); expect(timeline.nativeElement.querySelector('.ant-timeline-item-pending')).toBeNull(); @@ -95,12 +101,14 @@ describe('timeline', () => { }); }); describe('custom color timeline', () => { - let fixture; - let items; + let fixture: ComponentFixture; + let items: DebugElement[]; + beforeEach(() => { fixture = TestBed.createComponent(NzTestTimelineCustomColorComponent); items = fixture.debugElement.queryAll(By.directive(NzTimelineItemComponent)); }); + it('should support custom color', () => { fixture.detectChanges(); expect(items[ 0 ].nativeElement.querySelector('.ant-timeline-item-head').style.borderColor).toBe('grey'); @@ -109,9 +117,10 @@ describe('timeline', () => { expect(items[ 3 ].nativeElement.querySelector('.ant-timeline-item-head').style.borderColor).toBe(''); }); }); + describe('pending timeline', () => { - let fixture; - let timeline; + let fixture: ComponentFixture; + let timeline: DebugElement; beforeEach(() => { fixture = TestBed.createComponent(NzTestTimelinePendingComponent); timeline = fixture.debugElement.query(By.directive(NzTimelineComponent)); @@ -138,7 +147,7 @@ describe('timeline', () => { export class NzTestTimelineBasicComponent { color = 'blue'; dot = 'dot'; - pending = false; + pending: boolean | string = false; last = false; reverse = false; mode = 'left'; diff --git a/components/tooltip/nz-tooltip.component.ts b/components/tooltip/nz-tooltip.component.ts index f12f35840de..0c5871ddb70 100644 --- a/components/tooltip/nz-tooltip.component.ts +++ b/components/tooltip/nz-tooltip.component.ts @@ -94,6 +94,8 @@ export class NzToolTipComponent implements OnChanges { @Output() readonly nzVisibleChange = new EventEmitter(); + [ property: string ]: any // tslint:disable-line:no-any + constructor(public cdr: ChangeDetectorRef, @Host() @Optional() public noAnimation?: NzNoAnimationDirective) { } diff --git a/components/tooltip/nz-tooltip.directive.ts b/components/tooltip/nz-tooltip.directive.ts index 2d1b47cea16..3fd866c6f97 100644 --- a/components/tooltip/nz-tooltip.directive.ts +++ b/components/tooltip/nz-tooltip.directive.ts @@ -23,6 +23,7 @@ import { distinctUntilChanged } from 'rxjs/operators'; import { NzNoAnimationDirective } from '../core/no-animation/nz-no-animation.directive'; import { isNotNil } from '../core/util/check'; + import { NzToolTipComponent } from './nz-tooltip.component'; @Directive({ @@ -71,6 +72,8 @@ export class NzTooltipDirective implements AfterViewInit, OnChanges, OnInit, OnD @Input() nzVisible: boolean; @Input() nzPlacement: string; + [ property: string ]: any // tslint:disable-line:no-any + constructor( public elementRef: ElementRef, public hostView: ViewContainerRef, @@ -106,7 +109,7 @@ export class NzTooltipDirective implements AfterViewInit, OnChanges, OnInit, OnD ngAfterViewInit(): void { if (this.tooltip.nzTrigger === 'hover') { - let overlayElement; + let overlayElement: HTMLElement; this.renderer.listen(this.elementRef.nativeElement, 'mouseenter', () => this.delayEnterLeave(true, true, this.tooltip.nzMouseEnterDelay)); this.renderer.listen(this.elementRef.nativeElement, 'mouseleave', () => { this.delayEnterLeave(true, false, this.tooltip.nzMouseLeaveDelay); diff --git a/components/tooltip/nz-tooltip.spec.ts b/components/tooltip/nz-tooltip.spec.ts index f4dd7810e06..9faad3c651f 100644 --- a/components/tooltip/nz-tooltip.spec.ts +++ b/components/tooltip/nz-tooltip.spec.ts @@ -1,6 +1,6 @@ import { OverlayContainer } from '@angular/cdk/overlay'; import { Component, ElementRef, ViewChild } from '@angular/core'; -import { fakeAsync, inject, tick, TestBed } from '@angular/core/testing'; +import { fakeAsync, inject, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; import { dispatchMouseEvent } from '../core/testing'; @@ -12,8 +12,6 @@ import { NzToolTipModule } from './nz-tooltip.module'; describe('NzTooltip', () => { let overlayContainer: OverlayContainer; let overlayContainerElement: HTMLElement; - let fixture; - let component; beforeEach(fakeAsync(() => { TestBed.configureTestingModule({ @@ -32,7 +30,11 @@ describe('NzTooltip', () => { afterEach(() => { overlayContainer.ngOnDestroy(); }); + describe('should bring no break change', () => { + let fixture: ComponentFixture; + let component: NzTooltipTestWrapperComponent; + beforeEach(() => { fixture = TestBed.createComponent(NzTooltipTestWrapperComponent); component = fixture.componentInstance; @@ -153,6 +155,9 @@ describe('NzTooltip', () => { })); }); describe('should support directive usage', () => { + let fixture: ComponentFixture; + let component: NzTooltipTestNewComponent; + beforeEach(() => { fixture = TestBed.createComponent(NzTooltipTestNewComponent); component = fixture.componentInstance; @@ -253,7 +258,8 @@ describe('NzTooltip', () => { @Component({ selector: 'nz-tooltip-test-new', template: ` - Show Show @@ -274,7 +280,6 @@ export class NzTooltipTestNewComponent { @ViewChild('inBtnGroup') inBtnGroup: ElementRef; title = 'title-string'; - } @Component({ diff --git a/components/tree-select/nz-tree-select.component.ts b/components/tree-select/nz-tree-select.component.ts index d955882958a..e0527665a06 100644 --- a/components/tree-select/nz-tree-select.component.ts +++ b/components/tree-select/nz-tree-select.component.ts @@ -93,7 +93,7 @@ export class NzTreeSelectComponent implements ControlValueAccessor, OnInit, OnDe @Input() nzPlaceHolder = ''; @Input() nzDropdownStyle: { [ key: string ]: string; }; @Input() nzDefaultExpandedKeys: string[] = []; - @Input() nzDisplayWith: (node: NzTreeNode) => string = (node: NzTreeNode) => node.title; + @Input() nzDisplayWith: (node: NzTreeNode) => string | undefined = (node: NzTreeNode) => node.title; @Input() nzMaxTagCount: number; @Input() nzMaxTagPlaceholder: TemplateRef<{ $implicit: NzTreeNode[] }>; @Output() readonly nzOpenChange = new EventEmitter(); @@ -333,7 +333,6 @@ export class NzTreeSelectComponent implements ControlValueAccessor, OnInit, OnDe this.closeDropDown(); this.onChange(value.length ? value[ 0 ] : null); } - }); } diff --git a/components/tree-select/nz-tree-select.spec.ts b/components/tree-select/nz-tree-select.spec.ts index e7bb87243af..c00889782c8 100644 --- a/components/tree-select/nz-tree-select.spec.ts +++ b/components/tree-select/nz-tree-select.spec.ts @@ -1,7 +1,7 @@ import { BACKSPACE } from '@angular/cdk/keycodes'; import { OverlayContainer } from '@angular/cdk/overlay'; -import { Component, ViewChild } from '@angular/core'; -import { async, fakeAsync, flush, inject, tick, TestBed } from '@angular/core/testing'; +import { Component, DebugElement, ViewChild } from '@angular/core'; +import { async, fakeAsync, flush, inject, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule, FormBuilder, FormGroup, ReactiveFormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; @@ -13,6 +13,7 @@ import { NzTreeSelectModule } from './nz-tree-select.module'; describe('tree-select component', () => { let overlayContainer: OverlayContainer; let overlayContainerElement: HTMLElement; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzTreeSelectModule, NoopAnimationsModule, FormsModule, ReactiveFormsModule ], @@ -24,16 +25,17 @@ describe('tree-select component', () => { overlayContainerElement = oc.getContainerElement(); })(); })); + afterEach(inject([ OverlayContainer ], (currentOverlayContainer: OverlayContainer) => { currentOverlayContainer.ngOnDestroy(); overlayContainer.ngOnDestroy(); })); describe('basic', () => { - let fixture; + let fixture: ComponentFixture; let testComponent: NzTestTreeSelectBasicComponent; let treeSelectComponent: NzTreeSelectComponent; - let treeSelect; + let treeSelect: DebugElement; beforeEach(fakeAsync(() => { fixture = TestBed.createComponent(NzTestTreeSelectBasicComponent); @@ -226,17 +228,17 @@ describe('tree-select component', () => { fixture.detectChanges(); expect(treeSelect.nativeElement.querySelectorAll('.ant-select-selection__choice').length).toBe(3); const maxTagPlaceholderElement = treeSelect.nativeElement.querySelectorAll('.ant-select-selection__choice')[ 2 ] - .querySelector('.ant-select-selection__choice__content'); + .querySelector('.ant-select-selection__choice__content'); expect(maxTagPlaceholderElement).toBeTruthy(); expect(maxTagPlaceholderElement.innerText.trim()).toBe(`+ ${testComponent.value.length - testComponent.maxTagCount} ...`); })); }); describe('checkable', () => { - let fixture; + let fixture: ComponentFixture; let testComponent: NzTestTreeSelectCheckableComponent; let treeSelectComponent: NzTreeSelectComponent; - let treeSelect; + let treeSelect: DebugElement; beforeEach(fakeAsync(() => { fixture = TestBed.createComponent(NzTestTreeSelectCheckableComponent); @@ -365,10 +367,11 @@ describe('tree-select component', () => { }); describe('form', () => { - let fixture; - let testComponent; - let treeSelect; + let fixture: ComponentFixture; + let testComponent: NzTestTreeSelectFormComponent; + let treeSelect: DebugElement; let treeSelectComponent: NzTreeSelectComponent; + beforeEach(() => { fixture = TestBed.createComponent(NzTestTreeSelectFormComponent); fixture.detectChanges(); @@ -392,22 +395,22 @@ describe('tree-select component', () => { fixture.detectChanges(); flush(); fixture.detectChanges(); - expect(testComponent.formGroup.get('select').value).toBe('10021'); + expect(testComponent.formGroup.get('select')!.value).toBe('10021'); testComponent.setNull(); fixture.detectChanges(); tick(200); fixture.detectChanges(); - expect(testComponent.formGroup.get('select').value).toBe(null); + expect(testComponent.formGroup.get('select')!.value).toBe(null); expect(treeSelectComponent.selectedNodes.length).toBe(0); expect(treeSelectComponent.value.length).toBe(0); })); }); describe('tree component', () => { - let fixture; + let fixture: ComponentFixture; let testComponent: NzTestTreeSelectCheckableComponent; let treeSelectComponent: NzTreeSelectComponent; - let treeSelect; + let treeSelect: DebugElement; beforeEach(fakeAsync(() => { fixture = TestBed.createComponent(NzTestTreeSelectCheckableComponent); diff --git a/components/tree/demo/directory.ts b/components/tree/demo/directory.ts index 16214d20436..4f1ba1ba53a 100644 --- a/components/tree/demo/directory.ts +++ b/components/tree/demo/directory.ts @@ -109,8 +109,14 @@ export class NzDemoTreeDirectoryComponent { } } +<<<<<<< HEAD activeNode(data: NzFormatEmitEvent): void { this.activedNode = data.node!; +======= + activeNode(data: Required): void { + data.node.setExpanded(true); + this.activedNode = data.node; +>>>>>>> build: add implicit this and others } contextMenu($event: MouseEvent, template: TemplateRef): void { diff --git a/components/tree/demo/dynamic.ts b/components/tree/demo/dynamic.ts index 7b6a576ef89..e7e88eb9c00 100644 --- a/components/tree/demo/dynamic.ts +++ b/components/tree/demo/dynamic.ts @@ -24,7 +24,7 @@ export class NzDemoTreeDynamicComponent implements OnInit { console.log(event); // load child async if (event.eventName === 'expand') { - setTimeout(_ => { + setTimeout(() => { if (event.node.getChildren().length === 0 && event.node.isExpanded) { event.node.addChildren([ { title: 'Child Node', key: `${event.node.key}-0` }, diff --git a/components/tree/demo/search.ts b/components/tree/demo/search.ts index 385fb5f0fe8..11d902649d4 100644 --- a/components/tree/demo/search.ts +++ b/components/tree/demo/search.ts @@ -28,7 +28,7 @@ import { NzFormatEmitEvent, NzTreeComponent } from 'ng-zorro-antd'; export class NzDemoTreeSearchComponent implements OnInit { @ViewChild('treeCom') treeCom: NzTreeComponent; - searchValue; + searchValue = ''; nodes = [ { title : '0-0', @@ -69,7 +69,11 @@ export class NzDemoTreeSearchComponent implements OnInit { } ]; nzEvent(event: NzFormatEmitEvent): void { - console.log(event, this.treeCom.getMatchedNodeList().map(v => v.title), this.treeCom.getExpandedNodeList()); + console.log(event, + // tslint:disable-next-line:no-any + this.treeCom.getMatchedNodeList().map((v: any) => v.title), + this.treeCom.getExpandedNodeList() + ); } ngOnInit(): void { diff --git a/components/tree/nz-tree-base.service.ts b/components/tree/nz-tree-base.service.ts index 3b10dd7397a..eb8c561dd22 100644 --- a/components/tree/nz-tree-base.service.ts +++ b/components/tree/nz-tree-base.service.ts @@ -241,11 +241,12 @@ export class NzTreeBaseService implements OnDestroy { case 'check': resultNodesList = this.checkedNodeList; const isIgnore = (node: NzTreeNode): boolean => { - if (node.getParentNode()) { - if (this.checkedNodeList.findIndex(v => v.key === node.getParentNode()!.key) > -1) { + const parent = node.getParentNode(); + if (parent) { + if (this.checkedNodeList.findIndex(v => v.key === parent.key) > -1) { return true; } else { - return isIgnore(node.getParentNode()!); + return isIgnore(parent); } } return false; @@ -363,7 +364,7 @@ export class NzTreeBaseService implements OnDestroy { } }; const searchChild = (n: NzTreeNode) => { - if (value && n.title.includes(value)) { + if (value && n.title && n.title.includes(value)) { // match the node n.isMatched = true; this.matchedNodeList.push(n); @@ -465,7 +466,7 @@ export class NzTreeBaseService implements OnDestroy { * 0: inner -1: pre 1: next */ dropAndApply(targetNode: NzTreeNode, dragPos: number = -1): void { - if (!targetNode || dragPos > 1) { + if (!targetNode || dragPos > 1 || !this.selectedNode) { return; } const treeService = targetNode.treeService; @@ -487,8 +488,9 @@ export class NzTreeBaseService implements OnDestroy { const tIndex = dragPos === 1 ? 1 : 0; if (targetParent) { targetParent.addChildren([ this.selectedNode ], targetParent.children.indexOf(targetNode) + tIndex); - if (this.selectedNode!.getParentNode()) { - this.resetNodeLevel(this.selectedNode!.getParentNode()!); + const parent = this.selectedNode.getParentNode(); + if (parent) { + this.resetNodeLevel(parent); } } else { const targetIndex = this.rootNodes.indexOf(targetNode) + tIndex; @@ -515,11 +517,11 @@ export class NzTreeBaseService implements OnDestroy { * event: MouseEvent / DragEvent * dragNode */ - formatEvent(eventName: string, node?: NzTreeNode, event?: MouseEvent | DragEvent): NzFormatEmitEvent { + formatEvent(eventName: string, node: NzTreeNode | null, event: MouseEvent | DragEvent | null): NzFormatEmitEvent { const emitStructure = { 'eventName': eventName, - 'node' : node, - 'event' : event + 'node' : node || undefined, + 'event' : event || undefined }; switch (eventName) { case 'dragstart': diff --git a/components/tree/nz-tree-node.component.ts b/components/tree/nz-tree-node.component.ts index d741847ac0e..fbab78b46ee 100644 --- a/components/tree/nz-tree-node.component.ts +++ b/components/tree/nz-tree-node.component.ts @@ -93,7 +93,7 @@ export class NzTreeNodeComponent implements OnInit, OnChanges, OnDestroy { @Input() set nzSearchValue(value: string) { this.highlightKeys = []; - if (value && this.nzTreeNode.title.includes(value)) { + if (value && this.nzTreeNode.title!.includes(value)) { // match the search value const index = this.nzTreeNode.title.indexOf(value); this.highlightKeys = [ this.nzTreeNode.title.slice(0, index), this.nzTreeNode.title.slice(index + value.length, this.nzTreeNode.title.length) ]; diff --git a/components/tree/nz-tree-node.ts b/components/tree/nz-tree-node.ts index 39d3267803e..ac92ae9fb67 100644 --- a/components/tree/nz-tree-node.ts +++ b/components/tree/nz-tree-node.ts @@ -20,7 +20,7 @@ export interface NzTreeNodeOptions { export class NzTreeNode { private _title: string; - key?: string; + key?: string | null; private _icon: string; level: number = 0; private _children: NzTreeNode[]; @@ -48,6 +48,7 @@ export class NzTreeNode { } else if (this.parentNode) { return this.parentNode.treeService; } + return null; } constructor(option: NzTreeNodeOptions | NzTreeNode, parent?: NzTreeNode, service?: NzTreeBaseService) { @@ -84,7 +85,8 @@ export class NzTreeNode { if (typeof (option.children) !== 'undefined' && option.children !== null) { option.children.forEach( (nodeOptions) => { - if ((this.treeService && !this.treeService.isCheckStrictly) && option.checked && !option.disabled && !nodeOptions.disabled && !nodeOptions.disableCheckbox) { + const s = this.treeService; + if ((s && !s.isCheckStrictly) && option.checked && !option.disabled && !nodeOptions.disabled && !nodeOptions.disableCheckbox) { nodeOptions.checked = option.checked; } this._children.push(new NzTreeNode(nodeOptions, this)); diff --git a/components/tree/nz-tree.component.ts b/components/tree/nz-tree.component.ts index 54633425027..b80570755ec 100644 --- a/components/tree/nz-tree.component.ts +++ b/components/tree/nz-tree.component.ts @@ -177,7 +177,7 @@ export class NzTreeComponent implements OnInit, OnChanges, OnDestroy, ControlVal */ @Output() readonly nzOnSearchNode: EventEmitter = new EventEmitter(); - @Output() readonly nzClick: EventEmitter = new EventEmitter(); + @Output() readonly nzClick: EventEmitter> = new EventEmitter(); @Output() readonly nzDblClick: EventEmitter = new EventEmitter(); @Output() readonly nzContextMenu: EventEmitter = new EventEmitter(); @Output() readonly nzCheckBoxChange: EventEmitter = new EventEmitter(); diff --git a/components/tree/nz-tree.spec.ts b/components/tree/nz-tree.spec.ts index 7e86dac2de7..8ff93204f6d 100644 --- a/components/tree/nz-tree.spec.ts +++ b/components/tree/nz-tree.spec.ts @@ -1,5 +1,5 @@ import { Component, OnInit, ViewChild } from '@angular/core'; -import { async, fakeAsync, flush, tick, TestBed } from '@angular/core/testing'; +import { async, fakeAsync, flush, tick, ComponentFixture, TestBed } from '@angular/core/testing'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { By } from '@angular/platform-browser'; import { NoopAnimationsModule } from '@angular/platform-browser/animations'; @@ -14,26 +14,26 @@ import { NzTreeComponent } from './nz-tree.component'; import { NzTreeModule } from './nz-tree.module'; describe('nz-tree', () => { - let treeInstance; let treeElement: HTMLElement; - let component; - let fixture; let treeService: NzTreeBaseService; + describe('basic tree', () => { + let fixture: ComponentFixture; + let treeInstance: NzTestTreeBasicControlledComponent; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzTreeModule, NoopAnimationsModule, FormsModule, ReactiveFormsModule ], declarations: [ NzTestTreeBasicControlledComponent ] }).compileComponents(); fixture = TestBed.createComponent(NzTestTreeBasicControlledComponent); - component = fixture.componentInstance; treeService = fixture.componentInstance.treeComponent.nzTreeService; fixture.detectChanges(); treeInstance = fixture.debugElement.componentInstance; treeElement = fixture.debugElement.query(By.directive(NzTreeComponent)).nativeElement; })); it('should create', () => { - expect(component).toBeDefined(); + expect(treeInstance).toBeDefined(); }); it('should set nzDefaultXXX correctly', fakeAsync(() => { @@ -341,6 +341,9 @@ describe('nz-tree', () => { }); describe('test draggable node', () => { + let fixture: ComponentFixture; + let treeInstance: NzTestTreeDraggableComponent; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzTreeModule, NoopAnimationsModule, FormsModule, ReactiveFormsModule, NzIconTestModule ], @@ -353,7 +356,6 @@ describe('nz-tree', () => { beforeEach(async(() => { fixture = TestBed.createComponent(NzTestTreeDraggableComponent); - component = fixture.componentInstance; treeService = fixture.componentInstance.treeComponent.nzTreeService; fixture.detectChanges(); treeInstance = fixture.debugElement.componentInstance; @@ -506,6 +508,9 @@ describe('nz-tree', () => { }); describe('test older node property', () => { + let fixture: ComponentFixture; + let treeInstance: NzTestTreeOlderComponent; + beforeEach(async(() => { TestBed.configureTestingModule({ imports : [ NzTreeModule, NoopAnimationsModule, FormsModule, ReactiveFormsModule, NzIconTestModule ], @@ -518,7 +523,6 @@ describe('nz-tree', () => { beforeEach(async(() => { fixture = TestBed.createComponent(NzTestTreeOlderComponent); - component = fixture.componentInstance; treeService = fixture.componentInstance.treeComponent.nzTreeService; fixture.detectChanges(); treeInstance = fixture.debugElement.componentInstance; @@ -609,7 +613,7 @@ describe('nz-tree', () => { export class NzTestTreeBasicControlledComponent { @ViewChild('treeComponent') treeComponent: NzTreeComponent; - searchValue; + searchValue: null | string; multiple = true; expandAll = false; asyncData = false; @@ -618,7 +622,8 @@ export class NzTestTreeBasicControlledComponent { defaultSelectedKeys = [ '0-0-0-0' ]; defaultExpandedKeys = [ '0-0-0', '0-0-1' ]; - nodes = [ { + // tslint:disable-next-line:no-any + nodes: any = [ { title : '0-0', key : '0-0', expanded: true, @@ -738,7 +743,7 @@ export class NzTestTreeDraggableComponent { key : '02', isLeaf: true } ]; - beforeDrop; + beforeDrop: () => Observable; onDragStart(): void { } diff --git a/components/upload/demo/drag.ts b/components/upload/demo/drag.ts index 96143c78a8a..c7beccfb439 100644 --- a/components/upload/demo/drag.ts +++ b/components/upload/demo/drag.ts @@ -20,8 +20,8 @@ import { NzMessageService } from 'ng-zorro-antd'; }) export class NzDemoUploadDragComponent { constructor(private msg: NzMessageService) {} - // tslint:disable-next-line:typedef - handleChange({ file, fileList }): void { + // tslint:disable-next-line:no-any + handleChange({ file, fileList }: { [ key: string ]: any }): void { const status = file.status; if (status !== 'uploading') { console.log(file, fileList); diff --git a/components/upload/demo/filter.ts b/components/upload/demo/filter.ts index 1dbb5d39c6a..82360bc909e 100644 --- a/components/upload/demo/filter.ts +++ b/components/upload/demo/filter.ts @@ -63,7 +63,8 @@ export class NzDemoUploadFilterComponent { info.file.url = info.file.response.url; } // 3. filter successfully uploaded files according to response from server - this.fileList = fileList.filter(item => { + // tslint:disable-next-line:no-any + this.fileList = fileList.filter((item: any) => { if (item.response) { return item.response.status === 'success'; } diff --git a/components/upload/interface.ts b/components/upload/interface.ts index a8249995d37..3284b5799e9 100644 --- a/components/upload/interface.ts +++ b/components/upload/interface.ts @@ -1,5 +1,6 @@ // tslint:disable:no-any prefer-method-signature import { Observable, Subscription } from 'rxjs'; +import { IndexableObject } from '../core/types/indexable'; /** 状态 */ export type UploadFileStatus = 'error' | 'success' | 'done' | 'uploading' | 'removed'; @@ -73,9 +74,9 @@ export interface UploadFilter { export interface UploadXHRArgs { action?: string; name?: string; - headers?: {}; + headers?: IndexableObject; file: UploadFile; - data?: {}; + data?: IndexableObject; withCredentials?: boolean; onProgress?: (e: any, file: UploadFile) => void; onSuccess?: (ret: any, file: UploadFile, xhr: any) => void; diff --git a/components/upload/nz-upload-btn.component.ts b/components/upload/nz-upload-btn.component.ts index caa8a31ebcd..b8b16452e99 100644 --- a/components/upload/nz-upload-btn.component.ts +++ b/components/upload/nz-upload-btn.component.ts @@ -102,7 +102,7 @@ export class NzUploadBtnComponent implements OnInit, OnChanges, OnDestroy { // tslint:disable-next-line:no-any const _traverseFileTree = (item: any, path: string) => { if (item.isFile) { - item.file((file) => { + item.file((file: File) => { if (this.attrAccept(file, this.options.accept)) { this.uploadFiles([ file ]); } @@ -110,7 +110,7 @@ export class NzUploadBtnComponent implements OnInit, OnChanges, OnDestroy { } else if (item.isDirectory) { const dirReader = item.createReader(); - dirReader.readEntries((entries) => { + dirReader.readEntries((entries: any) => { // tslint:disable-line:no-any for (const entrieItem of entries) { _traverseFileTree(entrieItem, `${path}${item.name}/`); } diff --git a/components/upload/upload.spec.ts b/components/upload/upload.spec.ts index adc34e9d5f4..ac7194a4575 100644 --- a/components/upload/upload.spec.ts +++ b/components/upload/upload.spec.ts @@ -16,7 +16,15 @@ import { NzIconTestModule } from '../icon/nz-icon-test.module'; import { NzProgressModule } from '../progress/nz-progress.module'; import { NzToolTipModule } from '../tooltip/nz-tooltip.module'; -import { ShowUploadListInterface, UploadChangeParam, UploadFile, UploadFilter, UploadListType, UploadType, ZipButtonOptions } from './interface'; +import { + ShowUploadListInterface, + UploadChangeParam, + UploadFile, + UploadFilter, + UploadListType, + UploadType, + ZipButtonOptions +} from './interface'; import { NzUploadBtnComponent } from './nz-upload-btn.component'; import { NzUploadListComponent } from './nz-upload-list.component'; import { NzUploadComponent } from './nz-upload.component'; @@ -41,7 +49,7 @@ describe('upload', () => { it('should be throw error when not import HttpClient module', () => { expect(() => { TestBed.configureTestingModule({ - declarations: [NzUploadBtnComponent, TestUploadBtnComponent] + declarations: [ NzUploadBtnComponent, TestUploadBtnComponent ] }).createComponent(TestUploadBtnComponent); }).toThrow(); }); @@ -55,8 +63,8 @@ describe('upload', () => { let httpMock: HttpTestingController; beforeEach(() => { injector = TestBed.configureTestingModule({ - imports: [NoopAnimationsModule, HttpClientTestingModule, CommonModule, FormsModule, NzToolTipModule, NzProgressModule, NzI18nModule, NzIconTestModule], - declarations: [NzUploadComponent, NzUploadListComponent, TestUploadComponent, NzUploadBtnComponent] + imports : [ NoopAnimationsModule, HttpClientTestingModule, CommonModule, FormsModule, NzToolTipModule, NzProgressModule, NzI18nModule, NzIconTestModule ], + declarations: [ NzUploadComponent, NzUploadListComponent, TestUploadComponent, NzUploadBtnComponent ] }); fixture = TestBed.createComponent(TestUploadComponent); dl = fixture.debugElement; @@ -141,13 +149,13 @@ describe('upload', () => { }); it('should be removed via list', () => { - instance.nzFileList = [{ - uid: 1, - name: 'xxx.png', - status: 'done', + instance.nzFileList = [ { + uid : 1, + name : 'xxx.png', + status : 'done', response: 'Server Error 500', // custom error message to show - url: 'http://www.baidu.com/xxx.png' - } as any]; + url : 'http://www.baidu.com/xxx.png' + } as any ]; fixture.detectChanges(); pageObject.expectLength(1); pageObject.getByCss('.anticon-close').nativeElement.click(); @@ -166,23 +174,23 @@ describe('upload', () => { it('should be show uploading status when via drag', () => { instance.nzType = 'drag'; - instance.nzFileList = [{ - uid: 1, - name: 'xxx.png', + instance.nzFileList = [ { + uid : 1, + name : 'xxx.png', status: 'uploading' - } as any]; + } as any ]; fixture.detectChanges(); expect(pageObject.getByCss('.ant-upload-drag-uploading') != null).toBe(true); }); it('#i18n', () => { - instance.nzFileList = [{ - uid: 1, - name: 'xxx.png', - status: 'done', + instance.nzFileList = [ { + uid : 1, + name : 'xxx.png', + status : 'done', response: 'Server Error 500', // custom error message to show - url: 'http://www.baidu.com/xxx.png' - } as any]; + url : 'http://www.baidu.com/xxx.png' + } as any ]; fixture.detectChanges(); injector.get(NzI18nService).setLocale(en_US); fixture.detectChanges(); @@ -325,7 +333,7 @@ describe('upload', () => { let ret = false; instance.beforeUpload = (): Observable => { ret = true; - return of(new Blob([JSON.stringify(1, null, 2)], {type : 'application/json'})); + return of(new Blob([ JSON.stringify(1, null, 2) ], { type: 'application/json' })); }; fixture.detectChanges(); pageObject.postSmall(); @@ -342,7 +350,7 @@ describe('upload', () => { }); it('should be console.warn error', () => { let warnMsg = ''; - console.warn = jasmine.createSpy().and.callFake(res => warnMsg = res); + console.warn = jasmine.createSpy().and.callFake((res: string) => warnMsg = res); expect(instance._nzChange).toBeUndefined(); instance.beforeUpload = (): Observable => { return throwError(''); @@ -361,7 +369,7 @@ describe('upload', () => { instance.nzFilter = [ { name: 'limit', - fn: (fileList: UploadFile[]) => fileList.slice(-instance.nzLimit) + fn : (fileList: UploadFile[]) => fileList.slice(-instance.nzLimit) } ]; fixture.detectChanges(); @@ -378,7 +386,7 @@ describe('upload', () => { instance.nzFilter = [ { name: 'size', - fn: (fileList: UploadFile[]) => fileList.filter(w => (w.size / 1024) <= instance.nzSize) + fn : (fileList: UploadFile[]) => fileList.filter(w => (w.size / 1024) <= instance.nzSize) } ]; fixture.detectChanges(); @@ -391,7 +399,7 @@ describe('upload', () => { instance.nzFilter = [ { name: 'type', - fn: (fileList: UploadFile[]) => fileList.filter(w => ~[ instance.nzFileType ].indexOf(w.type)) + fn : (fileList: UploadFile[]) => fileList.filter(w => ~[ instance.nzFileType ].indexOf(w.type)) } ]; fixture.detectChanges(); @@ -404,7 +412,7 @@ describe('upload', () => { instance.nzFilter = [ { name: 'f1', - fn: (fileList: UploadFile[]) => { + fn : (fileList: UploadFile[]) => { return new Observable((observer: Observer) => { observer.next(fileList.slice(1)); observer.complete(); @@ -413,7 +421,7 @@ describe('upload', () => { }, { name: 'f2', - fn: (fileList: UploadFile[]) => { + fn : (fileList: UploadFile[]) => { return new Observable((observer: Observer) => { observer.next(fileList.slice(1)); observer.complete(); @@ -432,11 +440,11 @@ describe('upload', () => { }); it('should be console.warn error', () => { let warnMsg = ''; - console.warn = jasmine.createSpy().and.callFake(res => warnMsg = res); + console.warn = jasmine.createSpy().and.callFake((res: string) => warnMsg = res); instance.nzFilter = [ { name: 'f1', - fn: () => { + fn : () => { return new Observable((observer: Observer) => { observer.error('filter error'); }); @@ -467,24 +475,24 @@ describe('upload', () => { beforeEach(() => { instance.nzFileList = [ { - uid: 1, - name: 'xxx.png', - status: 'done', + uid : 1, + name : 'xxx.png', + status : 'done', response: 'Server Error 500', // custom error message to show - url: 'http://www.baidu.com/xxx.png' + url : 'http://www.baidu.com/xxx.png' }, { - uid: 2, - name: 'yyy.png', + uid : 2, + name : 'yyy.png', status: 'done', - url: 'http://www.baidu.com/yyy.png' + url : 'http://www.baidu.com/yyy.png' }, { - uid: 3, - name: 'zzz.png', - status: 'error', + uid : 3, + name : 'zzz.png', + status : 'error', response: 'Server Error 500', // custom error message to show - url: 'http://www.baidu.com/zzz.png' + url : 'http://www.baidu.com/zzz.png' } ] as any[]; fixture.detectChanges(); @@ -537,14 +545,14 @@ describe('upload', () => { fixture.detectChanges(); pageObject.postSmall(); fixture.detectChanges(); - expect(instance.comp.nzFileList[0].thumbUrl).toBeUndefined(); + expect(instance.comp.nzFileList[ 0 ].thumbUrl).toBeUndefined(); }); it('with picture', () => { instance.nzListType = 'picture'; fixture.detectChanges(); pageObject.postSmall(); fixture.detectChanges(); - expect(instance.comp.nzFileList[0].thumbUrl).not.toBeUndefined(); + expect(instance.comp.nzFileList[ 0 ].thumbUrl).not.toBeUndefined(); }); }); }); @@ -582,6 +590,7 @@ describe('upload', () => { class NzUploadPageObject { private files: any; + constructor() { spyOn(this.btnComp, 'onClick').and.callFake(() => this.btnComp.onChange({ target: { files: this.files } } as any)); } @@ -632,8 +641,8 @@ describe('upload', () => { let instance: TestUploadListComponent; beforeEach(() => { TestBed.configureTestingModule({ - imports: [CommonModule, FormsModule, NzToolTipModule, NzProgressModule, NzI18nModule, NoopAnimationsModule, NzIconTestModule ], - declarations: [NzUploadListComponent, TestUploadListComponent] + imports : [ CommonModule, FormsModule, NzToolTipModule, NzProgressModule, NzI18nModule, NoopAnimationsModule, NzIconTestModule ], + declarations: [ NzUploadListComponent, TestUploadListComponent ] }); fixture = TestBed.createComponent(TestUploadListComponent); dl = fixture.debugElement; @@ -660,14 +669,14 @@ describe('upload', () => { expect(instance._onPreview).toBe(false); const actions = dl.queryAll(By.css('.ant-upload-list-item-actions')); expect(actions.length).toBe(instance.items.length); - actions[0].query(By.css('a')).nativeElement.click(); + actions[ 0 ].query(By.css('a')).nativeElement.click(); fixture.detectChanges(); expect(instance._onPreview).toBe(true); }); it('should be hide preview', () => { instance.icons = { showPreviewIcon: false, - showRemoveIcon: true + showRemoveIcon : true }; fixture.detectChanges(); const actions = dl.queryAll(By.css('.ant-upload-list-item-actions a')); @@ -678,14 +687,14 @@ describe('upload', () => { expect(instance._onRemove).toBe(false); const actions = dl.queryAll(By.css('.ant-upload-list-item-actions')); expect(actions.length).toBe(instance.items.length); - actions[0].query(By.css('.anticon-delete')).nativeElement.click(); + actions[ 0 ].query(By.css('.anticon-delete')).nativeElement.click(); fixture.detectChanges(); expect(instance._onRemove).toBe(true); }); it('should be hide remove', () => { instance.icons = { showPreviewIcon: true, - showRemoveIcon: false + showRemoveIcon : false }; fixture.detectChanges(); const actions = dl.queryAll(By.css('.ant-upload-list-item-actions .anticon-delete')); @@ -694,8 +703,8 @@ describe('upload', () => { }); it('should be hide preview when is invalid image url', fakeAsync(() => { instance.icons = { - showPreviewIcon: true, - showRemoveIcon: true, + showPreviewIcon : true, + showRemoveIcon : true, hidePreviewIconInNonImage: false }; instance.items = [ @@ -709,8 +718,8 @@ describe('upload', () => { })); it('should be hide preview when is invalid image url', fakeAsync(() => { instance.icons = { - showPreviewIcon: true, - showRemoveIcon: true, + showPreviewIcon : true, + showRemoveIcon : true, hidePreviewIconInNonImage: true }; instance.items = [ @@ -740,10 +749,10 @@ describe('upload', () => { it('should support linkProps as object', fakeAsync(() => { instance.items = [ { - uid: '-1', - name: 'foo.png', - status: 'done', - url: 'http://www.baidu.com/xxx.png', + uid : '-1', + name : 'foo.png', + status : 'done', + url : 'http://www.baidu.com/xxx.png', linkProps: { download: 'image' } @@ -759,10 +768,10 @@ describe('upload', () => { const linkPropsString = JSON.stringify({ download: 'image' }); instance.items = [ { - uid: '-1', - name: 'foo.png', - status: 'done', - url: 'http://www.baidu.com/xxx.png', + uid : '-1', + name : 'foo.png', + status : 'done', + url : 'http://www.baidu.com/xxx.png', linkProps: linkPropsString } ]; @@ -797,7 +806,7 @@ describe('upload', () => { }); describe('via thumbUrl or url', () => { it('should be false when not found url & thumbUrl', () => { - expect(instance.comp.isImageUrl({ } as any)).toBe(false); + expect(instance.comp.isImageUrl({} as any)).toBe(false); }); describe('via extension', () => { it('with valid image extension', () => { @@ -821,26 +830,29 @@ describe('upload', () => { describe('[genThumb]', () => { class MockFR { result = '1'; + onloadend(): void { } + readAsDataURL(): void { this.onloadend(); } } + it('should be generate thumb when is valid image data', () => { spyOn(window as any, 'FileReader').and.returnValue(new MockFR()); instance.listType = 'picture'; - instance.items = [ { originFileObj: new File([''], '1.png', { type: 'image' }), thgitumbUrl: undefined } ]; + instance.items = [ { originFileObj: new File([ '' ], '1.png', { type: 'image' }), thgitumbUrl: undefined } ]; fixture.detectChanges(); - expect(instance.items[0].thumbUrl).toBe('1'); + expect(instance.items[ 0 ].thumbUrl).toBe('1'); }); it('should be ingore thumb when is invalid image data', () => { const mockFR = new MockFR(); mockFR.result = ''; spyOn(window as any, 'FileReader').and.returnValue(mockFR); instance.listType = 'picture'; - instance.items = [ { originFileObj: new File([''], '1.pdf', { type: 'pdf' }), thumbUrl: undefined } ]; + instance.items = [ { originFileObj: new File([ '' ], '1.pdf', { type: 'pdf' }), thumbUrl: undefined } ]; fixture.detectChanges(); - expect(instance.items[0].thumbUrl).toBe(''); + expect(instance.items[ 0 ].thumbUrl).toBe(''); }); }); }); @@ -852,8 +864,8 @@ describe('upload', () => { let instance: TestUploadBtnComponent; beforeEach(() => { TestBed.configureTestingModule({ - imports: [HttpClientTestingModule, NzIconTestModule], - declarations: [NzUploadBtnComponent, TestUploadBtnComponent] + imports : [ HttpClientTestingModule, NzIconTestModule ], + declarations: [ NzUploadBtnComponent, TestUploadBtnComponent ] }); fixture = TestBed.createComponent(TestUploadBtnComponent); dl = fixture.debugElement; @@ -896,8 +908,8 @@ describe('upload', () => { spyOn(instance.comp, 'uploadFiles'); expect(instance.comp.uploadFiles).not.toHaveBeenCalled(); instance.comp.onFileDrop({ - type: 'dragend', - dataTransfer: { files: [ FILE ] }, + type : 'dragend', + dataTransfer : { files: [ FILE ] }, preventDefault: () => {} } as any); expect(instance.comp.uploadFiles).toHaveBeenCalled(); @@ -913,7 +925,11 @@ describe('upload', () => { fixture.detectChanges(); spyOn(instance.comp, 'uploadFiles'); expect(instance.comp.uploadFiles).not.toHaveBeenCalled(); - instance.comp.onFileDrop({ type: 'dragend', dataTransfer: { files: PNGSMALL.target.files }, preventDefault: () => {} } as any); + instance.comp.onFileDrop({ + type : 'dragend', + dataTransfer : { files: PNGSMALL.target.files }, + preventDefault: () => {} + } as any); expect(instance.comp.uploadFiles).not.toHaveBeenCalled(); }); it('limit gif using file name', () => { @@ -921,7 +937,11 @@ describe('upload', () => { fixture.detectChanges(); spyOn(instance.comp, 'uploadFiles'); expect(instance.comp.uploadFiles).not.toHaveBeenCalled(); - instance.comp.onFileDrop({ type: 'dragend', dataTransfer: { files: PNGSMALL.target.files }, preventDefault: () => {} } as any); + instance.comp.onFileDrop({ + type : 'dragend', + dataTransfer : { files: PNGSMALL.target.files }, + preventDefault: () => {} + } as any); expect(instance.comp.uploadFiles).not.toHaveBeenCalled(); }); it('allow type image/*', () => { @@ -929,7 +949,11 @@ describe('upload', () => { fixture.detectChanges(); spyOn(instance.comp, 'uploadFiles'); expect(instance.comp.uploadFiles).not.toHaveBeenCalled(); - instance.comp.onFileDrop({ type: 'dragend', dataTransfer: { files: PNGSMALL.target.files }, preventDefault: () => {} } as any); + instance.comp.onFileDrop({ + type : 'dragend', + dataTransfer : { files: PNGSMALL.target.files }, + preventDefault: () => {} + } as any); expect(instance.comp.uploadFiles).toHaveBeenCalled(); }); it(`allow type [ 'image/png', 'image/jpg' ]`, () => { @@ -937,7 +961,11 @@ describe('upload', () => { fixture.detectChanges(); spyOn(instance.comp, 'uploadFiles'); expect(instance.comp.uploadFiles).not.toHaveBeenCalled(); - instance.comp.onFileDrop({ type: 'dragend', dataTransfer: { files: PNGSMALL.target.files }, preventDefault: () => {} } as any); + instance.comp.onFileDrop({ + type : 'dragend', + dataTransfer : { files: PNGSMALL.target.files }, + preventDefault: () => {} + } as any); expect(instance.comp.uploadFiles).toHaveBeenCalled(); }); }); @@ -948,37 +976,31 @@ describe('upload', () => { expect(instance.comp.uploadFiles).toHaveBeenCalled(); }); describe('via directory', () => { - // tslint:disable:no-invalid-this - // tslint:disable-next-line:typedef - function Item(name) { - this.name = name; - this.toString = () => this.name; - } - const makeFileSystemEntry = (item) => { + const makeFileSystemEntry = (item: Item) => { const isDirectory = Array.isArray(item.children); const ret = { isDirectory, - isFile: !isDirectory, - file: (handle) => { + isFile : !isDirectory, + file : (handle: any) => { handle(new Item(item.name)); }, createReader: () => { return { - readEntries: handle => handle(item.children.map(makeFileSystemEntry)) + readEntries: (handle: any) => handle(item.children!.map(makeFileSystemEntry)) }; } }; return ret; }; - const makeDataTransferItem = (item) => ({ webkitGetAsEntry: () => makeFileSystemEntry(item) }); + const makeDataTransferItem = (item: Item) => ({ webkitGetAsEntry: () => makeFileSystemEntry(item) }); beforeEach(() => instance.options.directory = true); it('should working', () => { spyOn(instance.comp, 'uploadFiles'); const files = { - name: 'foo', + name : 'foo', children: [ { - name: 'bar', + name : 'bar', children: [ { name: 'is.webp' @@ -988,19 +1010,19 @@ describe('upload', () => { ] }; instance.comp.onFileDrop({ - type: 'dragend', - dataTransfer: { - items: [makeDataTransferItem(files)] + type : 'dragend', + dataTransfer : { + items: [ makeDataTransferItem(files) ] }, preventDefault: () => {} } as any); expect(instance.comp.uploadFiles).toHaveBeenCalled(); }); it('should be ingore invalid extension', () => { - instance.options.accept = ['.webp']; + instance.options.accept = [ '.webp' ]; spyOn(instance.comp, 'uploadFiles'); const files = { - name: 'foo', + name : 'foo', children: [ { name: 'is.jpg' @@ -1008,9 +1030,9 @@ describe('upload', () => { ] }; instance.comp.onFileDrop({ - type: 'dragend', - dataTransfer: { - items: [makeDataTransferItem(files)] + type : 'dragend', + dataTransfer : { + items: [ makeDataTransferItem(files) ] }, preventDefault: () => {} } as any); @@ -1081,26 +1103,26 @@ describe('upload', () => { let http: HttpTestingController; beforeEach(() => { injector = TestBed.configureTestingModule({ - imports: [HttpClientTestingModule], - declarations: [NzUploadBtnComponent] + imports : [ HttpClientTestingModule ], + declarations: [ NzUploadBtnComponent ] }); (injector as TestBed).compileComponents(); fixture = TestBed.createComponent(NzUploadBtnComponent); comp = fixture.debugElement.componentInstance; comp.options = { - action: '/test', - accept: 'image/png', - filters: [], - data: { a: 1 }, - headers: { token: 'asdf' }, - name: 'avatar', - multiple: true, + action : '/test', + accept : 'image/png', + filters : [], + data : { a: 1 }, + headers : { token: 'asdf' }, + name : 'avatar', + multiple : true, withCredentials: true, - beforeUpload: () => true, - onStart: () => {}, - onProgress: () => {}, - onSuccess: () => {}, - onError: () => {} + beforeUpload : () => true, + onStart : () => {}, + onProgress : () => {}, + onSuccess : () => {}, + onError : () => {} } as ZipButtonOptions; http = injector.get(HttpTestingController); }); @@ -1138,7 +1160,7 @@ describe('upload', () => { comp.options.filters = [ { name: '', - fn: (fileList: UploadFile[]) => fileList.filter(w => w.size / 1024 <= 0) + fn : (fileList: UploadFile[]) => fileList.filter(w => w.size / 1024 <= 0) } ]; comp.onChange(PNGBIG as any); @@ -1175,7 +1197,7 @@ describe('upload', () => { it('should be warn "Must return Subscription type in [nzCustomRequest] property"', () => { let warnMsg = ''; - console.warn = jasmine.createSpy().and.callFake(res => warnMsg = res); + console.warn = jasmine.createSpy().and.callFake((res: string) => warnMsg = res); comp.options.customRequest = (() => {}) as any; comp.onChange(PNGSMALL as any); expect(warnMsg).toContain(`Must return Subscription type`); @@ -1186,35 +1208,35 @@ describe('upload', () => { @Component({ template: ` - - - + + + ` }) class TestUploadComponent { @@ -1255,19 +1277,24 @@ class TestUploadComponent { return true; } _nzChange: UploadChangeParam; + nzChange(value: UploadChangeParam): void { this._nzChange = value; } + _nzFileListChange: any; + nzFileListChange(value: any): void { this._nzChange = value; } + directory = false; } @Component({ - template: ``, + template : ` + `, encapsulation: ViewEncapsulation.None }) class TestUploadListComponent { @@ -1275,29 +1302,29 @@ class TestUploadListComponent { listType: UploadListType = 'picture-card'; items: any[] = [ { - uid: 1, - name: 'xxx.png', - status: 'done', + uid : 1, + name : 'xxx.png', + status : 'done', response: 'Server Error 500', // custom error message to show - url: 'http://www.baidu.com/xxx.png' + url : 'http://www.baidu.com/xxx.png' }, { - uid: 2, - name: 'yyy.png', + uid : 2, + name : 'yyy.png', status: 'done', - url: 'http://www.baidu.com/yyy.png' + url : 'http://www.baidu.com/yyy.png' }, { - uid: 3, - name: 'zzz.png', - status: 'error', + uid : 3, + name : 'zzz.png', + status : 'error', response: 'Server Error 500', // custom error message to show - url: 'http://www.baidu.com/zzz.png' + url : 'http://www.baidu.com/zzz.png' } ]; icons: ShowUploadListInterface = { showPreviewIcon: true, - showRemoveIcon: true + showRemoveIcon : true }; _onPreview = false; onPreview: VoidFunction | null = (): void => { @@ -1310,17 +1337,25 @@ class TestUploadListComponent { } @Component({ - template: `
    UPLAOD
    ` + template: ` +
    UPLAOD
    ` }) class TestUploadBtnComponent { @ViewChild('btn') comp: NzUploadBtnComponent; - classes: string[] = ['test']; + classes: string[] = [ 'test' ]; options: ZipButtonOptions = { - disabled: false, + disabled : false, openFileDialogOnClick: true, +<<<<<<< HEAD filters: [], customRequest: undefined, onStart: () => {}, onError: () => {} +======= + filters : [], + customRequest : undefined, + onStart : () => {}, + onError : () => {} +>>>>>>> build: add implicit this and others }; } diff --git a/scripts/site/_site/doc/app/app.component.ts b/scripts/site/_site/doc/app/app.component.ts index 0756c9c422b..42b4f884fba 100644 --- a/scripts/site/_site/doc/app/app.component.ts +++ b/scripts/site/_site/doc/app/app.component.ts @@ -56,7 +56,7 @@ export class AppComponent implements OnInit, AfterViewInit { @ViewChild('searchInput') searchInput: ElementRef; - switchLanguage(language) { + switchLanguage(language: string): void { const url = this.router.url.split('/'); url.splice(-1); this.router.navigateByUrl(url.join('/') + '/' + language); diff --git a/scripts/site/_site/doc/app/share/nz-codebox/nz-codebox.component.ts b/scripts/site/_site/doc/app/share/nz-codebox/nz-codebox.component.ts index f6e4840025c..922159ad893 100644 --- a/scripts/site/_site/doc/app/share/nz-codebox/nz-codebox.component.ts +++ b/scripts/site/_site/doc/app/share/nz-codebox/nz-codebox.component.ts @@ -103,7 +103,7 @@ export class NzCodeBoxComponent { }); } - copyGenerateCommand(command) { + copyGenerateCommand(command: string): void { this.copy(command).then(() => { this.commandCopied = true; setTimeout(() => { diff --git a/scripts/site/_site/doc/app/share/nz-highlight/nz-highlight.component.ts b/scripts/site/_site/doc/app/share/nz-highlight/nz-highlight.component.ts index 0982ee75346..dbea18ad206 100644 --- a/scripts/site/_site/doc/app/share/nz-highlight/nz-highlight.component.ts +++ b/scripts/site/_site/doc/app/share/nz-highlight/nz-highlight.component.ts @@ -7,7 +7,7 @@ import { ChangeDetectionStrategy, Component, ElementRef, Input, OnInit, ViewChil ` }) export class NzHighlightComponent implements OnInit { - _code; + _code: string; @ViewChild('code') codeElement: ElementRef; @Input() nzLanguage: string; diff --git a/tsconfig.json b/tsconfig.json index 42448c57e40..424a6e896b7 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -18,7 +18,10 @@ ], "noUnusedParameters": true, "noUnusedLocals": true, + "noImplicitAny": true, + "noImplicitThis": true, "skipLibCheck": true, + "strictFunctionTypes": true, "strictNullChecks": true } }