I am working on a component in Angular 5 where I am trying to write unit tests to ensure that when the component is disabled, it should not be possible to set a value to its model. However, even after disabling it, I am still able to change the value.
[(ngModel)]="value"
[attr.disabled]="disabled ? 'disabled' : null"
The test I have written so far is giving me an error:
it("DISABLED", async(() => {
component.disabled = true;
component.value = 'testtesttest';
fixture.detectChanges();
const htmlInputComponent: HTMLElement = fixture.nativeElement;
const inputValue = htmlInputComponent.querySelector('input').value;
expect(inputValue).toBeFalsy();
}));
I have also tried adding some rules in ngOnChange, but the changes in value are still being allowed.