Je veux écrire un test pour vérifier si un élément existe sur la page après avoir cliqué dessus. Ainsi, lorsque je clique sur l'élément avec la classe "addItem", cet élément est masqué à l'aide d'un * ngIf. J'ai essayé comme ça:
it('Should handle click on .addItem button', () => {
spyOn(component, 'addItem');
addItemDebugElement = componentFixture.debugElement.query(By.css('.addItem'));
addItemDebugElement.nativeElement.click(); // click on the button
expect(addItemDebugElement).toExist();
});
mais il est écrit: Property 'toExist' does not exist on type 'Matchers<DebugElement>'.
Pouvez-vous nous dire comment procéder? Merci beaucoup!
Vous pouvez essayer ceci pour vérifier si l'élément existe sur le Dom
expect($(document)).toContain(addItemDebugElement)
ou
expect(addItemDebugElement).toBeInDom();
Je vous recommande d'utiliser
// Add Item Debug Ele comes out as null.
addItemDebugElement = componentFixture.debugElement.query(By.css('.addItem'));
expect(addItemDebugElement).toBeFalsy();
et...
// Add Item Debug Ele comes out as not null.
addItemDebugElement = componentFixture.debugElement.query(By.css('.addItem'));
expect(addItemDebugElement).toBeTruthy();
voici la solution qui a fonctionné pour moi:
it('Should handle click on .addItem button', () => {
spyOn(component, 'addItem');
const fixture = TestBed.createComponent(AppComponent);
addItemDebugElement = fixture.debugElement.query(By.css('.addItem'));
addItemDebugElement.nativeElement.click();
expect(fixture.debugElement.nativeElement).toContain(addItemDebugElement);
});