2017-07-13 164 views
0

我正在嘗試爲鍵盤輸入編寫單元測試。在我的組件中,我有這個功能來捕捉我的鍵盤事件:角度2單元測試:如何測試鍵盤輸入

@HostListener('window:keydown', ['$event']) 
    keyboardInput(event: any){ 
    if(event.code.toLowerCase()==="escape" && this.formProps.ausgeklappt){ 
     this.closeForm(); 
     } else if(event.code.toLowerCase()==="enter" && this.dayData.isSelected && !this.formProps.ausgeklappt) { 
     console.log("enter wurde gedrückt " + this.dayData.day); 
     this.handleHeaderClick(); 
    } 
    } 

我試圖模擬'逃生'事件,但失敗慘敗。 我component.spec.ts看起來是這樣的:

it('should trigger escape event',() => { 
    component.formProps.ausgeklappt = true; 
    fixture.detectChanges(); 
    let spy = spyOn(component, "closeForm"); 
    const event = new KeyboardEvent("keypress",{ 
     "key": "escape" 
    }); 
    fixture.nativeElement.dispatchEvent(event) 

    component.keyboardInput(event); 
    expect(spy).toHaveBeenCalled(); 
    }); 

我不知道如何解決這個問題,我很感激每一個幫助...

+1

使測試異步。 –

回答

2

我不得不將其更改爲異步測試。感謝@peeskillet! 此外,我不得不改變"key": "escape""code": "ESCAPE"

it('should trigger escape event', async(() => { 
     component.formProps.ausgeklappt = true; 
     fixture.detectChanges(); 
     let spy = spyOn(component, "closeForm"); 
     const event = new KeyboardEvent("keypress",{ 
      "code": "ESCAPE", 
     }); 
     fixture.nativeElement.dispatchEvent(event); 

     component.keyboardInput(event); 
     expect(spy).toHaveBeenCalled(); 
     }));