CODEWITHSUNDEEP
angularjasmine
decebal
decebal

Reputation: 1211

Check if element exists - Jasmine & Angular

I want to write a test to check if an element exists on the page after I click on it. So when I click on the element with the class "addItem", this element is hidden using an *ngIf. I tried it like this:

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();
});

but it says: Property 'toExist' does not exist on type 'Matchers<DebugElement>'. Can you please advise how to do this? Many thanks!

Upvotes: 25

Views: 47612

Answers (1)

MGDavies
MGDavies

Reputation: 1054

I'd recommend you use 

//    Add Item Debug Ele comes out as null.
addItemDebugElement = componentFixture.debugElement.query(By.css('.addItem'));
expect(addItemDebugElement).toBeFalsy();

and...

//    Add Item Debug Ele comes out as not null.
addItemDebugElement = componentFixture.debugElement.query(By.css('.addItem'));
expect(addItemDebugElement).toBeTruthy();

Upvotes: 31

Related Questions