Angular 5 & Jasmine - Как смоделировать activeRoute.firstChild для проверки отказа от подписки на ngOnDestroy

Question

В моем Angular-компоненте я создаю две наблюдаемые, используя следующий код

this.navigationEnd = this.router.events.subscribe((event: any) => {
  // do some stuff
});

if (this.activeRoute.firstChild) {
  this.activeRouteChild = this.activeRoute.firstChild.params.subscribe((routeParams) => {
    // do some stuff
  });
}

Как вы можете видеть, я подписываюсь на activeRoute и router.events.Поскольку я хороший программист, я обязательно отменяю подписку на оба при уничтожении компонента, используя ngOnDestroy

public ngOnDestroy(): void {
  if (this.navigationEnd) {
    this.navigationEnd.unsubscribe();
  }
  if (this.activeRouteChild) {
    this.activeRouteChild.unsubscribe();
  }
}

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

describe('ngOnDestroy', () => {
  it('should unsubscribe from navigationEnd & activeRouteChild on ngOnDestroy', () => {
    // arrange

    fixture.detectChanges();

    // act
    instance.ngOnDestroy();

    // assert
    expect((instance as any).navigationEnd.closed).toBeTruthy();
    expect((instance as any).activeRouteChild.closed).toBeTruthy();
  });
});

Я высмеиваю и Router, и ActivatedRoute следующим образом:

class MockRouter {
  // Router
  public events = of(new NavigationEnd(1, 'url/1', 'url/1'));
  public navigate = () => true;
}

class MockActivatedRoute {
  public firstChild = {params: of({id: '1'})};
}

, и вот как я их объявляю в массиве provider:

{provide: Router, useClass: MockRouter },
{provide: ActivatedRoute, useValue: MockActivatedRoute}

Mock Router отлично работает, однако это проблема MockActivationRoute, так как я думаю, что неправильно реализую свойство firstChild.Я получаю сообщение об ошибке «Ошибка типа: невозможно прочитать свойство« закрыто »из неопределенного» - у меня вопрос: как правильно смоделировать ActivatedRoute и его свойство firstChild?

Answer 1

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

note : что касается тестирования, я обнаружил, что не часто полезно тестировать API, которые вы не писали, если только вывносят свой вклад в них.unsubscribe () работает, и мы знаем это, потому что разработчики Angular написали для него тесты.Самостоятельное тестирование, хотя и неплохое, часто оказывается пустой тратой времени, поскольку оно уже было протестировано в исходном коде Angular.