2016-06-23 12:47:54 -04:00
|
|
|
/**
|
|
|
|
* @license
|
|
|
|
* Copyright Google Inc. 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.io/license
|
|
|
|
*/
|
|
|
|
|
2016-06-10 14:15:59 -04:00
|
|
|
import {AbstractControl, Control, ControlArray, ControlGroup, Validators} from '@angular/common/src/forms-deprecated';
|
2016-06-23 20:10:22 -04:00
|
|
|
import {fakeAsync, flushMicrotasks, tick} from '@angular/core/testing';
|
2016-06-08 19:38:52 -04:00
|
|
|
import {afterEach, beforeEach, ddescribe, describe, expect, iit, it, xit} from '@angular/core/testing/testing_internal';
|
2016-06-26 18:52:50 -04:00
|
|
|
import {Observable} from 'rxjs/Observable';
|
2016-06-08 19:38:52 -04:00
|
|
|
|
2016-04-28 20:50:03 -04:00
|
|
|
import {EventEmitter, ObservableWrapper, TimerWrapper} from '../../src/facade/async';
|
2016-06-08 19:38:52 -04:00
|
|
|
import {PromiseWrapper} from '../../src/facade/promise';
|
2016-06-26 18:52:50 -04:00
|
|
|
import {normalizeAsyncValidator} from '../../src/forms-deprecated/directives/normalize_validator';
|
2015-02-11 14:10:31 -05:00
|
|
|
|
|
|
|
export function main() {
|
2015-05-22 15:32:49 -04:00
|
|
|
function validator(key: string, error: any) {
|
feat(validators): Allow errors at both the group/array level or their children
Allow ControlGroups and ControlArrays to contain errors from their level, and
errors from their children. [Design Doc](https://docs.google.com/document/d/1EnJ3-_iFpVKFz1ifN1LkXSGQ7h3A72OQGry2g8eo7IA/edit?pli=1#heading=h.j53rt81eegm4)
BREAKING CHANGE: errors format has changed from validators. Now errors from
a control or an array's children are prefixed with 'controls' while errors
from the object itself are left at the root level.
Example:
Given a Control group as follows:
var group = new ControlGroup({
login: new Control("", required),
password: new Control("", required),
passwordConfirm: new Control("", required)
});
Before:
group.errors
{
login: {required: true},
password: {required: true},
passwordConfirm: {required: true},
}
After:
group.errors
{
controls: {
login: {required: true},
password: {required: true},
passwordConfirm: {required: true},
}
}
2015-10-16 19:13:14 -04:00
|
|
|
return function(c: AbstractControl) {
|
2015-02-11 14:10:31 -05:00
|
|
|
var r = {};
|
2016-06-08 18:45:15 -04:00
|
|
|
(r as any /** TODO #9100 */)[key] = error;
|
2015-02-11 14:10:31 -05:00
|
|
|
return r;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2016-06-26 18:52:50 -04:00
|
|
|
class AsyncValidatorDirective {
|
|
|
|
constructor(private expected: string, private error: any) {}
|
|
|
|
|
|
|
|
validate(c: any): {[key: string]: any;} {
|
|
|
|
return Observable.create((obs: any) => {
|
|
|
|
const error = this.expected !== c.value ? this.error : null;
|
|
|
|
obs.next(error);
|
|
|
|
obs.complete();
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
describe('Validators', () => {
|
|
|
|
describe('required', () => {
|
|
|
|
it('should error on an empty string',
|
|
|
|
() => { expect(Validators.required(new Control(''))).toEqual({'required': true}); });
|
2015-02-11 14:10:31 -05:00
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should error on null',
|
|
|
|
() => { expect(Validators.required(new Control(null))).toEqual({'required': true}); });
|
2015-02-11 14:10:31 -05:00
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should not error on a non-empty string',
|
|
|
|
() => { expect(Validators.required(new Control('not empty'))).toEqual(null); });
|
2016-01-21 08:25:31 -05:00
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should accept zero as valid',
|
2016-01-21 08:25:31 -05:00
|
|
|
() => { expect(Validators.required(new Control(0))).toEqual(null); });
|
2015-02-11 14:10:31 -05:00
|
|
|
});
|
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
describe('minLength', () => {
|
|
|
|
it('should not error on an empty string',
|
|
|
|
() => { expect(Validators.minLength(2)(new Control(''))).toEqual(null); });
|
2015-10-13 17:38:13 -04:00
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should not error on null',
|
2015-10-13 17:38:13 -04:00
|
|
|
() => { expect(Validators.minLength(2)(new Control(null))).toEqual(null); });
|
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should not error on valid strings',
|
|
|
|
() => { expect(Validators.minLength(2)(new Control('aa'))).toEqual(null); });
|
2015-10-13 17:38:13 -04:00
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should error on short strings', () => {
|
|
|
|
expect(Validators.minLength(2)(new Control('a'))).toEqual({
|
|
|
|
'minlength': {'requiredLength': 2, 'actualLength': 1}
|
|
|
|
});
|
2015-10-13 17:38:13 -04:00
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
describe('maxLength', () => {
|
|
|
|
it('should not error on an empty string',
|
|
|
|
() => { expect(Validators.maxLength(2)(new Control(''))).toEqual(null); });
|
2015-10-13 17:38:13 -04:00
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should not error on null',
|
2015-10-13 17:38:13 -04:00
|
|
|
() => { expect(Validators.maxLength(2)(new Control(null))).toEqual(null); });
|
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should not error on valid strings',
|
|
|
|
() => { expect(Validators.maxLength(2)(new Control('aa'))).toEqual(null); });
|
2015-10-13 17:38:13 -04:00
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should error on long strings', () => {
|
|
|
|
expect(Validators.maxLength(2)(new Control('aaa'))).toEqual({
|
|
|
|
'maxlength': {'requiredLength': 2, 'actualLength': 3}
|
|
|
|
});
|
2015-10-13 17:38:13 -04:00
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
describe('pattern', () => {
|
|
|
|
it('should not error on an empty string',
|
|
|
|
() => { expect(Validators.pattern('[a-zA-Z ]*')(new Control(''))).toEqual(null); });
|
2015-11-20 01:36:28 -05:00
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should not error on null',
|
|
|
|
() => { expect(Validators.pattern('[a-zA-Z ]*')(new Control(null))).toEqual(null); });
|
2015-11-20 01:36:28 -05:00
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should not error on valid strings',
|
|
|
|
() => { expect(Validators.pattern('[a-zA-Z ]*')(new Control('aaAA'))).toEqual(null); });
|
2015-11-20 01:36:28 -05:00
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should error on failure to match string', () => {
|
|
|
|
expect(Validators.pattern('[a-zA-Z ]*')(new Control('aaa0'))).toEqual({
|
|
|
|
'pattern': {'requiredPattern': '^[a-zA-Z ]*$', 'actualValue': 'aaa0'}
|
|
|
|
});
|
2015-11-20 01:36:28 -05:00
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2016-06-26 18:52:50 -04:00
|
|
|
it('should normalize and evaluate async validator-directives correctly', fakeAsync(() => {
|
|
|
|
const c = Validators.composeAsync(
|
|
|
|
[normalizeAsyncValidator(new AsyncValidatorDirective('expected', {'one': true}))]);
|
|
|
|
|
|
|
|
let value: any = null;
|
|
|
|
c(new Control()).then((v: any) => value = v);
|
|
|
|
tick(1);
|
|
|
|
|
|
|
|
expect(value).toEqual({'one': true});
|
|
|
|
}));
|
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
describe('compose', () => {
|
|
|
|
it('should return null when given null',
|
2015-11-02 12:59:40 -05:00
|
|
|
() => { expect(Validators.compose(null)).toBe(null); });
|
2015-09-02 13:24:22 -04:00
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should collect errors from all the validators', () => {
|
|
|
|
var c = Validators.compose([validator('a', true), validator('b', true)]);
|
|
|
|
expect(c(new Control(''))).toEqual({'a': true, 'b': true});
|
2015-02-11 14:10:31 -05:00
|
|
|
});
|
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should run validators left to right', () => {
|
|
|
|
var c = Validators.compose([validator('a', 1), validator('a', 2)]);
|
|
|
|
expect(c(new Control(''))).toEqual({'a': 2});
|
2015-02-11 14:10:31 -05:00
|
|
|
});
|
2015-02-24 14:59:10 -05:00
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should return null when no errors', () => {
|
2015-03-19 17:21:40 -04:00
|
|
|
var c = Validators.compose([Validators.nullValidator, Validators.nullValidator]);
|
2016-06-08 19:38:52 -04:00
|
|
|
expect(c(new Control(''))).toEqual(null);
|
2015-02-24 14:59:10 -05:00
|
|
|
});
|
2015-10-29 20:45:24 -04:00
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should ignore nulls', () => {
|
2015-10-29 20:45:24 -04:00
|
|
|
var c = Validators.compose([null, Validators.required]);
|
2016-06-08 19:38:52 -04:00
|
|
|
expect(c(new Control(''))).toEqual({'required': true});
|
2015-10-29 20:45:24 -04:00
|
|
|
});
|
2015-02-11 14:10:31 -05:00
|
|
|
});
|
2015-11-02 12:59:40 -05:00
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
describe('composeAsync', () => {
|
2016-06-08 18:45:15 -04:00
|
|
|
function asyncValidator(expected: any /** TODO #9100 */, response: any /** TODO #9100 */) {
|
|
|
|
return (c: any /** TODO #9100 */) => {
|
2015-11-05 20:18:16 -05:00
|
|
|
var emitter = new EventEmitter();
|
2015-11-02 12:59:40 -05:00
|
|
|
var res = c.value != expected ? response : null;
|
2015-11-05 20:18:16 -05:00
|
|
|
|
|
|
|
PromiseWrapper.scheduleMicrotask(() => {
|
2015-11-16 02:58:59 -05:00
|
|
|
ObservableWrapper.callEmit(emitter, res);
|
2015-11-05 20:18:16 -05:00
|
|
|
// this is required because of a bug in ObservableWrapper
|
2015-11-16 02:58:59 -05:00
|
|
|
// where callComplete can fire before callEmit
|
2015-11-05 20:18:16 -05:00
|
|
|
// remove this one the bug is fixed
|
|
|
|
TimerWrapper.setTimeout(() => { ObservableWrapper.callComplete(emitter); }, 0);
|
|
|
|
});
|
|
|
|
return emitter;
|
2015-11-02 12:59:40 -05:00
|
|
|
};
|
|
|
|
}
|
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should return null when given null',
|
2015-11-02 12:59:40 -05:00
|
|
|
() => { expect(Validators.composeAsync(null)).toEqual(null); });
|
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should collect errors from all the validators', fakeAsync(() => {
|
2015-11-02 12:59:40 -05:00
|
|
|
var c = Validators.composeAsync([
|
2016-06-08 19:38:52 -04:00
|
|
|
asyncValidator('expected', {'one': true}), asyncValidator('expected', {'two': true})
|
2015-11-02 12:59:40 -05:00
|
|
|
]);
|
|
|
|
|
2016-06-08 18:45:15 -04:00
|
|
|
var value: any /** TODO #9100 */ = null;
|
2016-06-08 19:38:52 -04:00
|
|
|
(<Promise<any>>c(new Control('invalid'))).then(v => value = v);
|
2015-11-02 12:59:40 -05:00
|
|
|
|
|
|
|
tick(1);
|
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
expect(value).toEqual({'one': true, 'two': true});
|
2015-11-02 12:59:40 -05:00
|
|
|
}));
|
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should return null when no errors', fakeAsync(() => {
|
|
|
|
var c = Validators.composeAsync([asyncValidator('expected', {'one': true})]);
|
2015-11-02 12:59:40 -05:00
|
|
|
|
2016-06-08 18:45:15 -04:00
|
|
|
var value: any /** TODO #9100 */ = null;
|
2016-06-08 19:38:52 -04:00
|
|
|
(<Promise<any>>c(new Control('expected'))).then(v => value = v);
|
2015-11-02 12:59:40 -05:00
|
|
|
|
|
|
|
tick(1);
|
|
|
|
|
|
|
|
expect(value).toEqual(null);
|
|
|
|
}));
|
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
it('should ignore nulls', fakeAsync(() => {
|
|
|
|
var c = Validators.composeAsync([asyncValidator('expected', {'one': true}), null]);
|
2015-11-02 12:59:40 -05:00
|
|
|
|
2016-06-08 18:45:15 -04:00
|
|
|
var value: any /** TODO #9100 */ = null;
|
2016-06-08 19:38:52 -04:00
|
|
|
(<Promise<any>>c(new Control('invalid'))).then(v => value = v);
|
2015-11-02 12:59:40 -05:00
|
|
|
|
|
|
|
tick(1);
|
|
|
|
|
2016-06-08 19:38:52 -04:00
|
|
|
expect(value).toEqual({'one': true});
|
2015-11-02 12:59:40 -05:00
|
|
|
}));
|
|
|
|
});
|
2015-02-11 14:10:31 -05:00
|
|
|
});
|
feat(validators): Allow errors at both the group/array level or their children
Allow ControlGroups and ControlArrays to contain errors from their level, and
errors from their children. [Design Doc](https://docs.google.com/document/d/1EnJ3-_iFpVKFz1ifN1LkXSGQ7h3A72OQGry2g8eo7IA/edit?pli=1#heading=h.j53rt81eegm4)
BREAKING CHANGE: errors format has changed from validators. Now errors from
a control or an array's children are prefixed with 'controls' while errors
from the object itself are left at the root level.
Example:
Given a Control group as follows:
var group = new ControlGroup({
login: new Control("", required),
password: new Control("", required),
passwordConfirm: new Control("", required)
});
Before:
group.errors
{
login: {required: true},
password: {required: true},
passwordConfirm: {required: true},
}
After:
group.errors
{
controls: {
login: {required: true},
password: {required: true},
passwordConfirm: {required: true},
}
}
2015-10-16 19:13:14 -04:00
|
|
|
}
|