feat(forms): make DefaultValueAccessor directive standalone

This commit make the DefaultValueAccessor directive standalone allowing it to be used as hostDirective Fixes: angular#48607
JeanMeche · Jan 2, 2023 · 4f3f214 · 4f3f214
1 parent 27da733
commit 4f3f214
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 8 deletions.
diff --git a/goldens/public-api/forms/index.md b/goldens/public-api/forms/index.md
@@ -198,7 +198,7 @@ export class DefaultValueAccessor extends BaseControlValueAccessor implements Co
     constructor(renderer: Renderer2, elementRef: ElementRef, _compositionMode: boolean);
     writeValue(value: any): void;
     // (undocumented)
-    static ɵdir: i0.ɵɵDirectiveDeclaration<DefaultValueAccessor, "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]", never, {}, {}, never, never, false, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<DefaultValueAccessor, "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]", never, {}, {}, never, never, true, never>;
     // (undocumented)
     static ɵfac: i0.ɵɵFactoryDeclaration<DefaultValueAccessor, [null, null, { optional: true; }]>;
 }

diff --git a/packages/forms/src/directives.ts b/packages/forms/src/directives.ts
@@ -45,11 +45,10 @@ export {NgSelectOption, SelectControlValueAccessor} from './directives/select_co
 export {NgSelectMultipleOption, SelectMultipleControlValueAccessor} from './directives/select_multiple_control_value_accessor';
 export {CALL_SET_DISABLED_STATE} from './directives/shared';
 
-export const SHARED_FORM_DIRECTIVES: Type<any>[] = [
+const SHARED_FORM_DIRECTIVES: Type<any>[] = [
   NgNoValidate,
   NgSelectOption,
   NgSelectMultipleOption,
-  DefaultValueAccessor,
   NumberValueAccessor,
   RangeValueAccessor,
   CheckboxControlValueAccessor,
@@ -78,8 +77,8 @@ export const REACTIVE_DRIVEN_DIRECTIVES: Type<any>[] =
  */
 @NgModule({
   declarations: SHARED_FORM_DIRECTIVES,
-  imports: [RadioControlRegistryModule],
-  exports: SHARED_FORM_DIRECTIVES,
+  imports: [RadioControlRegistryModule, DefaultValueAccessor],
+  exports: [...SHARED_FORM_DIRECTIVES, DefaultValueAccessor],
 })
 export class ɵInternalFormsSharedModule {
 }

diff --git a/packages/forms/src/directives/default_value_accessor.ts b/packages/forms/src/directives/default_value_accessor.ts
@@ -81,7 +81,8 @@ export const COMPOSITION_BUFFER_MODE = new InjectionToken<boolean>('CompositionE
     '(compositionstart)': '$any(this)._compositionStart()',
     '(compositionend)': '$any(this)._compositionEnd($event.target.value)'
   },
-  providers: [DEFAULT_VALUE_ACCESSOR]
+  providers: [DEFAULT_VALUE_ACCESSOR],
+  standalone: true,
 })
 export class DefaultValueAccessor extends BaseControlValueAccessor implements ControlValueAccessor {
   /** Whether the user is creating a composition string (IME events). */

diff --git a/packages/forms/test/directives_spec.ts b/packages/forms/test/directives_spec.ts
@@ -6,8 +6,8 @@
  * found in the LICENSE file at https://angular.io/license
  */
 
-import {SimpleChange} from '@angular/core';
-import {fakeAsync, flushMicrotasks, tick} from '@angular/core/testing';
+import {Component, SimpleChange} from '@angular/core';
+import {fakeAsync, flushMicrotasks, TestBed, tick} from '@angular/core/testing';
 import {AbstractControl, CheckboxControlValueAccessor, ControlValueAccessor, DefaultValueAccessor, FormArray, FormArrayName, FormControl, FormControlDirective, FormControlName, FormGroup, FormGroupDirective, FormGroupName, NgControl, NgForm, NgModel, NgModelGroup, SelectControlValueAccessor, SelectMultipleControlValueAccessor, ValidationErrors, Validator, Validators} from '@angular/forms';
 import {selectValueAccessor} from '@angular/forms/src/directives/shared';
 import {composeValidators} from '@angular/forms/src/validators';
@@ -39,6 +39,23 @@ class CustomValidatorDirective implements Validator {
       defaultAccessor = new DefaultValueAccessor(null!, null!, null!);
     });
 
+    describe('DefaultValueAccessor', () => {
+      it('DefaultValueAccessor should be available as a standalone directive', () => {
+        @Component({
+          selector: 'test-component',
+          hostDirectives: [DefaultValueAccessor],
+          template: `<input />`,
+        })
+        class TestComponent {
+        }
+
+        const fixture = TestBed.createComponent(TestComponent);
+        fixture.detectChanges();
+
+        expect(fixture.componentInstance).toBeTruthy();
+      });
+    })
+
     describe('shared', () => {
       describe('selectValueAccessor', () => {
         let dir: NgControl;