From e59171b0be607d956aae5e2618c37ebb881806ab Mon Sep 17 00:00:00 2001 From: Hsuan Lee Date: Tue, 11 Jun 2019 21:27:25 +0800 Subject: [PATCH] test: sync CDK testing code (#3558) --- components/cascader/nz-cascader.spec.ts | 50 +++++++++--------------- components/core/testing/event-objects.ts | 28 +++++++++---- 2 files changed, 39 insertions(+), 39 deletions(-) diff --git a/components/cascader/nz-cascader.spec.ts b/components/cascader/nz-cascader.spec.ts index 4b9182eb6a..c2fd69a1d7 100644 --- a/components/cascader/nz-cascader.spec.ts +++ b/components/cascader/nz-cascader.spec.ts @@ -1,4 +1,22 @@ // tslint:disable:no-any +import { + COMMA, + DELETE, + DOWN_ARROW, + END, + ENTER, + ESCAPE, + HOME, + LEFT_ARROW, + NINE, + PAGE_DOWN, + PAGE_UP, + RIGHT_ARROW, + SPACE, + TAB, + UP_ARROW, + ZERO +} from '@angular/cdk/keycodes'; import { ConnectedOverlayPositionChange, OverlayContainer } from '@angular/cdk/overlay'; import { Component, DebugElement, TemplateRef, ViewChild } from '@angular/core'; import { async, fakeAsync, flush, inject, tick, ComponentFixture, TestBed } from '@angular/core/testing'; @@ -707,7 +725,6 @@ describe('cascader', () => { expect(overlayContainerElement.querySelectorAll('.ant-cascader-menu').length).toBe(2); // 2列 }); it('should click option to change column count 2', fakeAsync(() => { - const LEFT_ARROW = 37; testComponent.values = ['zhejiang', 'hangzhou', 'xihu']; fixture.detectChanges(); cascader.nativeElement.click(); @@ -832,7 +849,6 @@ describe('cascader', () => { expect(overlayContainerElement.querySelectorAll('.ant-cascader-menu').length).toBe(0); })); it('should open menu when press DOWN_ARROW', fakeAsync(() => { - const DOWN_ARROW = 40; fixture.detectChanges(); expect(testComponent.cascader.menuVisible).toBe(false); dispatchKeyboardEvent(cascader.nativeElement, 'keydown', DOWN_ARROW); @@ -842,7 +858,6 @@ describe('cascader', () => { expect(testComponent.cascader.menuVisible).toBe(true); })); it('should open menu when press UP_ARROW', fakeAsync(() => { - const UP_ARROW = 38; fixture.detectChanges(); expect(testComponent.cascader.menuVisible).toBe(false); dispatchKeyboardEvent(cascader.nativeElement, 'keydown', UP_ARROW); @@ -852,19 +867,17 @@ describe('cascader', () => { expect(testComponent.cascader.menuVisible).toBe(true); })); it('should close menu when press ESC', fakeAsync(() => { - const ESC = 27; fixture.detectChanges(); testComponent.cascader.setMenuVisible(true); fixture.detectChanges(); expect(testComponent.cascader.menuVisible).toBe(true); - dispatchKeyboardEvent(cascader.nativeElement, 'keydown', ESC); + dispatchKeyboardEvent(cascader.nativeElement, 'keydown', ESCAPE); fixture.detectChanges(); flush(); // wait for cdk-overlay to close fixture.detectChanges(); expect(testComponent.cascader.menuVisible).toBe(false); })); it('should navigate up when press UP_ARROW', fakeAsync(() => { - const UP_ARROW = 38; fixture.detectChanges(); testComponent.cascader.setMenuVisible(true); fixture.detectChanges(); @@ -885,7 +898,6 @@ describe('cascader', () => { expect(itemEl1.classList).not.toContain('ant-cascader-menu-item-active'); })); it('should navigate down when press DOWN_ARROW', fakeAsync(() => { - const DOWN_ARROW = 40; fixture.detectChanges(); testComponent.cascader.setMenuVisible(true); fixture.detectChanges(); @@ -898,8 +910,6 @@ describe('cascader', () => { expect(itemEl1.classList).toContain('ant-cascader-menu-item-active'); })); it('should navigate right when press RIGHT_ARROW', fakeAsync(() => { - const DOWN_ARROW = 40; - const RIGHT_ARROW = 39; fixture.detectChanges(); testComponent.cascader.setMenuVisible(true); fixture.detectChanges(); @@ -931,7 +941,6 @@ describe('cascader', () => { expect(itemEl3.classList).toContain('ant-cascader-menu-item-active'); })); it('should navigate left when press LEFT_ARROW', fakeAsync(() => { - const LEFT_ARROW = 37; fixture.detectChanges(); testComponent.values = ['zhejiang', 'hangzhou', 'xihu']; testComponent.cascader.setMenuVisible(true); @@ -969,9 +978,6 @@ describe('cascader', () => { expect(itemEl3.classList).not.toContain('ant-cascader-menu-item-active'); })); it('should select option when press ENTER', fakeAsync(() => { - const DOWN_ARROW = 40; - const RIGHT_ARROW = 39; - const ENTER = 13; fixture.detectChanges(); expect(testComponent.values).toBeNull(); testComponent.cascader.setMenuVisible(true); @@ -1007,10 +1013,6 @@ describe('cascader', () => { expect(testComponent.cascader.menuVisible).toBe(false); })); it('should key nav disabled option correct', fakeAsync(() => { - const DOWN_ARROW = 40; - const RIGHT_ARROW = 39; - const UP_ARROW = 38; - testComponent.nzOptions = options2; fixture.detectChanges(); testComponent.cascader.setMenuVisible(true); @@ -1073,18 +1075,8 @@ describe('cascader', () => { expect(optionEl14.classList).not.toContain('ant-cascader-menu-item-active'); })); it('should ignore keyboardEvent on some key', fakeAsync(() => { - const PAGE_UP = 33; - const PAGE_DOWN = 34; - const TAB = 9; - const HOME = 36; - const END = 35; - const SPACE = 32; - const DELETE = 46; - const COMMA = 188; const A = 65; const Z = 90; - const ZERO = 48; - const NINE = 57; const keys = [PAGE_UP, PAGE_DOWN, TAB, HOME, END, SPACE, COMMA, DELETE]; for (let k = A; k <= Z; k++) { keys.push(k); @@ -1563,8 +1555,6 @@ describe('cascader', () => { expect(testComponent.cascader.cascaderService.columns[0][2].disabled).toBe(true); }); it('should support arrow in search mode', done => { - const DOWN_ARROW = 40; - const ENTER = 13; testComponent.nzOptions = options2; fixture.detectChanges(); testComponent.cascader.inputValue = 'o'; @@ -1591,8 +1581,6 @@ describe('cascader', () => { }); }); it('should not preventDefault left/right arrow in search mode', () => { - const LEFT_ARROW = 37; - const RIGHT_ARROW = 39; fixture.detectChanges(); testComponent.nzShowSearch = true; testComponent.cascader.inputValue = 'o'; diff --git a/components/core/testing/event-objects.ts b/components/core/testing/event-objects.ts index 9abf477319..eeb7e881e9 100644 --- a/components/core/testing/event-objects.ts +++ b/components/core/testing/event-objects.ts @@ -7,12 +7,12 @@ */ /** Creates a browser MouseEvent with the specified options. */ -export function createMouseEvent(type: string, x = 0, y = 0): MouseEvent { +export function createMouseEvent(type: string, x: number = 0, y: number = 0, button: number = 0): MouseEvent { const event = document.createEvent('MouseEvent'); event.initMouseEvent( type, - false /* canBubble */, + true /* canBubble */, false /* cancelable */, window /* view */, 0 /* detail */, @@ -24,10 +24,14 @@ export function createMouseEvent(type: string, x = 0, y = 0): MouseEvent { false /* altKey */, false /* shiftKey */, false /* metaKey */, - 0 /* button */, + button /* button */, null /* relatedTarget */ ); + // `initMouseEvent` doesn't allow us to pass the `buttons` and + // defaults it to 0 which looks like a fake event. + Object.defineProperty(event, 'buttons', { get: () => 1 }); + return event; } @@ -43,20 +47,26 @@ export function createTouchEvent(type: string, pageX: number = 0, pageY: number // Most of the browsers don't have a "initTouchEvent" method that can be used to define // the touch details. Object.defineProperties(event, { - touches: { value: [touchDetails] } + touches: { value: [touchDetails] }, + targetTouches: { value: [touchDetails] }, + changedTouches: { value: [touchDetails] } }); - return event as UIEvent; + return event; } /** Dispatches a keydown event from an element. */ export function createKeyboardEvent(type: string, keyCode: number, target?: Element, key?: string): KeyboardEvent { + // tslint:disable-next-line:no-any const event = document.createEvent('KeyboardEvent') as any; - // Firefox does not support `initKeyboardEvent`, but supports `initKeyEvent`. - const initEventFn = (event.initKeyEvent || event.initKeyboardEvent).bind(event); const originalPreventDefault = event.preventDefault; - initEventFn(type, true, true, window, 0, 0, 0, 0, 0, keyCode); + // Firefox does not support `initKeyboardEvent`, but supports `initKeyEvent`. + if (event.initKeyEvent) { + event.initKeyEvent(type, true, true, window, 0, 0, 0, 0, 0, keyCode); + } else { + event.initKeyboardEvent(type, true, true, window, 0, key, 0, '', false); + } // Webkit Browsers don't set the keyCode when calling the init function. // See related bug https://bugs.webkit.org/show_bug.cgi?id=16735 @@ -67,8 +77,10 @@ export function createKeyboardEvent(type: string, keyCode: number, target?: Elem }); // IE won't set `defaultPrevented` on synthetic events so we need to do it manually. + // tslint:disable-next-line:typedef event.preventDefault = function() { Object.defineProperty(event, 'defaultPrevented', { get: () => true }); + // tslint:disable-next-line:no-invalid-this return originalPreventDefault.apply(this, arguments); };