Тестирование асинхронного действия пользовательского интерфейса на Карме - PullRequest
Новая
       13

Тестирование асинхронного действия пользовательского интерфейса на Карме

2 голосов
/ 07 июля 2019

У меня есть следующий тест, в котором я обновляю одно текстовое поле, после чего выполняется вызов API, и после этого я ожидаю, что другое текстовое поле будет иметь то же значение на основе ответа API.Тем не менее, он продолжает сбой с ошибкой Expected '0' to equal '2'. Я ожидаю результат 2 = 2 на основе ответа от API.Любая идея, как я могу это исправить?

Stackblitz здесь: https://stackblitz.com/edit/http-get-post-dgcuur

Тест 

it('should successfuly convert A to A', fakeAsync(() => {
      fixture.detectChanges();
      fixture.whenStable().then(() => {
        let fromAmountValueEl = fixture.debugElement.query(By.css('#fromAmountValue')).nativeElement;
        expect(fromAmountValueEl.value).toEqual('0');
        let toAmountValueEl = fixture.debugElement.query(By.css('#toAmountValue')).nativeElement;
        expect(toAmountValueEl.value).toEqual('0');
        fromAmountValueEl.value = '2'
        fromAmountValueEl.dispatchEvent(new Event('input'));
        fromAmountValueEl.dispatchEvent(new KeyboardEvent('keyup', {
          'key': 'Enter'
        }));
        tick();
        fixture.whenStable().then(() => {
          fixture.detectChanges();
          expect(fromAmountValueEl.value).toEqual('2');
          expect(toAmountValueEl.value).toEqual('2');
        });
      });
    }));

Просмотр 

      <input class="form-control form-control-lg" type="number" placeholder="0" [(ngModel)]="fromAmount"
        (keyup)="updateRates()" id="fromAmountValue">
      <select class="form-control form-control-lg" id="fromCurrency">
        <option value="GBP">GBP</option>
      </select>

      <input class="form-control form-control-lg" type="number" placeholder="0" [(ngModel)]="toAmount"
        (keyup)="updateRates()" id="toAmountValue">
      <select class="form-control form-control-lg" [(ngModel)]="toCurrency" id="toCurrency">
        <option value="GBP">GBP</option>
      </select>

Контроллер 

  updateRates() {
    this.postSubscription = this.post().subscribe((data) => {
      if(data) {
        this.result = data;

        if (this.toCurrency == "GBP") {
          this.toAmount = this.fromAmount;
        }
      }
    });
  }
...