ng- bootstrap модальный сбой в модульном тесте - PullRequest
Новая
       20

ng- bootstrap модальный сбой в модульном тесте

1 голос
/ 18 апреля 2020

Я столкнулся с проблемой, когда NgbModal не открывается в тестовом жгуте. Проблема возникает, когда я пытаюсь открыть модальное внутри модальной службы: 

@Injectable({
  providedIn: 'root'
})
export class ModalService {
  constructor(private modalService: NgbModal) {}

  /**
   * Opens an extra large modal dialog
   * @param component The content component
   */
  openExtraLarge<T>(component: Type<T>): NgbModalRef {
    return this.modalService.open(component, { windowClass: 'dark-modal', size: 'xl', centered: true });
  }
}

Мой тестовый комплект: 

describe('ModalService', () => {
  let service: ModalService;

  beforeEach(() => {
    TestBed.configureTestingModule({});
    service = TestBed.inject(ModalService);
  });

  it('should be created', () => {
    expect(service).toBeTruthy();
  });

  it('should open a dialog directly in the test', () => {
    spyOn(service, 'openExtraLarge');

    const myModal = service.openExtraLarge(TestModalComponent);

    expect(service.openExtraLarge).toHaveBeenCalled();
    expect(myModal).not.toBeUndefined();
  });

});

Я создал пример стекаблиц здесь

Я подозреваю, что проблема связана с тем фактом, что Компонент не внедряется в службу, но тест завершается неудачно (ожидается, что undefined не будет неопределенным).

Что может быть источником моей проблемы?

1 Ответ

1 голос
/ 18 апреля 2020

Проблема в том, что вы перехватили исходный вызов и ожидаете, что он все равно вернет некоторое значение. 

spyOn(service, 'openExtraLarge');

Это означает, что вы полностью изменили поведение метода openExtraLarge. И он ничего не возвращает (undefined)

Если вы хотите, чтобы он что-то возвращал, вы должны сообщить шпиону, что возвращать, например: 

spyOn(service, 'openExtraLarge').and.returnValue('something');

, или вы можете событие выполнить оригинальный метод, но должны Правильно настройте модуль тестирования: 

@NgModule({
  declarations: [TestModalComponent],
  entryComponents: [TestModalComponent]
})
export class TestModule {}

...
TestBed.configureTestingModule({
  imports: [TestModule, NgbModalModule]
});

...

spyOn(service, 'openExtraLarge').and.callThrough();

Разветвленный стек-блиц

...