jeudi 25 janvier 2018

how to fake click md-slide-toggle in jasmine test

I want to test isMultipleInvoice state turns false with the toggle click.I simulate toggle click calling dispatchEvent,triggerEventHandler with click,input,change but isMultipleInvoice state is always true. I have included everthing I tried in comment lines.

view:

<md-slide-toggle class="gregreger" [(ngModel)]="isMultipleInvoice">Default Name & Address</md-slide-toggle>

<div *ngIf="!isMultipleInvoice">
  <form [formGroup]="customerDetailFormGroup3" (ngSubmit)="logForm()">

    <div>
      <div style="color: red"
           *ngIf="customerDetailFormGroup3.controls.vatNumber.errors && customerDetailFormGroup3.controls.vatNumber.dirty">
        <div *ngFor="let property of customerDetailFormGroup3.controls.vatNumber.errors | keys">
          <label class="errorMessage"></label>
        </div>
      </div>
      <md-input-container>
        <input formControlName="vatNumber" mdInput placeholder="Vat"
               [(ngModel)]="customer.paymentOrganization.vatNumber"/>
      </md-input-container>
    </div>

    <div>
      <div style="color: red"
           *ngIf="customerDetailFormGroup3.controls.taxOffice.errors && customerDetailFormGroup3.controls.taxOffice.dirty">
        <div *ngFor="let property of customerDetailFormGroup3.controls.taxOffice.errors | keys">
          <label class="errorMessage"></label>
        </div>
      </div>
      <md-input-container>
        <input formControlName="taxOffice" mdInput placeholder="Vat Office"
               [(ngModel)]="customer.paymentOrganization.taxOffice"/>
      </md-input-container>
    </div>

  </form>
</div>

test:

it('should to be false isMultipleInvoice', fakeAsync(() => {

expect(component.isMultipleInvoice).toBeTruthy("isMultipleInvoice must true")
    let toggle = fixture.debugElement.query(By.css(".gregreger"))

    toggle.nativeElement.dispatchEvent(new Event('change'))
    //toggle.nativeElement.dispatchEvent(new Event('input'))
    //toggle.triggerEventHandler("change",null)

    fixture.detectChanges()
    tick()
expect(component.isMultipleInvoice).toBeFalsy("toggle should update model")}))

Aucun commentaire:

Enregistrer un commentaire