我想在Angular 2单元测试中更改输入字段的值.
<input type="text" class="form-control" [(ngModel)]="abc.value" />
我不能只更改ngModel,因为abc对象是私有的:
private abc: Abc = new Abc();
在Angular 2测试中,我可以模拟用户在输入字段中输入的内容,以便使用用户在单元测试中输入的内容更新ngModel吗?
我可以毫无问题地获取输入字段的DebugElement和nativeElement. (只是在输入字段的nativeElement上设置value属性似乎不起作用,因为它不会使用我为该值设置的内容更新ngModel).
也许可以调用inputDebugEl.triggerEventHandler,但是我不确定给它的参数是什么,因此它将模拟输入特定字符串的用户.
你是对的,你不能只设置输入,你还需要调度’输入’事件.这是我今天早些时候写的一个函数来输入文本:
function sendInput(text: string) { inputElement.value = text; inputElement.dispatchEvent(new Event('input')); fixture.detectChanges(); return fixture.whenStable(); }
这里fixture是ComponentFixture,inputElement是fixture的nativeElement的相关HTTPInputElement.这会返回一个promise,所以你可能需要解析它sendInput(‘whatever’).然后(…).
更新:
我们在Angular 2.1中遇到了一些问题,它不喜欢创建一个新的事件(…),所以我们做了:
import { dispatchEvent } from '@angular/platform-browser/testing/browser-util'; ... function sendInput(text: string) { inputElement.value = text; dispatchEvent(fixture.nativeElement,'input'); fixture.detectChanges(); return fixture.whenStable(); }