Событие пожарной тревоги из теста Angular 5 - PullRequest
Новая
       18

Событие пожарной тревоги из теста Angular 5

0 голосов
/ 25 июня 2018

Я пробовал кое-что и смотрел на Angular docs в течение часа плюс, и до сих пор не могу пройти этот тест.Я использую Jest (который очень похож на Jasmine).Дело в том, что он работает в приложении, когда я ng serve, я просто не могу написать для него проходной тест!

HTML-шаблон 

 id="typeahead-plan"
   placeholder="search"
   type="text" class="form-control br--top"
   [(ngModel)]="selections.clientId"
   [ngbTypeahead]="searchClients"
   (input)="resetFileId()"
   (blur)="filterFileIds()"
   (keyup.enter)="filterFileIds()"
   (selectItem)="selectClientPlan($event.target.value)" />

Spec 

test('Submit button is disabled when changing plan', () => {
  component.resetFileId = jest.fn();
  fixture.detectChanges();
  const submitEl = fixture.debugElement.query(
    By.css('button[data-test=submit]')
  );
  const planInputEl = fixture.debugElement.query(By.css('#typeahead-plan'));
  expect(submitEl.nativeElement.attributes['disabled']).not.toBeDefined();

  planInputEl.nativeElement.value = 'd';
  planInputEl.triggerEventHandler('input', null);
  fixture.detectChanges();
  expect(component.resetFileId).toHaveBeenCalled();
  expect(submitEl.nativeElement.attributes['disabled']).toBeTruthy();
});

Тест говорит, что ожидалось, что шпион был вызван, но никогда не был, поэтому я думаю, что я не запускаю событие ввода правильно.Если я закомментирую утверждение toHaveBeenCalled, то следующее не получится, так как кнопка отправки не имеет атрибута disabled.Опять же, все работает нормально, щелкая пользовательский интерфейс вручную, но не в тестах.Подобные вещи продолжают набирать голову, когда я пытаюсь научиться писать тесты, и это действительно расстраивает и замедляет мою разработку.

1 Ответ

0 голосов
/ 25 июня 2018

Похоже, я должен включить объект с целью при поднятии события. Угловые документы состояние:

В тесте предполагается (правильно в данном случае), что обработчик события времени выполнения - метод click () компонента - не заботится об объекте события.

Другие обработчики менее прощающие. Например, директива RouterLink ожидает объект со свойством кнопки, которое определяет, какая кнопка мыши (если есть) была нажата во время щелчка. Директива RouterLink выдает ошибку, если объект события отсутствует.

Однако они не говорят, что такое «другие обработчики» или что им нужно, что, по-видимому, является явным упущением.

Итак, если я сделаю: inputEl.triggerEventHandler('input', { target: inputEl.nativeElement });, то событие сработает, и он обнаружит, что функция была вызвана.

...