Angular2 Component: Testing form input value change Angular2 Component: Testing form input value change angular angular

Angular2 Component: Testing form input value change


It might be a little bit late, but it seems that your code is not dispatching input event after setting input element value:

// ...    input.value = 'fake-search-query';input.dispatchEvent(new Event('input'));cmpFixture.detectChanges();// ...

Updating input html field from within an Angular 2 test


Triggering the value change of FormControl is as simple as:

cmpFixture.debugElement.componentInstance.searchInput.setValue(newValue);


Custom component with @input, subscriptions, two way data binding

If you got a custom component you would need further changes in your application to be able to successfully unit test your application

have a look at the gist here this will give you some ideahttps://gist.github.com/AikoPath/050ad0ffb91d628d4b10ef81736af386/raw/846c7bcfc54be8cce78eba8d12015bf749b91eee/@ViewChild(ComponentUnderTestComponent).js

More over complete reading over here carefully otherwise you can easily get confused again -https://betterprogramming.pub/testing-angular-components-with-input-3bd6c07cfaf6