Угловой 7: привязка данных ngModel не обновляет свойство компонента в модульном тесте - PullRequest
2 голосов
/ 05 июня 2019

У меня есть компонент Angular 7 со свойством searchTerm и элемент input в его шаблоне.Значение свойства привязывается к значению элемента ввода с помощью [(ngModel)]="searchTerm":

@Component({
  selector: 'app-search',
  template: `
    <form class="search-form">
      <mat-form-field class="search-form-field">
        <input matInput
               type="text"
               id="search-input"
               [(ngModel)]="searchTerm"
               name="search-input">
      </mat-form-field>
    </form>
  `,
  styleUrls: ['./search.component.scss']
})
export class SearchComponent {
  searchTerm: string;
}

В моих модульных тестах я пытаюсь проверить, изменяется ли свойство на значение элемента ввода:

it('should update searchTerm according to the input-value', async (() => {
    fixture = TestBed.createComponent(SearchComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();

    const input = fixture.debugElement
                  .query(By.css('#search-input')).nativeElement;
    input.value = 'test-value';
    input.dispatchEvent(new Event('input'));
    fixture.detectChanges();

    fixture.whenStable().then(() =>
      expect(component.searchTerm).toEqual('test-value')
    );
  }));

Однако все, что я получаю, это следующее сообщение об ошибке:

Ожидается, что неопределенное значение равно 'test-value'.

Интереснотем не менее, привязка полностью работает, когда я вручную пробую в браузере.Кроме того, я уже пытался использовать fakeAsync вместо async в своей тестовой функции, но это не имело никакого значения.

Что я делаю не так?

...