Модульный тест для кнопки с отключением - PullRequest
Новая
       6

Модульный тест для кнопки с отключением

0 голосов
/ 28 июня 2018

Я пытаюсь написать модульный тест для отключенной кнопки, назначенной логическому значению.

HTML выглядит так: 

<button *ngIf="!data" id="createBtn" mat-button color="primary" (click)="submitNewCase()" [disabled]="disableCreate">{{ 'ACTIONS.create' | translate }}</button>

мой юнит-тест: 

beforeEach(() => {
 fixture = TestBed.createComponent(CaseComponent);
 component = fixture.componentInstance;
 fixture.detectChanges();
 submitEl = fixture.debugElement.query(By.css('button'));
});


  it('DisableCreate set to true disables the submit button', () => {
   component.disableCreate = true;
   fixture.detectChanges();
   expect(submitEl.nativeElement.disabled).toBeTruthy();
  });

  it('DisableCreate set to false enables the submit button', () => {
   component.disableCreate = false;
   fixture.detectChanges();
   expect(submitEl.nativeElement.disabled).toBeFalsy();
  });

Мой второй модульный тест прошел успешно, а мой первый - нет. Я получаю обратно «Ожидаемая ложь, чтобы быть правдой». Я не могу найти, где это терпит неудачу и почему.

Любая помощь будет высоко ценится.

1 Ответ

0 голосов
/ 29 июня 2018

Так что после того, как я чуть дольше ударился головой о стол, похоже, я неправильно выбрал кнопку. Использование querySelector для кнопки успешно завершило мой тест. Кроме того, @Fateh Мохамеду для комментария необходимо задать для component.data значение null, поскольку для данных имеется кнопка ngIf. 

beforeEach(() => {
 fixture = TestBed.createComponent(CaseComponent);
 component = fixture.componentInstance;
 fixture.detectChanges();
 submitEl = fixture.debugElement
});

it('DisableCreate set to true disables the submit button', () => {
 component.disableCreate = true;
 component.data = null;
 fixture.detectChanges();
 expect(submitEl.nativeElement.querySelector('button').disabled).toBeTruthy();
});

it('DisableCreate set to false enables the submit button', () => {
 component.disableCreate = false;
 component.data = null;
 fixture.detectChanges();
 expect(submitEl.nativeElement.querySelector('button').disabled).toBeFalsy();
});
...