ngx-bootstrap - не удается разрешить все параметры для BsModalService в модульных тестах

Я использую ModalService (3.0.1) ngx-bootstrap для показа модального диалога, содержащего компонент

this.modalRef = this.modalService.show(MyDialogComponent);

и у меня есть это в моем модульном тесте (шутка)

beforeEach(async(() => {
  TestBed.configureTestingModule({
    declarations: [MyComponent, MyDialogComponent],
    schemas: [CUSTOM_ELEMENTS_SCHEMA],
    providers: [MyService],
    imports: [
      ModalModule.forRoot(),
    ],
  })
  .compileComponents();
}));

Упрямая ошибка говорит мне Не удается разрешить все параметры для BsModalService: (?,?). Ответы, которые я смог найти, касались отсутствия надлежащего @Injectable() декоратор, но это, очевидно, вне моего контроля и, кроме всего прочего, не имеет значения и вводит в заблуждение - декоратор присутствует в исходном коде ngx-bootstrap.

Я пытался явно предоставить все компоненты и сервисы из пакета (а не ModuleWithProviders, но это тоже не помогло.

Не хватает идей.

Обновление 1

Пробовал комментировать и выходить

import 'core-js/es7/reflect';

в plyfills.ts. Кажется, не имеет значения. Разве есть параметр конфигурации Jest, связанный с тем, что мне не хватает?

2 ответа

Попробуйте импортировать core-js/es7/ отражения в ваши polyfills.ts, это необходимо для того, чтобы ваш тест работал

import 'core-js/es7/reflect';

Так как сервис от BsModalService динамически заполняет DOM (entryComponents), вы можете использовать API BrowserDynamicTestingModule, добавив в configureTestingModule:

beforeEach(async(() => {
TestBed.configureTestingModule({
    imports: [ ModalModule.forRoot() ],
    declarations: [ MyDialogComponent ],
}).overrideModule(BrowserDynamicTestingModule, {
  set: {
    entryComponents: [ HelloComponent ],
  }
}).compileComponents();

}));

вызвать элементы шаблона (например, кнопку) с помощью API отправки, а затем просто проверить, появляется ли оно в DOM.

Вот стек с ярким примером.

ПРИМЕЧАНИЕ. Поскольку ngx BsModalService заполняет DOM как одноуровневый элемент корневого узла angular, я не смог использовать Angular API для выбора модального элемента, поэтому вместо этого мне пришлось использовать DOM querySelector. Если у кого-то есть лучший способ, пожалуйста, прокомментируйте, чтобы я мог обновить

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