小编use*_*195的帖子

使用异步管道使用可观察数据服务直接在视图中更新数据,这证明难以测试(正常工作正常).

我希望能够更新视图,触发单击事件,然后测试模型是否已正确更新(由于单击),但在测试中,异步管道在其绑定的observable触发时不会呈现任何内容事件.所以我无法在测试中与DOM交互并测试交互的结果.

找不到任何人使用异步管道对组件进行单元测试的例子,所以我很茫然.任何反馈意见.

测试:

it('Updates the availability model correctly after UI interaction.', done => {

    this.instance.morning$
        .subscribe(data => {

            let checkboxes = this.fixture.nativeElement.querySelectorAll('ion-checkbox');
            TestUtils.trigger(checkboxes[0], 'click');

            let morningModel = this.instance.model.morning;
            expect(morningModel[0].v).toEqual(true);

            done();

        });         

});

模板:

<td *ngFor="let day of morning$ | async">
    <ion-checkbox [(ngModel)]="day.v"></ion-checkbox>
</td>

零件:

@Component({
    templateUrl: 'build/modules/availability/availability.view.html',
    selector: 'availability',
    providers: [AvailabilitySvc],
    directives: [Checkbox]
})
export class AvailabilityCom {

    @Input() userId: string;
    public morning$: any;

    constructor(private svc: AvailabilitySvc) {     
        this.morning$ = svc.morning$;
        this.setEvents();
    }

    ngOnInit(){
        this.getAvailability();
    }

    getAvailability(){
        return this.svc.get(this.userId); …