Angular 6. Как тестировать внедренные компоненты

У меня есть компонент FAB, разделенный на 3 части: компонент триггера, компонент действий и основной компонент, собирающий все вместе.

Компоненты Trigger и Actions имеют внедренного родителя, например:

constructor(
  @Inject(forwardRef(() => FabSpeedDialComponent)) private _parent: 
FabSpeedDialComponent,
  private renderer: Renderer
) { }

Родитель имеет круговую зависимость от своих действий: @ContentChild(FabSpeedDialActionsComponent) _childActions: FabSpeedDialActionsComponent;

Он отлично работает, но у меня проблемы с тестированием такого поведения. Например, есть тест на компонент actions:

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

import { FabSpeedDialActionsComponent } from './fab-speed-dial-actions.component';

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

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [FabSpeedDialActionsComponent]
    })
      .compileComponents();
  }));

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

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

Это не сработает с этой ошибкой:

Error: StaticInjectorError(DynamicTestModule)[FabSpeedDialActionsComponent -> FabSpeedDialComponent]: StaticInjectorError(Platform: core)[FabSpeedDialActionsComponent -> FabSpeedDialComponent]: NullInjectorError: No provider for FabSpeedDialComponent!

Даже если я попытаюсь добавить его в объявления, все равно ничего не получится.

Документация
user4676340 21.11.2018 13:26

@trichetriche там о неработающих сервисах, а не о компонентах. Ни слова о компонентах forwardRef.

Iworb 21.11.2018 13:32

Вы, видимо, пропустили часть насмешек.

user4676340 21.11.2018 13:34

Вы пробовали добавить FabSpeedDialComponent в список поставщиков TestBed? то есть: после объявлений добавьте запятую, а затем новую строку с providers: [FabSpeedDialComponent]. Вы также можете издеваться над FabSpeedDialComponent и вместо этого вставить шпион / макет.

dmcgrandle 21.11.2018 22:34
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
4
1 193
0

Другие вопросы по теме