diff --git a/packages/forms/test/directives_spec.ts b/packages/forms/test/directives_spec.ts
index 9b3cb214bd9..1bda48e1b5e 100644
--- a/packages/forms/test/directives_spec.ts
+++ b/packages/forms/test/directives_spec.ts
@@ -360,7 +360,7 @@ class CustomValidatorDirective implements Validator {
flushMicrotasks();
- expect(formModel.get(['person', 'login'])).not.toBeNull;
+ expect(formModel.get(['person', 'login'])).not.toBeNull();
}));
// should update the form's value and validity
diff --git a/packages/forms/test/reactive_integration_spec.ts b/packages/forms/test/reactive_integration_spec.ts
index e783ec37d80..a7fd524dcc7 100644
--- a/packages/forms/test/reactive_integration_spec.ts
+++ b/packages/forms/test/reactive_integration_spec.ts
@@ -280,7 +280,7 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
fixture.detectChanges();
emailInput = fixture.debugElement.query(By.css('[formControlName="email"]'));
- expect(emailInput as any).toBe(null); // TODO: Review use of `any` here (#19904)
+ expect(emailInput as any).toBe(null); // TODO: remove `any` after #22449 is closed.
});
it('should strip array controls that are not found', () => {
@@ -1309,15 +1309,22 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
dispatchEvent(input, 'input');
fixture.detectChanges();
- expect(control.value).toEqual('', 'Expected value to remain unchanged until blur.');
- expect(control.valid).toBe(false, 'Expected no validation to occur until blur.');
+ expect(control.value)
+ .withContext('Expected value to remain unchanged until blur.')
+ .toEqual('');
+ expect(control.valid)
+ .withContext('Expected no validation to occur until blur.')
+ .toBe(false);
dispatchEvent(input, 'blur');
fixture.detectChanges();
expect(control.value)
- .toEqual('Nancy', 'Expected value to change once control is blurred.');
- expect(control.valid).toBe(true, 'Expected validation to run once control is blurred.');
+ .withContext('Expected value to change once control is blurred.')
+ .toEqual('Nancy');
+ expect(control.valid)
+ .withContext('Expected validation to run once control is blurred.')
+ .toBe(true);
});
it('should not update parent group value/validity from child until blur', () => {
@@ -1333,15 +1340,21 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
fixture.detectChanges();
expect(form.value)
- .toEqual({login: ''}, 'Expected group value to remain unchanged until blur.');
- expect(form.valid).toBe(false, 'Expected no validation to occur on group until blur.');
+ .withContext('Expected group value to remain unchanged until blur.')
+ .toEqual({login: ''});
+ expect(form.valid)
+ .withContext('Expected no validation to occur on group until blur.')
+ .toBe(false);
dispatchEvent(input, 'blur');
fixture.detectChanges();
expect(form.value)
- .toEqual({login: 'Nancy'}, 'Expected group value to change once input blurred.');
- expect(form.valid).toBe(true, 'Expected validation to run once input blurred.');
+ .withContext('Expected group value to change once input blurred.')
+ .toEqual({login: 'Nancy'});
+ expect(form.valid)
+ .withContext('Expected validation to run once input blurred.')
+ .toBe(true);
});
it('should not wait for blur event to update if value is set programmatically', () => {
@@ -1354,9 +1367,13 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
fixture.detectChanges();
const input = fixture.debugElement.query(By.css('input')).nativeElement;
- expect(input.value).toEqual('Nancy', 'Expected value to propagate to view immediately.');
- expect(control.value).toEqual('Nancy', 'Expected model value to update immediately.');
- expect(control.valid).toBe(true, 'Expected validation to run immediately.');
+ expect(input.value)
+ .withContext('Expected value to propagate to view immediately.')
+ .toEqual('Nancy');
+ expect(control.value)
+ .withContext('Expected model value to update immediately.')
+ .toEqual('Nancy');
+ expect(control.valid).withContext('Expected validation to run immediately.').toBe(true);
});
it('should not update dirty state until control is blurred', () => {
@@ -1365,19 +1382,23 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
fixture.componentInstance.control = control;
fixture.detectChanges();
- expect(control.dirty).toBe(false, 'Expected control to start out pristine.');
+ expect(control.dirty).withContext('Expected control to start out pristine.').toBe(false);
const input = fixture.debugElement.query(By.css('input')).nativeElement;
input.value = 'Nancy';
dispatchEvent(input, 'input');
fixture.detectChanges();
- expect(control.dirty).toBe(false, 'Expected control to stay pristine until blurred.');
+ expect(control.dirty)
+ .withContext('Expected control to stay pristine until blurred.')
+ .toBe(false);
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(control.dirty).toBe(true, 'Expected control to update dirty state when blurred.');
+ expect(control.dirty)
+ .withContext('Expected control to update dirty state when blurred.')
+ .toBe(true);
});
it('should update touched when control is blurred', () => {
@@ -1386,14 +1407,17 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
fixture.componentInstance.control = control;
fixture.detectChanges();
- expect(control.touched).toBe(false, 'Expected control to start out untouched.');
+ expect(control.touched)
+ .withContext('Expected control to start out untouched.')
+ .toBe(false);
const input = fixture.debugElement.query(By.css('input')).nativeElement;
dispatchEvent(input, 'blur');
fixture.detectChanges();
expect(control.touched)
- .toBe(true, 'Expected control to update touched state when blurred.');
+ .withContext('Expected control to update touched state when blurred.')
+ .toBe(true);
});
it('should continue waiting for blur to update if previously blurred', () => {
@@ -1413,14 +1437,21 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
fixture.detectChanges();
expect(control.value)
- .toEqual('Nancy', 'Expected value to remain unchanged until second blur.');
- expect(control.valid).toBe(true, 'Expected validation not to run until second blur.');
+ .withContext('Expected value to remain unchanged until second blur.')
+ .toEqual('Nancy');
+ expect(control.valid)
+ .withContext('Expected validation not to run until second blur.')
+ .toBe(true);
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(control.value).toEqual('', 'Expected value to update when blur occurs again.');
- expect(control.valid).toBe(false, 'Expected validation to run when blur occurs again.');
+ expect(control.value)
+ .withContext('Expected value to update when blur occurs again.')
+ .toEqual('');
+ expect(control.valid)
+ .withContext('Expected validation to run when blur occurs again.')
+ .toBe(false);
});
it('should not use stale pending value if value set programmatically', () => {
@@ -1440,7 +1471,9 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(input.value).toEqual('Nancy', 'Expected programmatic value to stick after blur.');
+ expect(input.value)
+ .withContext('Expected programmatic value to stick after blur.')
+ .toEqual('Nancy');
});
it('should set initial value and validity on init', () => {
@@ -1452,9 +1485,13 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
const input = fixture.debugElement.query(By.css('input')).nativeElement;
- expect(input.value).toEqual('Nancy', 'Expected value to be set in the view.');
- expect(control.value).toEqual('Nancy', 'Expected initial model value to be set.');
- expect(control.valid).toBe(false, 'Expected validation to run on initial value.');
+ expect(input.value).withContext('Expected value to be set in the view.').toEqual('Nancy');
+ expect(control.value)
+ .withContext('Expected initial model value to be set.')
+ .toEqual('Nancy');
+ expect(control.valid)
+ .withContext('Expected validation to run on initial value.')
+ .toBe(false);
});
it('should reset properly', () => {
@@ -1470,16 +1507,16 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(control.dirty).toBe(true, 'Expected control to be dirty on blur.');
+ expect(control.dirty).withContext('Expected control to be dirty on blur.').toBe(true);
control.reset();
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(input.value).toEqual('', 'Expected view value to reset');
- expect(control.value).toBe(null, 'Expected pending value to reset.');
- expect(control.dirty).toBe(false, 'Expected pending dirty value to reset.');
+ expect(input.value).withContext('Expected view value to reset').toEqual('');
+ expect(control.value).withContext('Expected pending value to reset.').toBe(null);
+ expect(control.dirty).withContext('Expected pending dirty value to reset.').toBe(false);
});
it('should be able to remove a control as a result of another control being reset', () => {
@@ -1540,13 +1577,16 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
dispatchEvent(input, 'input');
fixture.detectChanges();
- expect(values).toEqual([], 'Expected no valueChanges or statusChanges on input.');
+ expect(values)
+ .withContext('Expected no valueChanges or statusChanges on input.')
+ .toEqual([]);
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(values).toEqual(
- ['Nancy', 'VALID'], 'Expected valueChanges and statusChanges on blur.');
+ expect(values).withContext('Expected valueChanges and statusChanges on blur.').toEqual([
+ 'Nancy', 'VALID'
+ ]);
sub.unsubscribe();
});
@@ -1565,13 +1605,16 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
const input = fixture.debugElement.query(By.css('input')).nativeElement;
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(values).toEqual(
- [], 'Expected no valueChanges or statusChanges if value unchanged.');
+ expect(values)
+ .withContext('Expected no valueChanges or statusChanges if value unchanged.')
+ .toEqual([]);
input.value = 'Nancy';
dispatchEvent(input, 'input');
fixture.detectChanges();
- expect(values).toEqual([], 'Expected no valueChanges or statusChanges on input.');
+ expect(values)
+ .withContext('Expected no valueChanges or statusChanges on input.')
+ .toEqual([]);
dispatchEvent(input, 'blur');
fixture.detectChanges();
@@ -1616,12 +1659,12 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
fixture.detectChanges();
control.markAsPristine();
- expect(control.dirty).toBe(false, 'Expected control to become pristine.');
+ expect(control.dirty).withContext('Expected control to become pristine.').toBe(false);
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(control.dirty).toBe(false, 'Expected pending dirty value to reset.');
+ expect(control.dirty).withContext('Expected pending dirty value to reset.').toBe(false);
});
it('should update on blur with group updateOn', () => {
@@ -1636,15 +1679,22 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
dispatchEvent(input, 'input');
fixture.detectChanges();
- expect(control.value).toEqual('', 'Expected value to remain unchanged until blur.');
- expect(control.valid).toBe(false, 'Expected no validation to occur until blur.');
+ expect(control.value)
+ .withContext('Expected value to remain unchanged until blur.')
+ .toEqual('');
+ expect(control.valid)
+ .withContext('Expected no validation to occur until blur.')
+ .toBe(false);
dispatchEvent(input, 'blur');
fixture.detectChanges();
expect(control.value)
- .toEqual('Nancy', 'Expected value to change once control is blurred.');
- expect(control.valid).toBe(true, 'Expected validation to run once control is blurred.');
+ .withContext('Expected value to change once control is blurred.')
+ .toEqual('Nancy');
+ expect(control.valid)
+ .withContext('Expected validation to run once control is blurred.')
+ .toBe(true);
});
it('should update on blur with array updateOn', () => {
@@ -1661,15 +1711,22 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
dispatchEvent(input, 'input');
fixture.detectChanges();
- expect(control.value).toEqual('', 'Expected value to remain unchanged until blur.');
- expect(control.valid).toBe(false, 'Expected no validation to occur until blur.');
+ expect(control.value)
+ .withContext('Expected value to remain unchanged until blur.')
+ .toEqual('');
+ expect(control.valid)
+ .withContext('Expected no validation to occur until blur.')
+ .toBe(false);
dispatchEvent(input, 'blur');
fixture.detectChanges();
expect(control.value)
- .toEqual('Nancy', 'Expected value to change once control is blurred.');
- expect(control.valid).toBe(true, 'Expected validation to run once control is blurred.');
+ .withContext('Expected value to change once control is blurred.')
+ .toEqual('Nancy');
+ expect(control.valid)
+ .withContext('Expected validation to run once control is blurred.')
+ .toBe(true);
});
@@ -1689,24 +1746,31 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
dispatchEvent(loginInput.nativeElement, 'input');
fixture.detectChanges();
- expect(loginControl.value).toEqual('Nancy', 'Expected value change on input.');
- expect(loginControl.valid).toBe(true, 'Expected validation to run on input.');
+ expect(loginControl.value)
+ .withContext('Expected value change on input.')
+ .toEqual('Nancy');
+ expect(loginControl.valid).withContext('Expected validation to run on input.').toBe(true);
passwordInput.nativeElement.value = 'Carson';
dispatchEvent(passwordInput.nativeElement, 'input');
fixture.detectChanges();
expect(passwordControl.value)
- .toEqual('', 'Expected value to remain unchanged until blur.');
- expect(passwordControl.valid).toBe(false, 'Expected no validation to occur until blur.');
+ .withContext('Expected value to remain unchanged until blur.')
+ .toEqual('');
+ expect(passwordControl.valid)
+ .withContext('Expected no validation to occur until blur.')
+ .toBe(false);
dispatchEvent(passwordInput.nativeElement, 'blur');
fixture.detectChanges();
expect(passwordControl.value)
- .toEqual('Carson', 'Expected value to change once control is blurred.');
+ .withContext('Expected value to change once control is blurred.')
+ .toEqual('Carson');
expect(passwordControl.valid)
- .toBe(true, 'Expected validation to run once control is blurred.');
+ .withContext('Expected validation to run once control is blurred.')
+ .toBe(true);
});
});
@@ -1720,9 +1784,15 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
fixture.detectChanges();
const input = fixture.debugElement.query(By.css('input')).nativeElement;
- expect(input.value).toEqual('Nancy', 'Expected initial value to propagate to view.');
- expect(form.value).toEqual({login: 'Nancy'}, 'Expected initial value to be set.');
- expect(form.valid).toBe(true, 'Expected form to run validation on initial value.');
+ expect(input.value)
+ .withContext('Expected initial value to propagate to view.')
+ .toEqual('Nancy');
+ expect(form.value).withContext('Expected initial value to be set.').toEqual({
+ login: 'Nancy'
+ });
+ expect(form.valid)
+ .withContext('Expected form to run validation on initial value.')
+ .toBe(true);
});
it('should not update value or validity until submit', () => {
@@ -1738,23 +1808,32 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
fixture.detectChanges();
expect(formGroup.value)
- .toEqual({login: ''}, 'Expected form value to remain unchanged on input.');
- expect(formGroup.valid).toBe(false, 'Expected form validation not to run on input.');
+ .withContext('Expected form value to remain unchanged on input.')
+ .toEqual({login: ''});
+ expect(formGroup.valid)
+ .withContext('Expected form validation not to run on input.')
+ .toBe(false);
dispatchEvent(input, 'blur');
fixture.detectChanges();
expect(formGroup.value)
- .toEqual({login: ''}, 'Expected form value to remain unchanged on blur.');
- expect(formGroup.valid).toBe(false, 'Expected form validation not to run on blur.');
+ .withContext('Expected form value to remain unchanged on blur.')
+ .toEqual({login: ''});
+ expect(formGroup.valid)
+ .withContext('Expected form validation not to run on blur.')
+ .toBe(false);
const form = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(form, 'submit');
fixture.detectChanges();
- expect(formGroup.value)
- .toEqual({login: 'Nancy'}, 'Expected form value to update on submit.');
- expect(formGroup.valid).toBe(true, 'Expected form validation to run on submit.');
+ expect(formGroup.value).withContext('Expected form value to update on submit.').toEqual({
+ login: 'Nancy'
+ });
+ expect(formGroup.valid)
+ .withContext('Expected form validation to run on submit.')
+ .toBe(true);
});
it('should not update after submit until a second submit', () => {
@@ -1778,16 +1857,21 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
fixture.detectChanges();
expect(formGroup.value)
- .toEqual({login: 'Nancy'}, 'Expected value not to change until a second submit.');
+ .withContext('Expected value not to change until a second submit.')
+ .toEqual({login: 'Nancy'});
expect(formGroup.valid)
- .toBe(true, 'Expected validation not to run until a second submit.');
+ .withContext('Expected validation not to run until a second submit.')
+ .toBe(true);
dispatchEvent(form, 'submit');
fixture.detectChanges();
expect(formGroup.value)
- .toEqual({login: ''}, 'Expected value to update on the second submit.');
- expect(formGroup.valid).toBe(false, 'Expected validation to run on a second submit.');
+ .withContext('Expected value to update on the second submit.')
+ .toEqual({login: ''});
+ expect(formGroup.valid)
+ .withContext('Expected validation to run on a second submit.')
+ .toBe(false);
});
it('should not wait for submit to set value programmatically', () => {
@@ -1801,10 +1885,15 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
fixture.detectChanges();
const input = fixture.debugElement.query(By.css('input')).nativeElement;
- expect(input.value).toEqual('Nancy', 'Expected view value to update immediately.');
+ expect(input.value)
+ .withContext('Expected view value to update immediately.')
+ .toEqual('Nancy');
expect(formGroup.value)
- .toEqual({login: 'Nancy'}, 'Expected form value to update immediately.');
- expect(formGroup.valid).toBe(true, 'Expected form validation to run immediately.');
+ .withContext('Expected form value to update immediately.')
+ .toEqual({login: 'Nancy'});
+ expect(formGroup.valid)
+ .withContext('Expected form validation to run immediately.')
+ .toBe(true);
});
it('should not update dirty until submit', () => {
@@ -1817,18 +1906,18 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
dispatchEvent(input, 'input');
fixture.detectChanges();
- expect(formGroup.dirty).toBe(false, 'Expected dirty not to change on input.');
+ expect(formGroup.dirty).withContext('Expected dirty not to change on input.').toBe(false);
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(formGroup.dirty).toBe(false, 'Expected dirty not to change on blur.');
+ expect(formGroup.dirty).withContext('Expected dirty not to change on blur.').toBe(false);
const form = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(form, 'submit');
fixture.detectChanges();
- expect(formGroup.dirty).toBe(true, 'Expected dirty to update on submit.');
+ expect(formGroup.dirty).withContext('Expected dirty to update on submit.').toBe(true);
});
it('should not update touched until submit', () => {
@@ -1841,13 +1930,15 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(formGroup.touched).toBe(false, 'Expected touched not to change until submit.');
+ expect(formGroup.touched)
+ .withContext('Expected touched not to change until submit.')
+ .toBe(false);
const form = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(form, 'submit');
fixture.detectChanges();
- expect(formGroup.touched).toBe(true, 'Expected touched to update on submit.');
+ expect(formGroup.touched).withContext('Expected touched to update on submit.').toBe(true);
});
it('should reset properly', () => {
@@ -1868,19 +1959,28 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
formGroup.reset();
fixture.detectChanges();
- expect(input.value).toEqual('', 'Expected view value to reset.');
- expect(formGroup.value).toEqual({login: null}, 'Expected form value to reset');
- expect(formGroup.dirty).toBe(false, 'Expected dirty to stay false on reset.');
- expect(formGroup.touched).toBe(false, 'Expected touched to stay false on reset.');
+ expect(input.value).withContext('Expected view value to reset.').toEqual('');
+ expect(formGroup.value).withContext('Expected form value to reset').toEqual({
+ login: null
+ });
+ expect(formGroup.dirty).withContext('Expected dirty to stay false on reset.').toBe(false);
+ expect(formGroup.touched)
+ .withContext('Expected touched to stay false on reset.')
+ .toBe(false);
const form = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(form, 'submit');
fixture.detectChanges();
expect(formGroup.value)
- .toEqual({login: null}, 'Expected form value to stay empty on submit');
- expect(formGroup.dirty).toBe(false, 'Expected dirty to stay false on submit.');
- expect(formGroup.touched).toBe(false, 'Expected touched to stay false on submit.');
+ .withContext('Expected form value to stay empty on submit')
+ .toEqual({login: null});
+ expect(formGroup.dirty)
+ .withContext('Expected dirty to stay false on submit.')
+ .toBe(false);
+ expect(formGroup.touched)
+ .withContext('Expected touched to stay false on submit.')
+ .toBe(false);
});
it('should not emit valueChanges or statusChanges until submit', () => {
@@ -1902,12 +2002,16 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
dispatchEvent(input, 'input');
fixture.detectChanges();
- expect(values).toEqual([], 'Expected no valueChanges or statusChanges on input');
+ expect(values)
+ .withContext('Expected no valueChanges or statusChanges on input')
+ .toEqual([]);
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(values).toEqual([], 'Expected no valueChanges or statusChanges on blur');
+ expect(values)
+ .withContext('Expected no valueChanges or statusChanges on blur')
+ .toEqual([]);
const form = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(form, 'submit');
@@ -1937,14 +2041,17 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
const form = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(form, 'submit');
fixture.detectChanges();
- expect(values).toEqual(
- [], 'Expected no valueChanges or statusChanges if value unchanged.');
+ expect(values)
+ .withContext('Expected no valueChanges or statusChanges if value unchanged.')
+ .toEqual([]);
const input = fixture.debugElement.query(By.css('input')).nativeElement;
input.value = 'Nancy';
dispatchEvent(input, 'input');
fixture.detectChanges();
- expect(values).toEqual([], 'Expected no valueChanges or statusChanges on input.');
+ expect(values)
+ .withContext('Expected no valueChanges or statusChanges on input.')
+ .toEqual([]);
dispatchEvent(form, 'submit');
fixture.detectChanges();
@@ -2015,13 +2122,15 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
formGroup.markAsUntouched();
fixture.detectChanges();
- expect(formGroup.touched).toBe(false, 'Expected group to become untouched.');
+ expect(formGroup.touched).withContext('Expected group to become untouched.').toBe(false);
const form = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(form, 'submit');
fixture.detectChanges();
- expect(formGroup.touched).toBe(false, 'Expected touched to stay false on submit.');
+ expect(formGroup.touched)
+ .withContext('Expected touched to stay false on submit.')
+ .toBe(false);
});
it('should update on submit with group updateOn', () => {
@@ -2036,21 +2145,29 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
dispatchEvent(input, 'input');
fixture.detectChanges();
- expect(control.value).toEqual('', 'Expected value to remain unchanged until submit.');
- expect(control.valid).toBe(false, 'Expected no validation to occur until submit.');
+ expect(control.value)
+ .withContext('Expected value to remain unchanged until submit.')
+ .toEqual('');
+ expect(control.valid)
+ .withContext('Expected no validation to occur until submit.')
+ .toBe(false);
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(control.value).toEqual('', 'Expected value to remain unchanged until submit.');
- expect(control.valid).toBe(false, 'Expected no validation to occur until submit.');
+ expect(control.value)
+ .withContext('Expected value to remain unchanged until submit.')
+ .toEqual('');
+ expect(control.valid)
+ .withContext('Expected no validation to occur until submit.')
+ .toBe(false);
const form = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(form, 'submit');
fixture.detectChanges();
- expect(control.value).toEqual('Nancy', 'Expected value to change on submit.');
- expect(control.valid).toBe(true, 'Expected validation to run on submit.');
+ expect(control.value).withContext('Expected value to change on submit.').toEqual('Nancy');
+ expect(control.valid).withContext('Expected validation to run on submit.').toBe(true);
});
it('should update on submit with array updateOn', () => {
@@ -2067,16 +2184,22 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
dispatchEvent(input, 'input');
fixture.detectChanges();
- expect(control.value).toEqual('', 'Expected value to remain unchanged until submit.');
- expect(control.valid).toBe(false, 'Expected no validation to occur until submit.');
+ expect(control.value)
+ .withContext('Expected value to remain unchanged until submit.')
+ .toEqual('');
+ expect(control.valid)
+ .withContext('Expected no validation to occur until submit.')
+ .toBe(false);
const form = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(form, 'submit');
fixture.detectChanges();
- expect(control.value).toEqual('Nancy', 'Expected value to change once control on submit');
- expect(control.valid).toBe(true, 'Expected validation to run on submit.');
+ expect(control.value)
+ .withContext('Expected value to change once control on submit')
+ .toEqual('Nancy');
+ expect(control.valid).withContext('Expected validation to run on submit.').toBe(true);
});
it('should allow child control updateOn submit to override group updateOn', () => {
@@ -2095,24 +2218,32 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
dispatchEvent(loginInput.nativeElement, 'input');
fixture.detectChanges();
- expect(loginControl.value).toEqual('Nancy', 'Expected value change on input.');
- expect(loginControl.valid).toBe(true, 'Expected validation to run on input.');
+ expect(loginControl.value)
+ .withContext('Expected value change on input.')
+ .toEqual('Nancy');
+ expect(loginControl.valid).withContext('Expected validation to run on input.').toBe(true);
passwordInput.nativeElement.value = 'Carson';
dispatchEvent(passwordInput.nativeElement, 'input');
fixture.detectChanges();
expect(passwordControl.value)
- .toEqual('', 'Expected value to remain unchanged until submit.');
+ .withContext('Expected value to remain unchanged until submit.')
+ .toEqual('');
expect(passwordControl.valid)
- .toBe(false, 'Expected no validation to occur until submit.');
+ .withContext('Expected no validation to occur until submit.')
+ .toBe(false);
const form = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(form, 'submit');
fixture.detectChanges();
- expect(passwordControl.value).toEqual('Carson', 'Expected value to change on submit.');
- expect(passwordControl.valid).toBe(true, 'Expected validation to run on submit.');
+ expect(passwordControl.value)
+ .withContext('Expected value to change on submit.')
+ .toEqual('Carson');
+ expect(passwordControl.valid)
+ .withContext('Expected validation to run on submit.')
+ .toBe(true);
});
it('should not prevent the default action on forms with method="dialog"', fakeAsync(() => {
@@ -2289,7 +2420,8 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
tick();
expect(fixture.componentInstance.login)
- .toEqual('initial', 'Expected ngModel value to remain unchanged on input.');
+ .withContext('Expected ngModel value to remain unchanged on input.')
+ .toEqual('initial');
const form = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(form, 'submit');
@@ -2297,7 +2429,8 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
tick();
expect(fixture.componentInstance.login)
- .toEqual('Nancy', 'Expected ngModel value to update on submit.');
+ .withContext('Expected ngModel value to update on submit.')
+ .toEqual('Nancy');
}));
});
@@ -2715,7 +2848,9 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
fixture.detectChanges();
tick(100);
- expect(resultArr.length).toEqual(1, `Expected source observable to emit once on init.`);
+ expect(resultArr.length)
+ .withContext(`Expected source observable to emit once on init.`)
+ .toEqual(1);
const input = fixture.debugElement.query(By.css('input'));
input.nativeElement.value = 'a';
@@ -2728,7 +2863,8 @@ const ValueAccessorB = createControlValueAccessor('[cva-b]');
tick(100);
expect(resultArr.length)
- .toEqual(2, `Expected original observable to be canceled on the next value change.`);
+ .withContext(`Expected original observable to be canceled on the next value change.`)
+ .toEqual(2);
}));
describe('enabling validators conditionally', () => {
@@ -5170,7 +5306,6 @@ class UniqLoginValidator implements AsyncValidator {
@Component({selector: 'form-control-comp', template: ``})
class FormControlComp {
- // TODO(issue/24571): remove '!'.
control!: FormControl;
}
@@ -5182,11 +5317,8 @@ class FormControlComp {
`
})
class FormGroupComp {
- // TODO(issue/24571): remove '!'.
control!: FormControl;
- // TODO(issue/24571): remove '!'.
form!: FormGroup;
- // TODO(issue/24571): remove '!'.
event!: Event;
}
@@ -5202,7 +5334,6 @@ class FormGroupComp {
`
})
class NestedFormGroupNameComp {
- // TODO(issue/24571): remove '!'.
form!: FormGroup;
}
@@ -5218,9 +5349,7 @@ class NestedFormGroupNameComp {
`
})
class FormArrayComp {
- // TODO(issue/24571): remove '!'.
form!: FormGroup;
- // TODO(issue/24571): remove '!'.
cityArray!: FormArray;
}
@@ -5251,9 +5380,7 @@ class NestedFormArrayNameComp {
`
})
class FormArrayNestedGroup {
- // TODO(issue/24571): remove '!'.
form!: FormGroup;
- // TODO(issue/24571): remove '!'.
cityArray!: FormArray;
}
@@ -5266,11 +5393,8 @@ class FormArrayNestedGroup {
`
})
class FormGroupNgModel {
- // TODO(issue/24571): remove '!'.
form!: FormGroup;
- // TODO(issue/24571): remove '!'.
login!: string;
- // TODO(issue/24571): remove '!'.
password!: string;
}
@@ -5282,13 +5406,9 @@ class FormGroupNgModel {
`
})
class FormControlNgModel {
- // TODO(issue/24571): remove '!'.
control!: FormControl;
- // TODO(issue/24571): remove '!'.
login!: string;
- // TODO(issue/24571): remove '!'.
passwordControl!: FormControl;
- // TODO(issue/24571): remove '!'.
password!: string;
}
@@ -5303,7 +5423,6 @@ class FormControlNgModel {
`
})
class LoginIsEmptyWrapper {
- // TODO(issue/24571): remove '!'.
form!: FormGroup;
}
@@ -5318,15 +5437,10 @@ class LoginIsEmptyWrapper {
`
})
class ValidationBindingsForm {
- // TODO(issue/24571): remove '!'.
form!: FormGroup;
- // TODO(issue/24571): remove '!'.
required!: boolean;
- // TODO(issue/24571): remove '!'.
minLen!: number;
- // TODO(issue/24571): remove '!'.
maxLen!: number;
- // TODO(issue/24571): remove '!'.
pattern!: string;
}
@@ -5335,7 +5449,6 @@ class ValidationBindingsForm {
template: ``
})
class FormControlCheckboxRequiredValidator {
- // TODO(issue/24571): remove '!'.
control!: FormControl;
}
@@ -5347,7 +5460,6 @@ class FormControlCheckboxRequiredValidator {
`
})
class UniqLoginWrapper {
- // TODO(issue/24571): remove '!'.
form!: FormGroup;
}
diff --git a/packages/forms/test/template_integration_spec.ts b/packages/forms/test/template_integration_spec.ts
index 96f797d129b..aeae9a1149f 100644
--- a/packages/forms/test/template_integration_spec.ts
+++ b/packages/forms/test/template_integration_spec.ts
@@ -510,10 +510,15 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
const input = fixture.debugElement.query(By.css('input')).nativeElement;
const form = fixture.debugElement.children[0].injector.get(NgForm);
- expect(input.value).toEqual('Nancy Drew', 'Expected initial view value to be set.');
- expect(form.value)
- .toEqual({name: 'Nancy Drew'}, 'Expected initial control value be set.');
- expect(form.valid).toBe(true, 'Expected validation to run on initial value.');
+ expect(input.value)
+ .withContext('Expected initial view value to be set.')
+ .toEqual('Nancy Drew');
+ expect(form.value).withContext('Expected initial control value be set.').toEqual({
+ name: 'Nancy Drew'
+ });
+ expect(form.valid)
+ .withContext('Expected validation to run on initial value.')
+ .toBe(true);
}));
it('should always set value programmatically right away', fakeAsync(() => {
@@ -530,12 +535,14 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
const input = fixture.debugElement.query(By.css('input')).nativeElement;
const form = fixture.debugElement.children[0].injector.get(NgForm);
expect(input.value)
- .toEqual('Carson', 'Expected view value to update on programmatic change.');
+ .withContext('Expected view value to update on programmatic change.')
+ .toEqual('Carson');
expect(form.value)
.toEqual(
{name: 'Carson'}, 'Expected form value to update on programmatic change.');
expect(form.valid)
- .toBe(false, 'Expected validation to run immediately on programmatic change.');
+ .withContext('Expected validation to run immediately on programmatic change.')
+ .toBe(false);
}));
it('should update value/validity on blur', fakeAsync(() => {
@@ -553,15 +560,17 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
const form = fixture.debugElement.children[0].injector.get(NgForm);
expect(fixture.componentInstance.name)
- .toEqual('Carson', 'Expected value not to update on input.');
- expect(form.valid).toBe(false, 'Expected validation not to run on input.');
+ .withContext('Expected value not to update on input.')
+ .toEqual('Carson');
+ expect(form.valid).withContext('Expected validation not to run on input.').toBe(false);
dispatchEvent(input, 'blur');
fixture.detectChanges();
expect(fixture.componentInstance.name)
- .toEqual('Nancy Drew', 'Expected value to update on blur.');
- expect(form.valid).toBe(true, 'Expected validation to run on blur.');
+ .withContext('Expected value to update on blur.')
+ .toEqual('Nancy Drew');
+ expect(form.valid).withContext('Expected validation to run on blur.').toBe(true);
}));
it('should wait for second blur to update value/validity again', fakeAsync(() => {
@@ -586,15 +595,21 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
const form = fixture.debugElement.children[0].injector.get(NgForm);
expect(fixture.componentInstance.name)
- .toEqual('Nancy Drew', 'Expected value not to update until another blur.');
- expect(form.valid).toBe(true, 'Expected validation not to run until another blur.');
+ .withContext('Expected value not to update until another blur.')
+ .toEqual('Nancy Drew');
+ expect(form.valid)
+ .withContext('Expected validation not to run until another blur.')
+ .toBe(true);
dispatchEvent(input, 'blur');
fixture.detectChanges();
expect(fixture.componentInstance.name)
- .toEqual('Carson', 'Expected value to update on second blur.');
- expect(form.valid).toBe(false, 'Expected validation to run on second blur.');
+ .withContext('Expected value to update on second blur.')
+ .toEqual('Carson');
+ expect(form.valid)
+ .withContext('Expected validation to run on second blur.')
+ .toBe(false);
}));
it('should not update dirtiness until blur', fakeAsync(() => {
@@ -611,12 +626,14 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
tick();
const form = fixture.debugElement.children[0].injector.get(NgForm);
- expect(form.dirty).toBe(false, 'Expected dirtiness not to update on input.');
+ expect(form.dirty)
+ .withContext('Expected dirtiness not to update on input.')
+ .toBe(false);
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(form.dirty).toBe(true, 'Expected dirtiness to update on blur.');
+ expect(form.dirty).withContext('Expected dirtiness to update on blur.').toBe(true);
}));
it('should not update touched until blur', fakeAsync(() => {
@@ -633,12 +650,14 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
tick();
const form = fixture.debugElement.children[0].injector.get(NgForm);
- expect(form.touched).toBe(false, 'Expected touched not to update on input.');
+ expect(form.touched)
+ .withContext('Expected touched not to update on input.')
+ .toBe(false);
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(form.touched).toBe(true, 'Expected touched to update on blur.');
+ expect(form.touched).withContext('Expected touched to update on blur.').toBe(true);
}));
it('should not emit valueChanges or statusChanges until blur', fakeAsync(() => {
@@ -660,7 +679,9 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
fixture.detectChanges();
tick();
- expect(values).toEqual([], 'Expected no valueChanges or statusChanges on input.');
+ expect(values)
+ .withContext('Expected no valueChanges or statusChanges on input.')
+ .toEqual([]);
dispatchEvent(input, 'blur');
fixture.detectChanges();
@@ -680,14 +701,16 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
tick();
expect(fixture.componentInstance.events)
- .toEqual([], 'Expected ngModelChanges not to fire.');
+ .withContext('Expected ngModelChanges not to fire.')
+ .toEqual([]);
const input = fixture.debugElement.query(By.css('input')).nativeElement;
dispatchEvent(input, 'blur');
fixture.detectChanges();
expect(fixture.componentInstance.events)
- .toEqual([], 'Expected ngModelChanges not to fire if value unchanged.');
+ .withContext('Expected ngModelChanges not to fire if value unchanged.')
+ .toEqual([]);
input.value = 'Carson';
dispatchEvent(input, 'input');
@@ -695,14 +718,15 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
tick();
expect(fixture.componentInstance.events)
- .toEqual([], 'Expected ngModelChanges not to fire on input.');
+ .withContext('Expected ngModelChanges not to fire on input.')
+ .toEqual([]);
dispatchEvent(input, 'blur');
fixture.detectChanges();
expect(fixture.componentInstance.events)
- .toEqual(
- ['fired'], 'Expected ngModelChanges to fire once blurred if value changed.');
+ .withContext('Expected ngModelChanges to fire once blurred if value changed.')
+ .toEqual(['fired']);
dispatchEvent(input, 'blur');
fixture.detectChanges();
@@ -718,7 +742,8 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
tick();
expect(fixture.componentInstance.events)
- .toEqual(['fired'], 'Expected ngModelChanges not to fire on input after blur.');
+ .withContext('Expected ngModelChanges not to fire on input after blur.')
+ .toEqual(['fired']);
dispatchEvent(input, 'blur');
fixture.detectChanges();
@@ -753,10 +778,17 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
const input = fixture.debugElement.query(By.css('input')).nativeElement;
const form = fixture.debugElement.children[0].injector.get(NgForm);
- expect(input.value).toEqual('Nancy Drew', 'Expected initial view value to be set.');
+ expect(input.value)
+ .withContext('Expected initial view value to be set.')
+ .toEqual('Nancy Drew');
expect(form.value)
- .toEqual({name: 'Nancy Drew'}, 'Expected initial control value be set.');
- expect(form.valid).toBe(true, 'Expected validation to run on initial value.');
+ .withContext('Expected initial control value be set.')
+ .toEqual(
+ {name: 'Nancy Drew'},
+ );
+ expect(form.valid)
+ .withContext('Expected validation to run on initial value.')
+ .toBe(true);
}));
it('should always set value programmatically right away', fakeAsync(() => {
@@ -773,12 +805,14 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
const input = fixture.debugElement.query(By.css('input')).nativeElement;
const form = fixture.debugElement.children[0].injector.get(NgForm);
expect(input.value)
- .toEqual('Carson', 'Expected view value to update on programmatic change.');
+ .withContext('Expected view value to update on programmatic change.')
+ .toEqual('Carson');
expect(form.value)
- .toEqual(
- {name: 'Carson'}, 'Expected form value to update on programmatic change.');
+ .withContext('Expected form value to update on programmatic change.')
+ .toEqual({name: 'Carson'});
expect(form.valid)
- .toBe(false, 'Expected validation to run immediately on programmatic change.');
+ .withContext('Expected validation to run immediately on programmatic change.')
+ .toBe(false);
}));
@@ -797,24 +831,27 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
const form = fixture.debugElement.children[0].injector.get(NgForm);
expect(fixture.componentInstance.name)
- .toEqual('Carson', 'Expected value not to update on input.');
- expect(form.valid).toBe(false, 'Expected validation not to run on input.');
+ .withContext('Expected value not to update on input.')
+ .toEqual('Carson');
+ expect(form.valid).withContext('Expected validation not to run on input.').toBe(false);
dispatchEvent(input, 'blur');
fixture.detectChanges();
tick();
expect(fixture.componentInstance.name)
- .toEqual('Carson', 'Expected value not to update on blur.');
- expect(form.valid).toBe(false, 'Expected validation not to run on blur.');
+ .withContext('Expected value not to update on blur.')
+ .toEqual('Carson');
+ expect(form.valid).withContext('Expected validation not to run on blur.').toBe(false);
const formEl = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(formEl, 'submit');
fixture.detectChanges();
expect(fixture.componentInstance.name)
- .toEqual('Nancy Drew', 'Expected value to update on submit.');
- expect(form.valid).toBe(true, 'Expected validation to run on submit.');
+ .withContext('Expected value to update on submit.')
+ .toEqual('Nancy Drew');
+ expect(form.valid).withContext('Expected validation to run on submit.').toBe(true);
}));
it('should wait until second submit to update again', fakeAsync(() => {
@@ -842,16 +879,22 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
const form = fixture.debugElement.children[0].injector.get(NgForm);
expect(fixture.componentInstance.name)
- .toEqual('Nancy Drew', 'Expected value not to update until second submit.');
- expect(form.valid).toBe(true, 'Expected validation not to run until second submit.');
+ .withContext('Expected value not to update until second submit.')
+ .toEqual('Nancy Drew');
+ expect(form.valid)
+ .withContext('Expected validation not to run until second submit.')
+ .toBe(true);
dispatchEvent(formEl, 'submit');
fixture.detectChanges();
tick();
expect(fixture.componentInstance.name)
- .toEqual('Carson', 'Expected value to update on second submit.');
- expect(form.valid).toBe(false, 'Expected validation to run on second submit.');
+ .withContext('Expected value to update on second submit.')
+ .toEqual('Carson');
+ expect(form.valid)
+ .withContext('Expected validation to run on second submit.')
+ .toBe(false);
}));
it('should not run validation for onChange controls on submit', fakeAsync(() => {
@@ -889,19 +932,23 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
tick();
const form = fixture.debugElement.children[0].injector.get(NgForm);
- expect(form.dirty).toBe(false, 'Expected dirtiness not to update on input.');
+ expect(form.dirty)
+ .withContext('Expected dirtiness not to update on input.')
+ .toBe(false);
dispatchEvent(input, 'blur');
fixture.detectChanges();
tick();
- expect(form.dirty).toBe(false, 'Expected dirtiness not to update on blur.');
+ expect(form.dirty)
+ .withContext('Expected dirtiness not to update on blur.')
+ .toBe(false);
const formEl = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(formEl, 'submit');
fixture.detectChanges();
- expect(form.dirty).toBe(true, 'Expected dirtiness to update on submit.');
+ expect(form.dirty).withContext('Expected dirtiness to update on submit.').toBe(true);
}));
it('should not update touched until submit', fakeAsync(() => {
@@ -922,13 +969,15 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
tick();
const form = fixture.debugElement.children[0].injector.get(NgForm);
- expect(form.touched).toBe(false, 'Expected touched not to update on blur.');
+ expect(form.touched)
+ .withContext('Expected touched not to update on blur.')
+ .toBe(false);
const formEl = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(formEl, 'submit');
fixture.detectChanges();
- expect(form.touched).toBe(true, 'Expected touched to update on submit.');
+ expect(form.touched).withContext('Expected touched to update on submit.').toBe(true);
}));
it('should reset properly', fakeAsync(() => {
@@ -951,23 +1000,30 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
fixture.detectChanges();
tick();
- expect(input.value).toEqual('', 'Expected view value to reset.');
- expect(form.value).toEqual({name: null}, 'Expected form value to reset.');
+ expect(input.value).withContext('Expected view value to reset.').toEqual('');
+ expect(form.value).withContext('Expected form value to reset.').toEqual({name: null});
expect(fixture.componentInstance.name)
- .toEqual(null, 'Expected ngModel value to reset.');
- expect(form.dirty).toBe(false, 'Expected dirty to stay false on reset.');
- expect(form.touched).toBe(false, 'Expected touched to stay false on reset.');
+ .withContext('Expected ngModel value to reset.')
+ .toEqual(null);
+ expect(form.dirty).withContext('Expected dirty to stay false on reset.').toBe(false);
+ expect(form.touched)
+ .withContext('Expected touched to stay false on reset.')
+ .toBe(false);
const formEl = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(formEl, 'submit');
fixture.detectChanges();
- expect(form.value)
- .toEqual({name: null}, 'Expected form value to stay empty on submit');
+ expect(form.value).withContext('Expected form value to stay empty on submit').toEqual({
+ name: null
+ });
expect(fixture.componentInstance.name)
- .toEqual(null, 'Expected ngModel value to stay empty on submit.');
- expect(form.dirty).toBe(false, 'Expected dirty to stay false on submit.');
- expect(form.touched).toBe(false, 'Expected touched to stay false on submit.');
+ .withContext('Expected ngModel value to stay empty on submit.')
+ .toEqual(null);
+ expect(form.dirty).withContext('Expected dirty to stay false on submit.').toBe(false);
+ expect(form.touched)
+ .withContext('Expected touched to stay false on submit.')
+ .toBe(false);
}));
it('should not emit valueChanges or statusChanges until submit', fakeAsync(() => {
@@ -989,13 +1045,17 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
fixture.detectChanges();
tick();
- expect(values).toEqual([], 'Expected no valueChanges or statusChanges on input.');
+ expect(values)
+ .withContext('Expected no valueChanges or statusChanges on input.')
+ .toEqual([]);
dispatchEvent(input, 'blur');
fixture.detectChanges();
tick();
- expect(values).toEqual([], 'Expected no valueChanges or statusChanges on blur.');
+ expect(values)
+ .withContext('Expected no valueChanges or statusChanges on blur.')
+ .toEqual([]);
const formEl = fixture.debugElement.query(By.css('form')).nativeElement;
dispatchEvent(formEl, 'submit');
@@ -1020,7 +1080,8 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
fixture.detectChanges();
expect(fixture.componentInstance.events)
- .toEqual([], 'Expected ngModelChanges not to fire if value unchanged.');
+ .withContext('Expected ngModelChanges not to fire if value unchanged.')
+ .toEqual([]);
const input = fixture.debugElement.query(By.css('input')).nativeElement;
input.value = 'Carson';
@@ -1029,14 +1090,15 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
tick();
expect(fixture.componentInstance.events)
- .toEqual([], 'Expected ngModelChanges not to fire on input.');
+ .withContext('Expected ngModelChanges not to fire on input.')
+ .toEqual([]);
dispatchEvent(formEl, 'submit');
fixture.detectChanges();
expect(fixture.componentInstance.events)
- .toEqual(
- ['fired'], 'Expected ngModelChanges to fire once submitted if value changed.');
+ .withContext('Expected ngModelChanges to fire once submitted if value changed.')
+ .toEqual(['fired']);
dispatchEvent(formEl, 'submit');
fixture.detectChanges();
@@ -1052,7 +1114,8 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
tick();
expect(fixture.componentInstance.events)
- .toEqual(['fired'], 'Expected ngModelChanges not to fire on input after submit.');
+ .withContext('Expected ngModelChanges not to fire on input after submit.')
+ .toEqual(['fired']);
dispatchEvent(formEl, 'submit');
fixture.detectChanges();
@@ -1091,12 +1154,14 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
const controlOne = form.control.get('one')! as FormControl;
expect((controlOne as any)._updateOn).toBeUndefined();
expect(controlOne.updateOn)
- .toEqual('blur', 'Expected first control to inherit updateOn from parent form.');
+ .withContext('Expected first control to inherit updateOn from parent form.')
+ .toEqual('blur');
const controlTwo = form.control.get('two')! as FormControl;
expect((controlTwo as any)._updateOn).toBeUndefined();
expect(controlTwo.updateOn)
- .toEqual('blur', 'Expected last control to inherit updateOn from parent form.');
+ .withContext('Expected last control to inherit updateOn from parent form.')
+ .toEqual('blur');
}));
it('should actually update using ngFormOptions value', fakeAsync(() => {
@@ -1113,12 +1178,16 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
tick();
const form = fixture.debugElement.children[0].injector.get(NgForm);
- expect(form.value).toEqual({one: ''}, 'Expected value not to update on input.');
+ expect(form.value).withContext('Expected value not to update on input.').toEqual({
+ one: ''
+ });
dispatchEvent(input, 'blur');
fixture.detectChanges();
- expect(form.value).toEqual({one: 'Nancy Drew'}, 'Expected value to update on blur.');
+ expect(form.value).withContext('Expected value to update on blur.').toEqual({
+ one: 'Nancy Drew'
+ });
}));
it('should allow ngModelOptions updateOn to override ngFormOptions', fakeAsync(() => {
@@ -1132,13 +1201,16 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
const controlOne = form.control.get('one')! as FormControl;
expect((controlOne as any)._updateOn).toBeUndefined();
expect(controlOne.updateOn)
- .toEqual('change', 'Expected control updateOn to inherit form updateOn.');
+ .withContext('Expected control updateOn to inherit form updateOn.')
+ .toEqual('change');
const controlTwo = form.control.get('two')! as FormControl;
expect((controlTwo as any)._updateOn)
- .toEqual('blur', 'Expected control to set blur override.');
+ .withContext('Expected control to set blur override.')
+ .toEqual('blur');
expect(controlTwo.updateOn)
- .toEqual('blur', 'Expected control updateOn to override form updateOn.');
+ .withContext('Expected control updateOn to override form updateOn.')
+ .toEqual('blur');
}));
it('should update using ngModelOptions override', fakeAsync(() => {
@@ -1156,8 +1228,10 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
fixture.detectChanges();
const form = fixture.debugElement.children[0].injector.get(NgForm);
- expect(form.value)
- .toEqual({one: 'Nancy Drew', two: ''}, 'Expected first value to update on input.');
+ expect(form.value).withContext('Expected first value to update on input.').toEqual({
+ one: 'Nancy Drew',
+ two: ''
+ });
inputTwo.nativeElement.value = 'Carson Drew';
dispatchEvent(inputTwo.nativeElement, 'input');
@@ -1165,8 +1239,8 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
tick();
expect(form.value)
- .toEqual(
- {one: 'Nancy Drew', two: ''}, 'Expected second value not to update on input.');
+ .withContext('Expected second value not to update on input.')
+ .toEqual({one: 'Nancy Drew', two: ''});
dispatchEvent(inputTwo.nativeElement, 'blur');
fixture.detectChanges();
@@ -1191,7 +1265,8 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
fixture.detectChanges();
expect(fixture.componentInstance.two)
- .toEqual('Nancy Drew', 'Expected standalone ngModel not to inherit blur update.');
+ .withContext('Expected standalone ngModel not to inherit blur update.')
+ .toEqual('Nancy Drew');
}));
});
});
@@ -2650,7 +2725,6 @@ import {NgModelCustomComp, NgModelCustomWrapper} from './value_accessor_integrat
`
})
class StandaloneNgModel {
- // TODO(issue/24571): remove '!'.
name!: string;
}
@@ -2663,9 +2737,7 @@ class StandaloneNgModel {
`
})
class NgModelForm {
- // TODO(issue/24571): remove '!'.
name!: string|null;
- // TODO(issue/24571): remove '!'.
event!: Event;
options = {};
@@ -2689,13 +2761,9 @@ class NgModelNativeValidateForm {
`
})
class NgModelGroupForm {
- // TODO(issue/24571): remove '!'.
first!: string;
- // TODO(issue/24571): remove '!'.
last!: string;
- // TODO(issue/24571): remove '!'.
email!: string;
- // TODO(issue/24571): remove '!'.
isDisabled!: boolean;
options = {updateOn: 'change'};
}
@@ -2712,7 +2780,6 @@ class NgModelGroupForm {
`
})
class NgModelValidBinding {
- // TODO(issue/24571): remove '!'.
first!: string;
}
@@ -2729,11 +2796,9 @@ class NgModelValidBinding {
`
})
class NgModelNgIfForm {
- // TODO(issue/24571): remove '!'.
first!: string;
groupShowing = true;
emailShowing = true;
- // TODO(issue/24571): remove '!'.
email!: string;
}
@@ -2787,9 +2852,7 @@ class InvalidNgModelNoName {
`
})
class NgModelOptionsStandalone {
- // TODO(issue/24571): remove '!'.
one!: string;
- // TODO(issue/24571): remove '!'.
two!: string;
options: {name?: string, standalone?: boolean, updateOn?: string} = {standalone: true};
formOptions = {};
@@ -2807,13 +2870,9 @@ class NgModelOptionsStandalone {
`
})
class NgModelValidationBindings {
- // TODO(issue/24571): remove '!'.
required!: boolean;
- // TODO(issue/24571): remove '!'.
minLen!: number;
- // TODO(issue/24571): remove '!'.
maxLen!: number;
- // TODO(issue/24571): remove '!'.
pattern!: string;
}
@@ -2826,11 +2885,8 @@ class NgModelValidationBindings {
`
})
class NgModelMultipleValidators {
- // TODO(issue/24571): remove '!'.
required!: boolean;
- // TODO(issue/24571): remove '!'.
minLen!: number;
- // TODO(issue/24571): remove '!'.
pattern!: string|RegExp;
}
@@ -2880,7 +2936,6 @@ class NgModelAsyncValidation {
`
})
class NgModelChangesForm {
- // TODO(issue/24571): remove '!'.
name!: string;
events: string[] = [];
options: any;
diff --git a/packages/forms/test/typed_integration_spec.ts b/packages/forms/test/typed_integration_spec.ts
index 3f5722d79a7..a625da06d19 100644
--- a/packages/forms/test/typed_integration_spec.ts
+++ b/packages/forms/test/typed_integration_spec.ts
@@ -1468,7 +1468,7 @@ describe('Typed Class', () => {
t1 = null as unknown as RawValueType;
}
c.reset();
- expect(c.value).not.toBeNull;
+ expect(c.value).not.toBeNull();
});
});
diff --git a/packages/forms/test/validators_spec.ts b/packages/forms/test/validators_spec.ts
index 6290ae024b6..e8c22fec8e2 100644
--- a/packages/forms/test/validators_spec.ts
+++ b/packages/forms/test/validators_spec.ts
@@ -26,7 +26,7 @@ class AsyncValidatorDirective implements AsyncValidator {
constructor(private expected: string, private error: any) {}
validate(c: any): Observable {
- return Observable.create((obs: any) => {
+ return new Observable((obs: any) => {
const error = this.expected !== c.value ? this.error : null;
obs.next(error);
obs.complete();
@@ -561,8 +561,9 @@ describe('Validators', () => {
`Expected errors not to be set until all validators came back.`);
tick(100);
- expect(errorMap!).toEqual(
- {one: true, two: true}, `Expected errors to merge once all validators resolved.`);
+ expect(errorMap!)
+ .withContext(`Expected errors to merge once all validators resolved.`)
+ .toEqual({one: true, two: true});
}));
});
});
diff --git a/packages/forms/test/value_accessor_integration_spec.ts b/packages/forms/test/value_accessor_integration_spec.ts
index 243572b07b5..364a26add25 100644
--- a/packages/forms/test/value_accessor_integration_spec.ts
+++ b/packages/forms/test/value_accessor_integration_spec.ts
@@ -1231,7 +1231,6 @@ describe('value accessors in reactive forms with custom options', () => {
@Component({selector: 'form-control-comp', template: ``})
export class FormControlComp {
- // TODO(issue/24571): remove '!'.
control!: FormControl;
}
@@ -1243,13 +1242,9 @@ export class FormControlComp {
`
})
export class FormGroupComp {
- // TODO(issue/24571): remove '!'.
control!: FormControl;
- // TODO(issue/24571): remove '!'.
form!: FormGroup;
- // TODO(issue/24571): remove '!'.
myGroup!: FormGroup;
- // TODO(issue/24571): remove '!'.
event!: Event;
}
@@ -1258,7 +1253,6 @@ export class FormGroupComp {
template: ``
})
class FormControlNumberInput {
- // TODO(issue/24571): remove '!'.
control!: FormControl;
}
@@ -1418,7 +1412,6 @@ class NgModelSelectMultipleWithCustomCompareFnForm {
`
})
class NgModelSelectMultipleForm {
- // TODO(issue/24571): remove '!'.
selectedCities!: any[];
cities: any[] = [];
}
@@ -1428,7 +1421,6 @@ class NgModelSelectMultipleForm {
template: ``
})
class FormControlRangeInput {
- // TODO(issue/24571): remove '!'.
control!: FormControl;
}
@@ -1450,7 +1442,6 @@ class NgModelRangeForm {
`
})
export class FormControlRadioButtons {
- // TODO(issue/24571): remove '!'.
form!: FormGroup;
showRadio = new FormControl('yes');
}
@@ -1468,9 +1459,7 @@ export class FormControlRadioButtons {
`
})
class NgModelRadioForm {
- // TODO(issue/24571): remove '!'.
food!: string;
- // TODO(issue/24571): remove '!'.
drink!: string;
}
@@ -1484,7 +1473,6 @@ class NgModelRadioForm {
})
class WrappedValue implements ControlValueAccessor {
value: any;
- // TODO(issue/24571): remove '!'.
onChange!: Function;
writeValue(value: any) {
@@ -1543,7 +1531,6 @@ class CvaWithDisabledStateForm {
@Component({selector: 'my-input', template: ''})
export class MyInput implements ControlValueAccessor {
@Output('input') onInput = new EventEmitter();
- // TODO(issue/24571): remove '!'.
value!: string;
control: AbstractControl|null = null;
@@ -1579,7 +1566,6 @@ export class MyInput implements ControlValueAccessor {
`
})
export class MyInputForm {
- // TODO(issue/24571): remove '!'.
form!: FormGroup;
@ViewChild(MyInput) myInput: MyInput|null = null;
}
@@ -1592,7 +1578,6 @@ export class MyInputForm {
`
})
class WrappedValueForm {
- // TODO(issue/24571): remove '!'.
form!: FormGroup;
}
@@ -1604,10 +1589,8 @@ class WrappedValueForm {
providers: [{provide: NG_VALUE_ACCESSOR, multi: true, useExisting: NgModelCustomComp}]
})
export class NgModelCustomComp implements ControlValueAccessor {
- // TODO(issue/24571): remove '!'.
model!: string;
@Input('disabled') isDisabled: boolean = false;
- // TODO(issue/24571): remove '!'.
changeFn!: (value: any) => void;
writeValue(value: any) {
@@ -1634,7 +1617,6 @@ export class NgModelCustomComp implements ControlValueAccessor {
`
})
export class NgModelCustomWrapper {
- // TODO(issue/24571): remove '!'.
name!: string;
isDisabled = false;
}