Das Tastendruck-Ereignis kann im Angular 2 Unit-Test (Jasmine) nicht simuliert werden.

Question

Ich verwende eine Direktive, um die Daten vom Eingang als Filtertext zu verwenden.

hier ist mein hostlistener in der Richtlinie:

@HostListener('input', ['$event.target.value']) 
    public onChangeFilter(event: any): void { 
    console.log('input event fired, value: ' + event); 
    this.columnFiltering.filterString = event; 
    this.filterChanged.emit({filtering: this.columnFiltering}); 
    } 

dieser Code perfekt funktioniert, ich bin gleich Unit-Test nicht in der Lage.

Ich habe den filterChanged EventEmitter in meinem Komponententest abonniert, um den Wert zu überprüfen.

Ich habe versucht, simulieren Keypress-Ereignis, um Wert zu ändern und versuchte auch Einstellungen Wert Attribut. Nichts davon funktioniert für mich.

hier ist meine Spec-Datei:

describe('Table View',() => { 
    let fixture: ComponentFixture<any>; 
    let context: TableComponent; 
    beforeEach(() => { 
    TestBed.configureTestingModule({ 
      providers: [ 
      TableComponent, 
      ], 
      imports: [TableModule], 
     }); 
     fixture = TestBed.createComponent(TableComponent); 
     context = fixture.componentInstance; 
    }); 
it('should allow filter',() => { 
     const element = fixture.nativeElement; 
     context.config = config; 
     fixture.detectChanges(); 

     let tableChangeCount = 0; 
     let tableEvent: any; 
     context.tableChanged.subscribe((event: any) => { 
     tableChangeCount++; 
     tableEvent = event; 
     }); 
     // Check if table exists 
     let inputElement = element.querySelectorAll('tr')[1].querySelector('input'); 
    let e = new KeyboardEvent("keypress", { 
      key: "a", 
      bubbles: true, 
      cancelable: true, 
      }); 
      inputElement.dispatchEvent(e); 
}); 

}); 

I Einstellwert versucht:

let attrs = inputElement.attributes; 
     inputElement.setAttribute('value', 'abc'); 
     for (let i = attrs.length - 1; i >= 0; i--) { 
     // Attribute value is set correctly 
     if (attrs[i].name === 'value') { 
     console.log(attrs[i].name + "->" + attrs[i].value); 
     } 
     } 

Kann mir jemand bitte helfen, wie kann ich das gleiche Gerät zu testen?

Answer 1

Ich hatte einige Probleme, einen Tastendruck in einem Komponententest auch zu simulieren. Aber stieß auf eine Antwort von Seyed Jalal Hosseini. Es könnte sein, was du willst.

Wenn Sie versuchen, einen Tastendruck zu simulieren, können Sie ein Ereignis auslösen, indem Sie das Element dispatchEvent(new Event('keypress')); aufrufen.

Hier ist die Antwort, die ich unter Bezugnahme bin was detaillierter gibt: https://stackoverflow.com/a/37956877/4081730

Wenn Sie den Schlüssel einstellen möchten, die gedrückt wurde, dies auch getan werden kann.

const event = new KeyboardEvent("keypress",{ 
    "key": "Enter" 
}); 
el.dispatchEvent(event); 

Weitere Informationen Ich komme gerade über: https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events

Answer 2

Wenn Sie einen Schlüsselcode verwenden möchten (oder "welche"), können Sie dies tun:

// @HostListener('document:keypress') 

const escapeEvent: any = document.createEvent('CustomEvent'); 
escapeEvent.which = 27; 
escapeEvent.initEvent('keypress', true, true); 
document.dispatchEvent(escapeEvent);