Datepicker и Timepicker не инициализируются при выполнении теста - PullRequest
0 голосов
/ 03 января 2019

В моем приложении Angular я часто использую компоненты datepicker и timepicker из ngx-bootstrap .

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

first line debugger

Я установил точку останова в первой строке моего теста.

Когда тестовый пример завершается, я вижу, что компоненты datepicker и timepicker правильно инициализированы:

enter image description here

Мой код следующий:

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

  beforeEach(async(() => {

    TestBed.configureTestingModule({
      declarations: [
        MyComponent,
        // ...
      ],
      imports: [
        BsDatepickerModule.forRoot(),
        TimepickerModule.forRoot(),
        // ...
      ],
      providers: [
        // ...
      ]
    })
      .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(MyComponent);
    component = fixture.componentInstance;
    fixture.autoDetectChanges(true);
  });

  it('some expectation here', () => {
    // whatever I put here, at this line the datepicker and timepicker will NOT be initialised
  });
});

как мне запустить тестовый набор ПОСЛЕ того, что компоненты datepicker и timepicker были инициализированы?


EDIT

Я провел больше расследований, вопрос о [(ngModel)]="time" элемента <timepicker> в основном он запускается только ПОСЛЕ моего выхода из тестового примера.

как я могу запустить его вручную?

Я пытался с timepickerElement.dispatchEvent(new Event('input'));, но он не работает.

также пытался fixture.detectChanges(), fakeAsync + tick() и т. Д., Но не смог решить проблему.

1 Ответ

0 голосов
/ 15 января 2019

Проблема заключалась в том, что директива [(ngModel)] для Datepicker и Timepicker срабатывала только после того, как был выполнен тестовый случай (потому что я оборачиваю их в пользовательский компонент, который затем используется в качестве элемента управления формы).

Чтобы вызвать это, мне нужно было добавить:

datetimeElement.dispatchEvent(new Event('change'));
timepickerElement.dispatchEvent(new Event('change'));
fixture.detectChanges();

после изменения значений элементов Datepicker и Timepicker.

...