I am stuck with testing a component that uses a checkbox with angular (version 8). I created a simple component that looks like this (to analyse the problem):
<div>
<input
type="checkbox"
[(ngModel)]="isChecked"
name="mycheckbox">
</div>
The component itself has a simple property isChecked. I tried to check the checkbox and then assert that isChecked is true. Without success. Here some versions:
fit('should be checked sync 1', () => {
const checkBox = fixture.debugElement.query(By.css('input')).nativeElement;
checkBox.checked = true;
checkBox.dispatchEvent(new Event('changed'));
fixture.detectChanges();
expect(component.isChecked).toBeTruthy(); //fails, is false
});
fit('should be checked sync 2', () => {
const checkBox = fixture.debugElement.query(By.css('input'));
checkBox.nativeElement.checked = true;
checkBox.triggerEventHandler('change', null);
fixture.detectChanges();
expect(component.isChecked).toBeTruthy(); //fails, is false
});
fit('shlould be checked async', async(async () => {
const checkBox: HTMLInputElement = fixture.debugElement.query(By.css('input')).nativeElement;
checkBox.checked = true;
checkBox.dispatchEvent(new Event('changed'));
await fixture.whenStable();
fixture.detectChanges();
expect(component.isChecked).toBeTruthy(); //fails, is false
}));
How do I do this?
Aucun commentaire:
Enregistrer un commentaire