Unit Test Angular @Input set function not triggered

Question

In my Component

@Input('price')
set setPrice(price) {
    this.price = price;
    this.modifyTotalAmount();
}

test (component.spec.ts)

it('should call function ', () => {
    spyOn(fixture.componentInstance, 'modifyTotalAmount');
    fixture.componentInstance.price = 4500;
    fixture.detectChanges();
    const divActualPrice = fixture.debugElement.query(By.css('#actualPrice'));
    expect(divActualPrice.componentInstance.modifyTotalAmount).toHaveBeenCalled();
});

Normally when parent compoent value get changed this setPrice(price) hits and modifyTotalAmount() function called. But when unit test runs that modifyTotalAmount() not called. this test case get faild. I think what I have done in test case could be wrong. can anyone please clarify whats wrong with this.

Is this a spied function? divActualPrice.componentInstance.modifyTotalAmount — Drag13, Sep 14 '18 at 13:47
You should be setting the setPrice on line 2 not price property — Aniket Kadam, Sep 14 '18 at 14:07
You should do some more reading on how `get` and `set` works. I thinks you may have a misunderstanding. You are trying to call the property `price` on the instance. Why do you think this would cause the `setPrice` setter to be called? — Paul Samsotha, Sep 14 '18 at 18:00

score 3 · Answer 1 · answered Sep 14 '18 at 17:50

As Aniket Kadam already pointed out, when you set fixture.componentInstance.price = 4500 you are not using the setter setPrice that you would need to call in order to trigger this.modifyTotalAmount()

So do fixture.componentInstance.setPrice = 4500 instead.

Unit Test Angular @Input set function not triggered

In my Component

test (component.spec.ts)

1 Answers1