diff --git a/npm/ng-packs/packages/core/src/lib/abstracts/ng-model.component.ts b/npm/ng-packs/packages/core/src/lib/abstracts/ng-model.component.ts index fb9cb55d79a..16fa3750e6e 100644 --- a/npm/ng-packs/packages/core/src/lib/abstracts/ng-model.component.ts +++ b/npm/ng-packs/packages/core/src/lib/abstracts/ng-model.component.ts @@ -60,5 +60,6 @@ export class AbstractNgModelComponent implements ControlValueAcc setDisabledState(isDisabled: boolean): void { this.disabled = isDisabled; + this.cdRef.markForCheck(); } } diff --git a/npm/ng-packs/packages/core/src/lib/tests/ng-model.component.spec.ts b/npm/ng-packs/packages/core/src/lib/tests/ng-model.component.spec.ts index 587d8c0adca..62bc85e74b5 100644 --- a/npm/ng-packs/packages/core/src/lib/tests/ng-model.component.spec.ts +++ b/npm/ng-packs/packages/core/src/lib/tests/ng-model.component.spec.ts @@ -1,5 +1,5 @@ -import { Component, Input, OnInit } from '@angular/core'; -import { FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms'; +import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core'; +import { FormControl, FormsModule, NG_VALUE_ACCESSOR, ReactiveFormsModule } from '@angular/forms'; import { createHostFactory, SpectatorHost } from '@ngneat/spectator/vitest'; import { AbstractNgModelComponent } from '../abstracts'; @@ -48,3 +48,44 @@ describe('AbstractNgModelComponent', () => { expect(spectator.component).toBeTruthy(); }); }); + +@Component({ + selector: 'abp-test-disabled', + template: '', + changeDetection: ChangeDetectionStrategy.OnPush, + providers: [ + { + provide: NG_VALUE_ACCESSOR, + useExisting: TestDisabledComponent, + multi: true, + }, + ], +}) +export class TestDisabledComponent extends AbstractNgModelComponent {} + +describe('AbstractNgModelComponent setDisabledState', () => { + let spectator: SpectatorHost; + + const createHost = createHostFactory({ + component: TestDisabledComponent, + imports: [ReactiveFormsModule], + }); + + test('should refresh the view when the form control is disabled or enabled', () => { + const control = new FormControl(''); + spectator = createHost('', { + hostProps: { control }, + }); + const input = () => spectator.query('input') as HTMLInputElement; + + expect(input().disabled).toBe(false); + + control.disable(); + spectator.detectChanges(); + expect(input().disabled).toBe(true); + + control.enable(); + spectator.detectChanges(); + expect(input().disabled).toBe(false); + }); +});