Есть ли способ настроить component.spec.ts автоматически? - PullRequest
0 голосов
/ 15 февраля 2019

Я добавляю юнит-тесты в приложение Angular 7.У меня есть 100 компонентов для тестирования, по крайней мере, и каждый из них дает сбой из-за конфигурации: им нужно объявление всех необходимых зависимостей.

Это мой component.spec.ts, где находится конфигурация при выполненииng test:

    import { async, ComponentFixture, TestBed } from 
    '@angular/core/testing';

    import { myComponent } from './mycomponent';
    import { FontAwesomeModule } from '@fortawesome/angular- 
    fontawesome';

    describe('myComponent', () => {
      let component: myComponent;
      let fixture: ComponentFixture<myComponent>;

      beforeEach(async(() => {
        TestBed.configureTestingModule({
          declarations: [ myComponent ],
          imports: [
            FontAwesomeModule
            // + Others imports
          ]
        })
        .compileComponents();
      }));

      beforeEach(() => {
        fixture = TestBed.createComponent(myComponent);
        component = fixture.componentInstance;
        fixture.detectChanges();
      });

      it('should create', () => {
        expect(component).toBeTruthy();
      });
    });

В некоторых компонентах я добавляю провайдеров.В некоторых случаях я использую mockService.Все, что я сделал, исходит от angular docs .

Есть ли способ легко или автоматически настроить модульные тесты (или сквозные тесты) с Angular вместо добавления каждого модуля, необходимого вручную?

Я использую Angular 7, жасмин (3.3.1) и карму (4.0.0).

Ответы [ 2 ]

0 голосов
/ 05 марта 2019

Я провел несколько исследований с , что является лучшим способом тестирования с Angular , и я нашел ответ здесь , с несколькими решениями и отличными объяснениями!

0 голосов
/ 16 февраля 2019

Я обычно импортирую все зависимости по отдельности, так как я проверяю, что тест загружает только те зависимости, которые ему действительно нужны.Тем не менее, я нашел способ легко сделать все зависимости доступными для вашего тестового скрипта без необходимости индивидуального импорта каждой зависимости.Вместо того чтобы импортировать все зависимости по отдельности, импортируйте модуль, который объявляет ваш компонент тестируемым.Импортируя модуль в свой модульный тест, вы сделаете все зависимости, включая сервисы и сам компонент, доступными для ваших тестов.

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

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

PS Могут быть зависимости, которые импортируются вашим AppModule.Их, возможно, придется импортировать по отдельности вместе с модулем объявления компонента.

Тестовый скрипт

import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { EasyImportComponent } from './easy-import.component';
import { EasyImportModule } from './easy-import.module';

describe('EasyImportComponent', () => {
  let component: EasyImportComponent;
  let fixture: ComponentFixture<EasyImportComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [ EasyImportModule ]
        //, declarations: [ EasyImportComponent ] <-- No longer needed since module declares this already
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(EasyImportComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});
...