/**

* @license

* Copyright Google LLC All Rights Reserved.

*

* Use of this source code is governed by an MIT-style license that can be

* found in the LICENSE file at https://angular.dev/license

*/

import {Component, Directive, effect, forwardRef, signal} from '@angular/core';

import {TestBed} from '@angular/core/testing';

import {of} from 'rxjs';

import {

AbstractControl,

ControlValueAccessor,

FormArray,

FormControl,

FormGroup,

NG_VALUE_ACCESSOR,

ReactiveFormsModule,

ValidationErrors,

ValidatorFn,

} from '../index';

import {Validators} from '../src/validators';

import {timeout, useAutoTick} from '@angular/private/testing';

import {asyncValidator} from './util';

(function () {

describe('FormArray', () => {

useAutoTick();

describe('adding/removing', () => {

let a: FormArray;

let c1: FormControl, c2: FormControl, c3: FormControl;

let logger: string[];

beforeEach(() => {

a = new FormArray<any>([]);

c1 = new FormControl(1);

c2 = new FormControl(2);

c3 = new FormControl(3);

logger = [];

});

it('should support pushing', () => {

a.push(c1);

expect(a.length).toEqual(1);

expect(a.controls).toEqual([c1]);

});

it('should support pushing an array', () => {

a.push([c1, c2]);

expect(a.length).toEqual(2);

expect(a.controls).toEqual([c1, c2]);

});

it('should support removing', () => {

a.push(c1);

a.push(c2);

a.push(c3);

a.removeAt(1);

expect(a.controls).toEqual([c1, c3]);

});

it('should support clearing', () => {

a.push(c1);

a.push(c2);

a.push(c3);

a.clear();

expect(a.controls).toEqual([]);

a.clear();

expect(a.controls).toEqual([]);

});

it('should support inserting', () => {

a.push(c1);

a.push(c3);

a.insert(1, c2);

expect(a.controls).toEqual([c1, c2, c3]);

});

it('should not emit events when calling `FormArray.push` with `emitEvent: false`', () => {

a.valueChanges.subscribe(() => logger.push('value change'));

a.statusChanges.subscribe(() => logger.push('status change'));

a.push(c1, {emitEvent: false});

expect(a.length).toEqual(1);

expect(a.controls).toEqual([c1]);

expect(logger).toEqual([]);

});

it('should not emit events when calling `FormArray.removeAt` with `emitEvent: false`', () => {

a.push(c1);

a.push(c2);

a.push(c3);

a.valueChanges.subscribe(() => logger.push('value change'));

a.statusChanges.subscribe(() => logger.push('status change'));

a.removeAt(1, {emitEvent: false});

expect(a.controls).toEqual([c1, c3]);

expect(logger).toEqual([]);

});

it('should not emit events when calling `FormArray.clear` with `emitEvent: false`', () => {

a.push(c1);

a.push(c2);

a.push(c3);

a.valueChanges.subscribe(() => logger.push('value change'));

a.statusChanges.subscribe(() => logger.push('status change'));

a.clear({emitEvent: false});

expect(a.controls).toEqual([]);

expect(logger).toEqual([]);

});

it('should not emit events when calling `FormArray.insert` with `emitEvent: false`', () => {

a.push(c1);

a.push(c3);

a.valueChanges.subscribe(() => logger.push('value change'));

a.statusChanges.subscribe(() => logger.push('status change'));

a.insert(1, c2, {emitEvent: false});

expect(a.controls).toEqual([c1, c2, c3]);

expect(logger).toEqual([]);

});

it('should not emit events when calling `FormArray.setControl` with `emitEvent: false`', () => {

a.push(c1);

a.push(c3);

a.valueChanges.subscribe(() => logger.push('value change'));

a.statusChanges.subscribe(() => logger.push('status change'));

a.setControl(1, c2, {emitEvent: false});

expect(a.controls).toEqual([c1, c2]);

expect(logger).toEqual([]);

});

it('should not emit status change events when `FormArray.push` is called with `emitEvent: false`', () => {

// Adding validators to make sure there are no status change event submitted when form

// becomes invalid.

const validatorFn = (value: any) => (value.controls.length > 0 ? {controls: true} : null);

const asyncValidatorFn = (value: any) => of(validatorFn(value));

const arr: FormArray = new FormArray<any>([], validatorFn, asyncValidatorFn);

expect(arr.valid).toBe(true);

arr.statusChanges.subscribe(() => logger.push('status change'));

arr.push(c1, {emitEvent: false});

expect(arr.valid).toBe(false);

expect(logger).toEqual([]);

});

it('should not emit events on the parent when called with `emitEvent: false`', () => {

const form = new FormGroup({child: a});

form.valueChanges.subscribe(() => logger.push('form value change'));

a.valueChanges.subscribe(() => logger.push('array value change'));

form.statusChanges.subscribe(() => logger.push('form status change'));

a.statusChanges.subscribe(() => logger.push('array status change'));

a.push(new FormControl(5), {emitEvent: false});

expect(logger).toEqual([]);

});

});

describe('value', () => {

it('should be the reduced value of the child controls', () => {

const a = new FormArray([new FormControl(1), new FormControl(2)]);

expect(a.value).toEqual([1, 2]);

});

it('should be an empty array when there are no child controls', () => {

const a = new FormArray([]);

expect(a.value).toEqual([]);

});

});

describe('getRawValue()', () => {

let a: FormArray;

it('should work with nested form groups/arrays', () => {

a = new FormArray([

new FormGroup({

'c2': new FormControl('v2') as AbstractControl,

'c3': new FormControl('v3'),

}) as any,

new FormArray([new FormControl('v4'), new FormControl('v5')]),

]);

a.at(0).get('c3')!.disable();

(a.at(1) as FormArray).at(1).disable();

expect(a.getRawValue()).toEqual([{'c2': 'v2', 'c3': 'v3'}, ['v4', 'v5']]);

});

});

describe('markAllAsDirty', () => {

it('should mark all descendants as dirty', () => {

const formArray: FormArray = new FormArray([

new FormControl('v1') as AbstractControl,

new FormControl('v2'),

new FormGroup({'c1': new FormControl('v1')}),

new FormArray([new FormGroup({'c2': new FormControl('v2')})]),

]);

expect(formArray.dirty).toBe(false);

const control1 = formArray.at(0) as FormControl;

expect(control1.dirty).toBe(false);

const group1 = formArray.at(2) as FormGroup;

expect(group1.dirty).toBe(false);

const group1Control1 = group1.get('c1') as FormControl;

expect(group1Control1.dirty).toBe(false);

const innerFormArray = formArray.at(3) as FormArray;

expect(innerFormArray.dirty).toBe(false);

const innerFormArrayGroup = innerFormArray.at(0) as FormGroup;

expect(innerFormArrayGroup.dirty).toBe(false);

const innerFormArrayGroupControl1 = innerFormArrayGroup.get('c2') as FormControl;

expect(innerFormArrayGroupControl1.dirty).toBe(false);

formArray.markAllAsDirty();

expect(formArray.dirty).toBe(true);

expect(control1.dirty).toBe(true);

expect(group1.dirty).toBe(true);

expect(group1Control1.dirty).toBe(true);

expect(innerFormArray.dirty).toBe(true);

expect(innerFormArrayGroup.dirty).toBe(true);

expect(innerFormArrayGroupControl1.dirty).toBe(true);

});

});

describe('markAllAsTouched', () => {

it('should mark all descendants as touched', () => {

const formArray: FormArray = new FormArray([

new FormControl('v1') as AbstractControl,

new FormControl('v2'),

new FormGroup({'c1': new FormControl('v1')}),

new FormArray([new FormGroup({'c2': new FormControl('v2')})]),

]);

expect(formArray.touched).toBe(false);

const control1 = formArray.at(0) as FormControl;

expect(control1.touched).toBe(false);

const group1 = formArray.at(2) as FormGroup;

expect(group1.touched).toBe(false);

const group1Control1 = group1.get('c1') as FormControl;

expect(group1Control1.touched).toBe(false);

const innerFormArray = formArray.at(3) as FormArray;

expect(innerFormArray.touched).toBe(false);

const innerFormArrayGroup = innerFormArray.at(0) as FormGroup;

expect(innerFormArrayGroup.touched).toBe(false);

const innerFormArrayGroupControl1 = innerFormArrayGroup.get('c2') as FormControl;

expect(innerFormArrayGroupControl1.touched).toBe(false);

formArray.markAllAsTouched();

expect(formArray.touched).toBe(true);

expect(control1.touched).toBe(true);

expect(group1.touched).toBe(true);

expect(group1Control1.touched).toBe(true);

expect(innerFormArray.touched).toBe(true);

expect(innerFormArrayGroup.touched).toBe(true);

expect(innerFormArrayGroupControl1.touched).toBe(true);

});

});

describe('setValue', () => {

let c: FormControl, c2: FormControl, a: FormArray;

beforeEach(() => {

c = new FormControl('');

c2 = new FormControl('');

a = new FormArray([c, c2]);

});

it('should set its own value', () => {

a.setValue(['one', 'two']);

expect(a.value).toEqual(['one', 'two']);

});

it('should set child values', () => {

a.setValue(['one', 'two']);

expect(c.value).toEqual('one');

expect(c2.value).toEqual('two');

});

it('should set values for disabled child controls', () => {

c2.disable();

a.setValue(['one', 'two']);

expect(c2.value).toEqual('two');

expect(a.value).toEqual(['one']);

expect(a.getRawValue()).toEqual(['one', 'two']);

});

it('should set value for disabled arrays', () => {

a.disable();

a.setValue(['one', 'two']);

expect(c.value).toEqual('one');

expect(c2.value).toEqual('two');

expect(a.value).toEqual(['one', 'two']);

});

it('should set parent values', () => {

const form = new FormGroup({'parent': a});

a.setValue(['one', 'two']);

expect(form.value).toEqual({'parent': ['one', 'two']});

});

it('should not update the parent explicitly specified', () => {

const form = new FormGroup({'parent': a});

a.setValue(['one', 'two'], {onlySelf: true});

expect(form.value).toEqual({parent: ['', '']});

});

it('should throw if fields are missing from supplied value (subset)', () => {

expect(() => a.setValue([, 'two'])).toThrowError(

new RegExp(`NG01002: Must supply a value for form control at index: 0`),

);

});

it('should throw if a value is provided for a missing control (superset)', () => {

expect(() => a.setValue(['one', 'two', 'three'])).toThrowError(

new RegExp(`NG01001: Cannot find form control at index: 2`),

);

});

it('should throw if a value is not provided for a disabled control', () => {

c2.disable();

expect(() => a.setValue(['one'])).toThrowError(

new RegExp(`NG01002: Must supply a value for form control at index: 1`),

);

});

it('should throw if no controls are set yet', () => {

const empty: FormArray = new FormArray<any>([]);

expect(() => empty.setValue(['one'])).toThrowError(

new RegExp(`no form controls registered with this array`),

);

});

describe('setValue() events', () => {

let form: FormGroup;

let logger: any[];

beforeEach(() => {

form = new FormGroup({'parent': a});

logger = [];

});

it('should emit one valueChange event per control', () => {

form.valueChanges.subscribe(() => logger.push('form'));

a.valueChanges.subscribe(() => logger.push('array'));

c.valueChanges.subscribe(() => logger.push('control1'));

c2.valueChanges.subscribe(() => logger.push('control2'));

a.setValue(['one', 'two']);

expect(logger).toEqual(['control1', 'control2', 'array', 'form']);

});

it('should not fire events when called with `emitEvent: false`', () => {

form.valueChanges.subscribe(() => logger.push('form'));

a.valueChanges.subscribe(() => logger.push('array'));

c.valueChanges.subscribe(() => logger.push('control1'));

c2.valueChanges.subscribe(() => logger.push('control2'));

a.setValue(['one', 'two'], {emitEvent: false});

expect(logger).toEqual([]);

});

it('should emit one statusChange event per control', () => {

form.statusChanges.subscribe(() => logger.push('form'));

a.statusChanges.subscribe(() => logger.push('array'));

c.statusChanges.subscribe(() => logger.push('control1'));

c2.statusChanges.subscribe(() => logger.push('control2'));

a.setValue(['one', 'two']);

expect(logger).toEqual(['control1', 'control2', 'array', 'form']);

});

});

});

describe('patchValue', () => {

let c: FormControl, c2: FormControl, a: FormArray, a2: FormArray;

beforeEach(() => {

c = new FormControl('');

c2 = new FormControl('');

a = new FormArray([c, c2]);

a2 = new FormArray([a]);

});

it('should set its own value', () => {

a.patchValue(['one', 'two']);

expect(a.value).toEqual(['one', 'two']);

});

it('should set child values', () => {

a.patchValue(['one', 'two']);

expect(c.value).toEqual('one');

expect(c2.value).toEqual('two');

});

it('should patch disabled control values', () => {

c2.disable();

a.patchValue(['one', 'two']);

expect(c2.value).toEqual('two');

expect(a.value).toEqual(['one']);

expect(a.getRawValue()).toEqual(['one', 'two']);

});

it('should patch disabled control arrays', () => {

a.disable();

a.patchValue(['one', 'two']);

expect(c.value).toEqual('one');

expect(c2.value).toEqual('two');

expect(a.value).toEqual(['one', 'two']);

});

it('should set parent values', () => {

const form = new FormGroup({'parent': a});

a.patchValue(['one', 'two']);

expect(form.value).toEqual({'parent': ['one', 'two']});

});

it('should not update the parent explicitly specified', () => {

const form = new FormGroup({'parent': a});

a.patchValue(['one', 'two'], {onlySelf: true});

expect(form.value).toEqual({parent: ['', '']});

});

it('should ignore fields that are missing from supplied value (subset)', () => {

a.patchValue([, 'two']);

expect(a.value).toEqual(['', 'two']);

});

it('should not ignore fields that are null', () => {

a.patchValue([null]);

expect(a.value).toEqual([null, '']);

});

it('should ignore any value provided for a missing control (superset)', () => {

a.patchValue([, , 'three']);

expect(a.value).toEqual(['', '']);

});

it('should ignore a array if `null` or `undefined` are used as values', () => {

const INITIAL_STATE = [['', '']];

a2.patchValue([null]);

expect(a2.value).toEqual(INITIAL_STATE);

a2.patchValue([undefined]);

expect(a2.value).toEqual(INITIAL_STATE);

});

describe('patchValue() events', () => {

let form: FormGroup;

let logger: any[];

beforeEach(() => {

form = new FormGroup({'parent': a});

logger = [];

});

it('should emit one valueChange event per control', () => {

form.valueChanges.subscribe(() => logger.push('form'));

a.valueChanges.subscribe(() => logger.push('array'));

c.valueChanges.subscribe(() => logger.push('control1'));

c2.valueChanges.subscribe(() => logger.push('control2'));

a.patchValue(['one', 'two']);

expect(logger).toEqual(['control1', 'control2', 'array', 'form']);

});

it('should not emit valueChange events for skipped controls', () => {

form.valueChanges.subscribe(() => logger.push('form'));

a.valueChanges.subscribe(() => logger.push('array'));

c.valueChanges.subscribe(() => logger.push('control1'));

c2.valueChanges.subscribe(() => logger.push('control2'));

a.patchValue(['one']);

expect(logger).toEqual(['control1', 'array', 'form']);

});

it('should not emit valueChange events for skipped controls (represented as `null` or `undefined`)', () => {

const logEvent = () => logger.push('valueChanges event');

const [formArrayControl1, formArrayControl2] = (a2.controls as FormArray[])[0].controls;

formArrayControl1.valueChanges.subscribe(logEvent);

formArrayControl2.valueChanges.subscribe(logEvent);

a2.patchValue([null]);

a2.patchValue([undefined]);

// No events are expected in `valueChanges` since

// all controls were skipped in `patchValue`.

expect(logger).toEqual([]);

});

it('should not fire events when called with `emitEvent: false`', () => {

form.valueChanges.subscribe(() => logger.push('form'));

a.valueChanges.subscribe(() => logger.push('array'));

c.valueChanges.subscribe(() => logger.push('control1'));

c2.valueChanges.subscribe(() => logger.push('control2'));

a.patchValue(['one', 'two'], {emitEvent: false});

expect(logger).toEqual([]);

});

it('should emit one statusChange event per control', () => {

form.statusChanges.subscribe(() => logger.push('form'));

a.statusChanges.subscribe(() => logger.push('array'));

c.statusChanges.subscribe(() => logger.push('control1'));

c2.statusChanges.subscribe(() => logger.push('control2'));

a.patchValue(['one', 'two']);

expect(logger).toEqual(['control1', 'control2', 'array', 'form']);

});

});

});

describe('reset()', () => {

let c: FormControl, c2: FormControl, a: FormArray;

beforeEach(() => {

c = new FormControl('initial value');

c2 = new FormControl('');

a = new FormArray([c, c2]);

});

it('should set its own value if value passed', () => {

a.setValue(['new value', 'new value']);

a.reset(['initial value', '']);

expect(a.value).toEqual(['initial value', '']);

});

it('should not update the parent when explicitly specified', () => {

const form = new FormGroup({'a': a});

a.reset(['one', 'two'], {onlySelf: true});

expect(form.value).toEqual({a: ['initial value', '']});

});

it('should set its own value if boxed value passed', () => {

a.setValue(['new value', 'new value']);

a.reset([{value: 'initial value', disabled: false}, '']);

expect(a.value).toEqual(['initial value', '']);

});

it('should clear its own value if no value passed', () => {

a.setValue(['new value', 'new value']);

a.reset();

expect(a.value).toEqual([null, null]);

});

it('should set the value of each of its child controls if value passed', () => {

a.setValue(['new value', 'new value']);

a.reset(['initial value', '']);

expect(c.value).toBe('initial value');

expect(c2.value).toBe('');

});

it('should clear the value of each of its child controls if no value', () => {

a.setValue(['new value', 'new value']);

a.reset();

expect(c.value).toBe(null);

expect(c2.value).toBe(null);

});

it('should set the value of its parent if value passed', () => {

const form = new FormGroup({'a': a});

a.setValue(['new value', 'new value']);

a.reset(['initial value', '']);

expect(form.value).toEqual({'a': ['initial value', '']});

});

it('should clear the value of its parent if no value passed', () => {

const form = new FormGroup({'a': a});

a.setValue(['new value', 'new value']);

a.reset();

expect(form.value).toEqual({'a': [null, null]});

});

it('should mark itself as pristine', () => {

a.markAsDirty();

expect(a.pristine).toBe(false);

a.reset();

expect(a.pristine).toBe(true);

});

it('should mark all child controls as pristine', () => {

c.markAsDirty();

c2.markAsDirty();

expect(c.pristine).toBe(false);

expect(c2.pristine).toBe(false);

a.reset();

expect(c.pristine).toBe(true);

expect(c2.pristine).toBe(true);

});

it('should mark the parent as pristine if all siblings pristine', () => {

const c3 = new FormControl('');

const form = new FormGroup({'a': a, 'c3': c3});

a.markAsDirty();

expect(form.pristine).toBe(false);

a.reset();

expect(form.pristine).toBe(true);

});

it('should not mark the parent pristine if any dirty siblings', () => {

const c3 = new FormControl('');

const form = new FormGroup({'a': a, 'c3': c3});

a.markAsDirty();

c3.markAsDirty();

expect(form.pristine).toBe(false);

a.reset();

expect(form.pristine).toBe(false);

});

it('should mark itself as untouched', () => {

a.markAsTouched();

expect(a.untouched).toBe(false);

a.reset();

expect(a.untouched).toBe(true);

});

it('should mark all child controls as untouched', () => {

c.markAsTouched();

c2.markAsTouched();

expect(c.untouched).toBe(false);

expect(c2.untouched).toBe(false);

a.reset();

expect(c.untouched).toBe(true);

expect(c2.untouched).toBe(true);

});

it('should mark the parent untouched if all siblings untouched', () => {

const c3 = new FormControl('');

const form = new FormGroup({'a': a, 'c3': c3});

a.markAsTouched();

expect(form.untouched).toBe(false);

a.reset();

expect(form.untouched).toBe(true);

});

it('should not mark the parent untouched if any touched siblings', () => {

const c3 = new FormControl('');

const form = new FormGroup({'a': a, 'c3': c3});

a.markAsTouched();

c3.markAsTouched();

expect(form.untouched).toBe(false);

a.reset();

expect(form.untouched).toBe(false);

});

it('should retain previous disabled state', () => {

a.disable();

a.reset();

expect(a.disabled).toBe(true);

});

it('should set child disabled state if boxed value passed', () => {

a.disable();

a.reset([{value: '', disabled: false}, '']);

expect(c.disabled).toBe(false);

expect(a.disabled).toBe(false);

});

describe('reset() events', () => {

let form: FormGroup, c3: FormControl, logger: any[];

beforeEach(() => {

c3 = new FormControl('');

form = new FormGroup({'a': a, 'c3': c3});

logger = [];

});

it('should emit one valueChange event per reset control', () => {

form.valueChanges.subscribe(() => logger.push('form'));

a.valueChanges.subscribe(() => logger.push('array'));

c.valueChanges.subscribe(() => logger.push('control1'));

c2.valueChanges.subscribe(() => logger.push('control2'));

c3.valueChanges.subscribe(() => logger.push('control3'));

a.reset();

expect(logger).toEqual(['control1', 'control2', 'array', 'form']);

});

it('should not fire events when called with `emitEvent: false`', () => {

form.valueChanges.subscribe(() => logger.push('form'));

a.valueChanges.subscribe(() => logger.push('array'));

c.valueChanges.subscribe(() => logger.push('control1'));

c2.valueChanges.subscribe(() => logger.push('control2'));

c3.valueChanges.subscribe(() => logger.push('control3'));

a.reset([], {emitEvent: false});

expect(logger).toEqual([]);

});

it('should emit one statusChange event per reset control', () => {

form.statusChanges.subscribe(() => logger.push('form'));

a.statusChanges.subscribe(() => logger.push('array'));

c.statusChanges.subscribe(() => logger.push('control1'));

c2.statusChanges.subscribe(() => logger.push('control2'));

c3.statusChanges.subscribe(() => logger.push('control3'));

a.reset();

expect(logger).toEqual(['control1', 'control2', 'array', 'form']);

});

it('should mark as pristine and not dirty before emitting valueChange and statusChange events when resetting', () => {

const pristineAndNotDirty = () => {

expect(a.pristine).toBe(true);

expect(a.dirty).toBe(false);

};

c2.markAsDirty();

expect(a.pristine).toBe(false);

expect(a.dirty).toBe(true);

a.valueChanges.subscribe(pristineAndNotDirty);

a.statusChanges.subscribe(pristineAndNotDirty);

a.reset();

});

});

});

describe('errors', () => {

it('should run the validator when the value changes', () => {

const simpleValidator = (c: FormArray) =>

c.controls[0].value != 'correct' ? {'broken': true} : null;

const c = new FormControl('');

const g = new FormArray([c], simpleValidator as ValidatorFn);

c.setValue('correct');

expect(g.valid).toEqual(true);

expect(g.errors).toEqual(null);

c.setValue('incorrect');

expect(g.valid).toEqual(false);

expect(g.errors).toEqual({'broken': true});

});

});

describe('dirty', () => {

let c: FormControl;

let a: FormArray;

beforeEach(() => {

c = new FormControl('value');

a = new FormArray([c]);

});

it('should be false after creating a control', () => {

expect(a.dirty).toEqual(false);

});

it('should be true after changing the value of the control', () => {

c.markAsDirty();

expect(a.dirty).toEqual(true);

});

});

describe('touched', () => {

let c: FormControl;

let a: FormArray;

beforeEach(() => {

c = new FormControl('value');

a = new FormArray([c]);

});

it('should be false after creating a control', () => {

expect(a.touched).toEqual(false);

});

it('should be true after child control is marked as touched', () => {

c.markAsTouched();

expect(a.touched).toEqual(true);

});

});

describe('pending', () => {

let c: FormControl;

let a: FormArray;

beforeEach(() => {

c = new FormControl('value');

a = new FormArray([c]);

});

it('should be false after creating a control', () => {

expect(c.pending).toEqual(false);

expect(a.pending).toEqual(false);

});

it('should be true after changing the value of the control', () => {

c.markAsPending();

expect(c.pending).toEqual(true);

expect(a.pending).toEqual(true);

});

it('should not update the parent when onlySelf = true', () => {

c.markAsPending({onlySelf: true});

expect(c.pending).toEqual(true);

expect(a.pending).toEqual(false);

});

describe('status change events', () => {

let logger: string[];

beforeEach(() => {

logger = [];

a.statusChanges.subscribe((status) => logger.push(status));

});

it('should emit event after marking control as pending', () => {

c.markAsPending();

expect(logger).toEqual(['PENDING']);

});

it('should not emit event from parent when onlySelf is true', () => {

c.markAsPending({onlySelf: true});

expect(logger).toEqual([]);

});

it('should not emit events when called with `emitEvent: false`', () => {

c.markAsPending({emitEvent: false});

expect(logger).toEqual([]);

});

it('should emit event when parent is markedAsPending', () => {

a.markAsPending();

expect(logger).toEqual(['PENDING']);

});

});

});

describe('valueChanges', () => {

let a: FormArray;

let c1: FormControl, c2: FormControl;

beforeEach(() => {

c1 = new FormControl('old1');

c2 = new FormControl('old2');

a = new FormArray([c1, c2]);

});

it('should fire an event after the value has been updated', (done) => {

a.valueChanges.subscribe({

next: (value: any) => {

expect(a.value).toEqual(['new1', 'old2']);

expect(value).toEqual(['new1', 'old2']);

done();

},

});

c1.setValue('new1');

});

it("should fire an event after the control's observable fired an event", (done) => {

let controlCallbackIsCalled = false;

c1.valueChanges.subscribe({

next: (value: any) => {

controlCallbackIsCalled = true;

},

});

a.valueChanges.subscribe({

next: (value: any) => {

expect(controlCallbackIsCalled).toBe(true);

done();

},

});

c1.setValue('new1');

});

it('should fire an event when a control is removed', (done) => {

a.valueChanges.subscribe({

next: (value: any) => {

expect(value).toEqual(['old1']);

done();

},

});

a.removeAt(1);

});

it('should fire an event when a control is added', (done) => {

a.removeAt(1);

a.valueChanges.subscribe({

next: (value: any) => {

expect(value).toEqual(['old1', 'old2']);

done();

},

});

a.push(c2);

});

it('should fire an event once when calling `FormArray.push` with an array of controls', (done) => {

a = new FormArray<any>([]);

a.valueChanges.subscribe({

next: (value: any) => {

expect(value).toEqual(['old1', 'old2']);

done();

},

});

a.push([c1, c2]);

});

});