angular тестирование компонента с использованием жасмина при вызове метода в html - PullRequest
Новая
       109

angular тестирование компонента с использованием жасмина при вызове метода в html

0 голосов
/ 29 мая 2020

Я должен проверить эту странную ситуацию. В моем html у меня есть: 

    <div id="date">
      <h5>
        {{ showFormattedDate(myDate) }}
      </h5>
    </div>

Функция showFormattedDate() определена в .ts следующим образом: 

  showFormattedDate(dateToFormat: string): string {
    return moment(dateToFormat).format('HH:mm DD/M/YYYY');
  }

Теперь я пытаюсь проверить это, но я продолжайте получать эту ошибку:

Ожидается, что 'Created at Invalid date' будет '12: 23 29/5/2020 '.

Недействительная часть даты также является Я вижу долю секунды на экране, когда страница загружается, но это из-за вызова функции, я думаю.

Я пробовал протестировать его двумя способами: 

  it('should display the date correctly', async () => {
    fixture.detectChanges();
    // await fixture.whenStable();
    // await fixture.isStable();
    // await fixture.whenRenderingDone();

    expect(el.query(By.css('#date')).nativeElement.textContent).toContain(
      getTestData().date);
  });

  it('should display the date correctly (async)', async(() => {
    fixture.detectChanges();

    fixture.whenStable().then(() => {
      // wait for async getQuote
      fixture.detectChanges(); // update view with quote
      expect(el.query(By.css('#date')).nativeElement.textContent).toContain(getTestData().date);
    });
  }));

Но оба возвращают вышеупомянутую ошибку. Как я мог это решить?

1 Ответ

1 голос
/ 29 мая 2020

Вызов метода в выражении шаблона считается плохой практикой в ​​angular. Так что вы можете сначала избежать этого.

Прочтите this , чтобы узнать больше об этом.

Здесь вы можете использовать Angular Pipe, который преобразует вашу дату в желаемый формат, и вы можете протестировать метод преобразования вашего канала.

Подробнее об использовании Angular нажмите трубу здесь и чтобы узнать, как проверить свою angular трубу, вот хорошая статья для того же.

...