角度2 /ジャスミン入力フィールドバインドのテスト

Question

現在、角度2とジャスミンを使用しており、単純な入力フィールドを持っています。私はユニットテストを書いて、このexampleをAngular.ioサイトから使用しようとしています。より有益であれば、plnkrを見ることができます。 app-> dashboard-> dasboard-hero.component.tsを探します。

この例では、selectを使用しています。ここでは、入力を使用していて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. 
    }); }); 

私が何か間違ったことをやっているか、または私は間違ってイベントをトリガすることができます。

イベントは間違っていますか？
私のテストに何か問題がありますか？

私は良い回答に投票します。あなたはあなたがここでのテストで変化検出について読むことができますcomp.myBind

fix.detectChanges()

の値を変更した後、あなたの治具にdetectChanges()を追加

Answer 1

最後にIテストケースで1行を変更する必要がありました。

削除：

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

に置き換え：

ele.myBind('Nikki'); 

これはエミッタを発射し、boundStringは、テストケースを通過させる更新されます。

Answer 2

試してみてください。

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