Проверка входного значения угловой реактивной формы без настройки formcontrol - PullRequest
Новая
       32

Проверка входного значения угловой реактивной формы без настройки formcontrol

0 голосов
/ 08 мая 2018

У меня есть такая форма: 

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

У меня есть такой тест: 

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();

В моем компоненте входное значение не обновляет 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));

1 Ответ

0 голосов
/ 08 мая 2018

Вам необходимо активировать обнаружение изменений, отправив событие изменения со входа, а затем обнаружить изменения. Я делаю это следующим образом. 

const e:Event = document.createEvent('Event');
e.initEvent('input', false, false);
inputUser.value = 'Bob';
inputUser.dispatchEvent(e);
fixture.detectChanges();
fixture.whenStable().then(() => expect(something).toEqual('something'));
...