相关疑难解决方法(0)

我想在Angular 2单元测试中更改输入字段的值.

<input type="text" class="form-control" [(ngModel)]="abc.value" />

我不能只改变ngModel因为abc对象是私有的:

 private abc: Abc = new Abc();

在Angular 2测试中,我可以模拟用户在输入字段ngModel中键入内容,以便使用用户在单元测试中输入的内容进行更新吗？

我可以毫无问题地抓住输入字段DebugElement和nativeElement输入字段.(只是设置了value对房地产nativeElement的输入域的似乎并没有工作,因为它不更新ngModel什么我为值设置).

也许inputDebugEl.triggerEventHandler可以被调用,但是我不确定给它的参数是什么它将模拟用户输入特定的输入字符串.

我有一个文本输入,我正在听取更改.

mycomponent.ts

ngOnInit() {
    this.searchInput = new Control();
    this.searchInput.valueChanges
        .distinctUntilChanged()
        .subscribe(newValue => this.search(newValue))
}
search(query) {
    // do something to search
}

mycomponent.html

<search-box>
    <input type="text" [ngFormControl]="searchInput" >
</search-box>

运行应用程序一切正常,但我想对其进行单元测试.

所以这就是我的尝试

mycomponent.spec.ts

beforeEach(done => {
    createComponent().then(fix => {
        cmpFixture = fix
        mockResponse()
        instance = cmpFixture.componentInstance
        cmpFixture.detectChanges();
        done();
    })
})
describe('on searching on the list', () => {
        let compiled, input
        beforeEach(() => {
            cmpFixture.detectChanges();
            compiled = cmpFixture.debugElement.nativeElement;
            spyOn(instance, 'search').and.callThrough()
            input = compiled.querySelector('search-box > input')
            input.value = 'fake-search-query'
            cmpFixture.detectChanges();
        })
        it('should …