각도 2/재스민 입력 필드 테스트 Bind

Question

현재 Angular 2와 Jasmine을 사용 중이며 간단한 입력 필드가 있습니다. 단위 테스트를 작성하고 Angular.io 사이트에서이 example을 사용하려고합니다. 보다 유익한 정보가 있다면 plnkr을 볼 수 있습니다. app-> dashboard-> dasboard-hero.component.ts를 찾으십시오.

이 예제에서는 select를 사용합니다. 여기서는 input을 사용 중이며 eventEmitter가 실행되지 않습니다.

내 구성 요소 :

export class MyInputComponent implements OnInit { 
    private _myBind: string; 
    @Output() myBindChange = new EventEmitter(); 

    @Input() 
    set myBind(bindField: string) { 
    this.myBindChange.emit(bindField); 
    this._myBind = bindField; 
    } 

    get myBind(): string { 
    return this._myBind; 
    } 

html로 :

<p><input type="text" [(ngModel)]="myBind"></p> 

데모 HTML 페이지에 포함 할 때 그냥 잘 작동합니다.

테스트 케이스 :

describe('Testing the Bind',() => { 
    let fix: ComponentFixture<MyInputComponent>; 
    let ele: DebugElement; 
    let comp: MyInputComponent; 

    beforeEach(() => { 
     fix = TestBed.createComponent(MyInputComponent); 
     comp = fix.componentInstance; 
     ele = fix.debugElement.query(By.css('input')); 
     comp.myBind = 'Nikki'; 
    }); 

    it('should emit when input added',() => { 
     let boundString: string; 
     boundString = 'zzz'; //Dummy value so bound is not null. 
     comp.myBindChange.subscribe((str: string) 
      => boundString = str); //Listen for the event. 
     ele.triggerEventHandler('keypress', null); //Is the event triggered? 
     expect(boundString).toBe('Nikki'); //fails, it's still zzz. 
    }); }); 

내가 뭔가 잘못하고있을 수도 있고, 내가 잘못 이벤트를 트리거 할 수있다.

이벤트가 잘못 되었습니까?
테스트에 이상이 있습니까?

나는 좋은 대답을 투표 할 것입니다.

Answer 1

를 I 테스트 케이스에서 한 줄을 변경해야했습니다.

제거 :

ele.triggerEventHandler('keypress', null); //Is the event triggered? 

로 교체 :

ele.myBind('Nikki'); 

이것은 이미 터를 발생하고, boundString 테스트 케이스가 통과 할 수 있도록 업데이트됩니다.

Answer 2

를 추가해보십시오 당신의 고정에 detectChanges() 당신은 현재 테스트에서 변경 감지에 대해 읽을 수 있습니다 comp.myBind

fix.detectChanges()

의 값 변경 후 : 결국

https://angular.io/docs/ts/latest/guide/testing.html#!#detect-changes