小编Dan*_*iew的帖子

在不设置FormControl的情况下测试角度无功形式输入值

我有这样的形式:

<form id="save_form" (ngSubmit)="save()">
    <input id="input_user" type="text" [formControl]="myForm" />
    <button type="submit">save</button>
</form>
Run Code Online (Sandbox Code Playgroud)

我有这样的测试:

const inputUser: HTMLInputElement = fixture.nativeElement.querySelector("#input_user");
const saveForm: DebugElement = fixture.debugElement.query(By.css("#save_form"));

inputUser.value = "Bob";
//component.myForm.setValue("Bob");

saveForm.triggerEventHandler("ngSubmit", null);

fixture.detectChanges();
Run Code Online (Sandbox Code Playgroud)

在我的组件中,输入值未更新myForm。如果我使用注释掉的语法,则会更新表单,但不会填充输入标签。

我正在尝试模拟用户的输入值,是否应该通过测试中的输入值来更新formcontrol?我觉得如果我只是手动更新formcontrol,那我就不是在模拟用户。

更新:

    //component.searchUsers.setValue("Bob");
    const e: Event = document.createEvent("Event");
    e.initEvent("input", false, false);
    inputUser.value = "Bob";
    inputUser.dispatchEvent(e);
    fixture.detectChanges();

    myForm.triggerEventHandler("ngSubmit", null);
    fixture.detectChanges();
    fixture.whenStable().then(() => 
    expect(condition).toBe(true));
Run Code Online (Sandbox Code Playgroud)

karma-jasmine angular angular-reactive-forms angular-test

6
推荐指数
1
解决办法
2041
查看次数