inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-26 17:24:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

#17 More Unit test cases and code improvements

Browse Source
This commit is contained in:
mauriziovitale84 2016-05-09 10:11:47 +01:00
parent 4288750901
commit 6957faddcf
9 changed files with 202 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
ng2-components/ng2-alfresco-login/src/components/alfresco-login.d.ts vendored
View File

@ -20,6 +20,7 @@ import { ControlGroup, FormBuilder } from 'angular2/common';
import { AlfrescoAuthenticationService } from '../services/alfresco-authentication'; import { AlfrescoAuthenticationService } from '../services/alfresco-authentication';
import { TranslateService } from 'ng2-translate/ng2-translate'; import { TranslateService } from 'ng2-translate/ng2-translate';
export declare class AlfrescoLoginComponent { export declare class AlfrescoLoginComponent {
private _fb;
auth: AlfrescoAuthenticationService; auth: AlfrescoAuthenticationService;
router: Router; router: Router;
method: string; method: string;
@ -29,19 +30,28 @@ export declare class AlfrescoLoginComponent {
form: ControlGroup; form: ControlGroup;
error: boolean; error: boolean;
success: boolean; success: boolean;
formError: {
[id: string]: string;
};
private _message;
/** /**
* Constructor * Constructor
* @param fb * @param _fb
* @param auth * @param auth
* @param router * @param router
*/ */
constructor(fb: FormBuilder, auth: AlfrescoAuthenticationService, router: Router, translate: TranslateService); constructor(_fb: FormBuilder, auth: AlfrescoAuthenticationService, router: Router, translate: TranslateService);
/** /**
* Method called on submit form * Method called on submit form
* @param value * @param value
* @param event * @param event
*/ */
onSubmit(value: any, event: any): void; onSubmit(value: any, event: any): void;
/**
* The method check the error in the form and push the error in the formError object
* @param data
*/
onValueChanged(data: any): void;
/** /**
* The method return if a field is valid or not * The method return if a field is valid or not
* @param field * @param field

11
ng2-components/ng2-alfresco-login/src/components/alfresco-login.html
View File

@ -7,19 +7,16 @@
<div [ngClass]="{'is-invalid': isErrorStyle(form.controls.username)}" class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label "> <div [ngClass]="{'is-invalid': isErrorStyle(form.controls.username)}" class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label ">
<label for="username" class="mdl-textfield__label">{{'username' | translate }}</label> <label for="username" class="mdl-textfield__label">{{'username' | translate }}</label>
<input type="text" class="mdl-textfield__input" id="username" ngControl="username" tabindex="1" /> <input type="text" class="mdl-textfield__input" id="username" ngControl="username" tabindex="1" />
<span class="mdl-tooltip mdl-tooltip--validation" for="username" *ngIf="form.controls.username.hasError('required')"> <span class="mdl-tooltip mdl-tooltip--validation" for="username" *ngIf="formError.username">
<span id="username-required">{{'input-required-message' | translate }}</span> <span id="username-error">{{formError.username | translate }}</span>
</span>
<span class="mdl-tooltip mdl-tooltip--validation" for="username" *ngIf="form.controls.username.hasError('minlength')">
<span id="username-min">{{'input-min-message' | translate }}</span>
</span> </span>
</div> </div>
<div [ngClass]="{'is-invalid': isErrorStyle(form.controls.password)}" class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label"> <div [ngClass]="{'is-invalid': isErrorStyle(form.controls.password)}" class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
<label for="password" class="mdl-textfield__label">{{'password' | translate }}</label> <label for="password" class="mdl-textfield__label">{{'password' | translate }}</label>
<input type="password" class="mdl-textfield__input" id="password" ngControl="password" tabindex="2" /> <input type="password" class="mdl-textfield__input" id="password" ngControl="password" tabindex="2" />
<span class="mdl-tooltip mdl-tooltip--validation" for="password" *ngIf="form.controls.password.hasError('required')"> <span class="mdl-tooltip mdl-tooltip--validation" for="password" *ngIf="formError.password">
<span id="password-required">{{'input-required-message' | translate }}</span> <span id="password-required">{{formError.password | translate }}</span>
</span> </span>
</div> </div>
</div> </div>

38
ng2-components/ng2-alfresco-login/src/components/alfresco-login.js
View File

@ -33,11 +33,13 @@ System.register(['angular2/core', 'angular2/router', 'angular2/common', '../serv
AlfrescoLoginComponent = (function () { AlfrescoLoginComponent = (function () {
/** /**
* Constructor * Constructor
* @param fb * @param _fb
* @param auth * @param auth
* @param router * @param router
*/ */
function AlfrescoLoginComponent(fb, auth, router, translate) { function AlfrescoLoginComponent(_fb, auth, router, translate) {
var _this = this;
this._fb = _fb;
this.auth = auth; this.auth = auth;
this.router = router; this.router = router;
this.method = 'POST'; this.method = 'POST';
@ -45,11 +47,26 @@ System.register(['angular2/core', 'angular2/router', 'angular2/common', '../serv
this.onError = new core_1.EventEmitter(); this.onError = new core_1.EventEmitter();
this.error = false; this.error = false;
this.success = false; this.success = false;
this.form = fb.group({ this.formError = {
'username': '',
'password': ''
};
this.form = this._fb.group({
username: ['', common_1.Validators.compose([common_1.Validators.required, common_1.Validators.minLength(4)])], username: ['', common_1.Validators.compose([common_1.Validators.required, common_1.Validators.minLength(4)])],
password: ['', common_1.Validators.required] password: ['', common_1.Validators.required]
}); });
this._message = {
'username': {
'required': 'input-required-message',
'minlength': 'input-min-message'
},
'password': {
'required': 'input-required-message'
}
};
this.translationInit(translate); this.translationInit(translate);
this.form.valueChanges.subscribe(function (data) { return _this.onValueChanged(data); });
this.onValueChanged();
} }
/** /**
* Method called on submit form * Method called on submit form
@ -83,6 +100,21 @@ System.register(['angular2/core', 'angular2/router', 'angular2/common', '../serv
_this.success = false; _this.success = false;
}, function () { return console.log('Login done'); }); }, function () { return console.log('Login done'); });
}; };
/**
* The method check the error in the form and push the error in the formError object
* @param data
*/
AlfrescoLoginComponent.prototype.onValueChanged = function (data) {
for (var field in this.formError) {
this.formError[field] = '';
var hasError = this.form.controls[field].errors || (this.form.controls[field].dirty && !this.form.controls[field].valid);
if (hasError) {
for (var key in this.form.controls[field].errors) {
this.formError[field] += this._message[field][key] + '';
}
}
}
};
/** /**
* The method return if a field is valid or not * The method return if a field is valid or not
* @param field * @param field

2
ng2-components/ng2-alfresco-login/src/components/alfresco-login.js.map
View File

@ -1 +1 @@
{"version":3,"file":"alfresco-login.js","sourceRoot":"","sources":["alfresco-login.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAiCA;gBAUI;;;;;mBAKG;gBACH,gCAAY,EAAc,EACP,IAAkC,EAClC,MAAa,EACpB,SAA0B;oBAFnB,SAAI,GAAJ,IAAI,CAA8B;oBAClC,WAAM,GAAN,MAAM,CAAO;oBAjBvB,WAAM,GAAU,MAAM,CAAC;oBACtB,cAAS,GAAG,IAAI,mBAAY,EAAE,CAAC;oBAC/B,YAAO,GAAG,IAAI,mBAAY,EAAE,CAAC;oBAIvC,UAAK,GAAW,KAAK,CAAC;oBACtB,YAAO,GAAW,KAAK,CAAC;oBAapB,IAAI,CAAC,IAAI,GAAG,EAAE,CAAC,KAAK,CAAC;wBACjB,QAAQ,EAAE,CAAC,EAAE,EAAE,mBAAU,CAAC,OAAO,CAAC,CAAC,mBAAU,CAAC,QAAQ,EAAE,mBAAU,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;wBAClF,QAAQ,EAAE,CAAC,EAAE,EAAE,mBAAU,CAAC,QAAQ,CAAC;qBACtC,CAAC,CAAC;oBAEH,IAAI,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC;gBACpC,CAAC;gBAED;;;;mBAIG;gBACH,yCAAQ,GAAR,UAAS,KAAS,EAAE,KAAK;oBAAzB,iBA6BC;oBA5BG,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;oBACnB,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;wBACR,KAAK,CAAC,cAAc,EAAE,CAAC;oBAC3B,CAAC;oBACD,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC;yBACvD,SAAS,CACV,UAAC,KAAS;wBACN,IAAI,CAAC;4BACD,KAAI,CAAC,OAAO,GAAG,IAAI,CAAC;4BACpB,KAAI,CAAC,SAAS,CAAC,IAAI,CAAC;gCAChB,KAAK,EAAE,UAAU;6BACpB,CAAC,CAAC;4BACH,KAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;wBACnC,CAAE;wBAAA,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;4BACb,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;wBACjC,CAAC;oBAEL,CAAC,EACD,UAAC,GAAO;wBACJ,KAAI,CAAC,KAAK,GAAG,IAAI,CAAC;wBAClB,KAAI,CAAC,OAAO,CAAC,IAAI,CAAC;4BACd,KAAK,EAAE,UAAU;yBACpB,CAAC,CAAC;wBACH,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;wBACjB,KAAI,CAAC,OAAO,GAAG,KAAK,CAAC;oBACzB,CAAC,EACD,cAAM,OAAA,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC,EAAzB,CAAyB,CAClC,CAAC;gBACN,CAAC;gBAED;;;;mBAIG;gBACH,6CAAY,GAAZ,UAAa,KAAkB;oBAC3B,EAAE,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC;wBACnB,gBAAgB,CAAC,oBAAoB,EAAE,CAAC;oBAC5C,CAAC;oBACD,EAAE,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;wBACd,MAAM,CAAC,KAAK,CAAC;oBACjB,CAAC;oBAAC,IAAI,CAAC,CAAC;wBACJ,MAAM,CAAC,IAAI,CAAC;oBAChB,CAAC;gBACL,CAAC;gBAED;;;mBAGG;gBACH,gDAAe,GAAf,UAAgB,SAA2B;oBACvC,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;oBAC3B,IAAI,QAAQ,GAAG,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,kCAAkC;oBACnF,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,QAAQ,GAAG,IAAI,CAAC;oBAExD,IAAI,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;oBAEpC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;gBACjC,CAAC;gBA5FD;oBAAC,YAAK,EAAE;;sEAAA;gBACR;oBAAC,aAAM,EAAE;;yEAAA;gBACT;oBAAC,aAAM,EAAE;;uEAAA;gBAZb;oBAAC,gBAAS,CAAC;wBACP,QAAQ,EAAE,gBAAgB;wBAC1B,QAAQ,EAAE,YAAY;wBACtB,UAAU,EAAE,CAAC,0BAAiB,EAAE,wBAAe,CAAC;wBAChD,WAAW,EAAE,uBAAuB;wBACpC,SAAS,EAAE,CAAC,sBAAsB,CAAC;wBACnC,KAAK,EAAE,CAAC,6BAAa,CAAC;qBAEzB,CAAC;;0CAAA;gBA+FF,6BAAC;YAAD,CAAC,AA9FD,IA8FC;YA9FD,2DA8FC,CAAA"} {"version":3,"file":"alfresco-login.js","sourceRoot":"","sources":["alfresco-login.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAiCA;gBAgBI;;;;;mBAKG;gBACH,gCAAoB,GAAgB,EACjB,IAAmC,EACnC,MAAc,EACrB,SAA2B;oBAzB3C,iBAsIC;oBAhHuB,QAAG,GAAH,GAAG,CAAa;oBACjB,SAAI,GAAJ,IAAI,CAA+B;oBACnC,WAAM,GAAN,MAAM,CAAQ;oBAvBxB,WAAM,GAAW,MAAM,CAAC;oBACvB,cAAS,GAAG,IAAI,mBAAY,EAAE,CAAC;oBAC/B,YAAO,GAAG,IAAI,mBAAY,EAAE,CAAC;oBAIvC,UAAK,GAAY,KAAK,CAAC;oBACvB,YAAO,GAAY,KAAK,CAAC;oBAmBrB,IAAI,CAAC,SAAS,GAAG;wBACb,UAAU,EAAE,EAAE;wBACd,UAAU,EAAE,EAAE;qBACjB,CAAC;oBAEF,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC;wBACvB,QAAQ,EAAE,CAAC,EAAE,EAAE,mBAAU,CAAC,OAAO,CAAC,CAAC,mBAAU,CAAC,QAAQ,EAAE,mBAAU,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;wBAClF,QAAQ,EAAE,CAAC,EAAE,EAAE,mBAAU,CAAC,QAAQ,CAAC;qBACtC,CAAC,CAAC;oBAEH,IAAI,CAAC,QAAQ,GAAG;wBACZ,UAAU,EAAE;4BACR,UAAU,EAAE,wBAAwB;4BACpC,WAAW,EAAE,mBAAmB;yBACnC;wBACD,UAAU,EAAE;4BACR,UAAU,EAAE,wBAAwB;yBACvC;qBACJ,CAAC;oBACF,IAAI,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC;oBAEhC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,UAAA,IAAI,IAAI,OAAA,KAAI,CAAC,cAAc,CAAC,IAAI,CAAC,EAAzB,CAAyB,CAAC,CAAC;oBAEpE,IAAI,CAAC,cAAc,EAAE,CAAC;gBAC1B,CAAC;gBAED;;;;mBAIG;gBACH,yCAAQ,GAAR,UAAS,KAAU,EAAE,KAAK;oBAA1B,iBA6BC;oBA5BG,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;oBACnB,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;wBACR,KAAK,CAAC,cAAc,EAAE,CAAC;oBAC3B,CAAC;oBACD,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC;yBACvD,SAAS,CACV,UAAC,KAAU;wBACP,IAAI,CAAC;4BACD,KAAI,CAAC,OAAO,GAAG,IAAI,CAAC;4BACpB,KAAI,CAAC,SAAS,CAAC,IAAI,CAAC;gCAChB,KAAK,EAAE,UAAU;6BACpB,CAAC,CAAC;4BACH,KAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;wBACnC,CAAE;wBAAA,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;4BACb,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;wBACjC,CAAC;oBAEL,CAAC,EACD,UAAC,GAAQ;wBACL,KAAI,CAAC,KAAK,GAAG,IAAI,CAAC;wBAClB,KAAI,CAAC,OAAO,CAAC,IAAI,CAAC;4BACd,KAAK,EAAE,UAAU;yBACpB,CAAC,CAAC;wBACH,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;wBACjB,KAAI,CAAC,OAAO,GAAG,KAAK,CAAC;oBACzB,CAAC,EACD,cAAM,OAAA,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC,EAAzB,CAAyB,CAClC,CAAC;gBACN,CAAC;gBAED;;;mBAGG;gBACH,+CAAc,GAAd,UAAe,IAAS;oBACpB,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC;wBAC/B,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC;wBAC3B,IAAI,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC;wBACzH,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC;4BACX,GAAG,CAAC,CAAC,IAAI,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;gCAC/C,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC;4BAC5D,CAAC;wBACL,CAAC;oBACL,CAAC;gBACL,CAAC;gBAED;;;;mBAIG;gBACH,6CAAY,GAAZ,UAAa,KAAmB;oBAC5B,EAAE,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC;wBACnB,gBAAgB,CAAC,oBAAoB,EAAE,CAAC;oBAC5C,CAAC;oBACD,EAAE,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;wBACd,MAAM,CAAC,KAAK,CAAC;oBACjB,CAAC;oBAAC,IAAI,CAAC,CAAC;wBACJ,MAAM,CAAC,IAAI,CAAC;oBAChB,CAAC;gBACL,CAAC;gBAED;;;mBAGG;gBACH,gDAAe,GAAf,UAAgB,SAA2B;oBACvC,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;oBAC3B,IAAI,QAAQ,GAAG,SAAS,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,kCAAkC;oBACnF,QAAQ,GAAG,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,QAAQ,GAAG,IAAI,CAAC;oBAExD,IAAI,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;oBAEpC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;gBACjC,CAAC;gBApID;oBAAC,YAAK,EAAE;;sEAAA;gBACR;oBAAC,aAAM,EAAE;;yEAAA;gBACT;oBAAC,aAAM,EAAE;;uEAAA;gBAZb;oBAAC,gBAAS,CAAC;wBACP,QAAQ,EAAE,gBAAgB;wBAC1B,QAAQ,EAAE,YAAY;wBACtB,UAAU,EAAE,CAAC,0BAAiB,EAAE,wBAAe,CAAC;wBAChD,WAAW,EAAE,uBAAuB;wBACpC,SAAS,EAAE,CAAC,sBAAsB,CAAC;wBACnC,KAAK,EAAE,CAAC,6BAAa,CAAC;qBAEzB,CAAC;;0CAAA;gBAuIF,6BAAC;YAAD,CAAC,AAtID,IAsIC;YAtID,2DAsIC,CAAA"}

38
ng2-components/ng2-alfresco-login/src/components/alfresco-login.spec.js
View File

@ -99,7 +99,7 @@ System.register(['angular2/platform/testing/browser', 'angular2/testing', 'angul
testing_1.expect(element.querySelector('h2').innerText).toEqual('login'); testing_1.expect(element.querySelector('h2').innerText).toEqual('login');
testing_1.expect(element.querySelector('[for="username"]')).toBeDefined(); testing_1.expect(element.querySelector('[for="username"]')).toBeDefined();
testing_1.expect(element.querySelector('[for="username"]').innerText).toEqual('username'); testing_1.expect(element.querySelector('[for="username"]').innerText).toEqual('username');
testing_1.expect(element.querySelector('#username-required').innerText).toEqual('input-required-message'); testing_1.expect(element.querySelector('#username-error').innerText).toEqual('input-required-message');
testing_1.expect(element.querySelector('[for="password"]')).toBeDefined(); testing_1.expect(element.querySelector('[for="password"]')).toBeDefined();
testing_1.expect(element.querySelector('[for="password"]').innerText).toEqual('password'); testing_1.expect(element.querySelector('[for="password"]').innerText).toEqual('password');
testing_1.expect(element.querySelector('#password-required').innerText).toEqual('input-required-message'); testing_1.expect(element.querySelector('#password-required').innerText).toEqual('input-required-message');
@ -117,6 +117,42 @@ System.register(['angular2/platform/testing/browser', 'angular2/testing', 'angul
testing_1.expect(element.querySelector('input[type="text"]').value).toEqual(''); testing_1.expect(element.querySelector('input[type="text"]').value).toEqual('');
}); });
})); }));
testing_1.it('should render min-length error when the username is lower than 4 characters', testing_1.injectAsync([testing_1.TestComponentBuilder], function (tcb) {
return tcb
.createAsync(alfresco_login_1.AlfrescoLoginComponent)
.then(function (fixture) {
var component = fixture.componentInstance;
component.isErrorStyle = function () {
};
var compiled = fixture.debugElement.nativeElement;
component.form.controls['username']._value = 'us';
fixture.detectChanges();
component.onValueChanged();
fixture.detectChanges();
testing_1.expect(component.formError).toBeDefined(true);
testing_1.expect(component.formError['username']).toBeDefined(true);
testing_1.expect(component.formError['username']).toEqual('input-min-message');
testing_1.expect(compiled.querySelector('#username-error').innerText).toEqual('input-min-message');
});
}));
testing_1.it('should render no errors when the username and password are correct', testing_1.injectAsync([testing_1.TestComponentBuilder], function (tcb) {
return tcb
.createAsync(alfresco_login_1.AlfrescoLoginComponent)
.then(function (fixture) {
var component = fixture.componentInstance;
component.isErrorStyle = function () {
};
var compiled = fixture.debugElement.nativeElement;
component.form.controls['username']._value = 'fake-user';
component.form.controls['password']._value = 'fake-password';
fixture.detectChanges();
component.onValueChanged();
fixture.detectChanges();
testing_1.expect(component.formError).toBeDefined(true);
testing_1.expect(component.formError['username']).toEqual('');
testing_1.expect(component.formError['password']).toEqual('');
});
}));
testing_1.it('should render the new values after user and password values are changed', testing_1.injectAsync([testing_1.TestComponentBuilder], function (tcb) { testing_1.it('should render the new values after user and password values are changed', testing_1.injectAsync([testing_1.TestComponentBuilder], function (tcb) {
return tcb return tcb
.createAsync(alfresco_login_1.AlfrescoLoginComponent) .createAsync(alfresco_login_1.AlfrescoLoginComponent)

2
ng2-components/ng2-alfresco-login/src/components/alfresco-login.spec.js.map
View File

File diff suppressed because one or more lines are too long

53
ng2-components/ng2-alfresco-login/src/components/alfresco-login.spec.ts
View File

@ -101,7 +101,7 @@ describe('AlfrescoLogin', () => {
expect(element.querySelector('[for="username"]')).toBeDefined(); expect(element.querySelector('[for="username"]')).toBeDefined();
expect(element.querySelector('[for="username"]').innerText).toEqual('username'); expect(element.querySelector('[for="username"]').innerText).toEqual('username');
expect(element.querySelector('#username-required').innerText).toEqual('input-required-message'); expect(element.querySelector('#username-error').innerText).toEqual('input-required-message');
expect(element.querySelector('[for="password"]')).toBeDefined(); expect(element.querySelector('[for="password"]')).toBeDefined();
expect(element.querySelector('[for="password"]').innerText).toEqual('password'); expect(element.querySelector('[for="password"]').innerText).toEqual('password');
@ -123,6 +123,57 @@ describe('AlfrescoLogin', () => {
}); });
})); }));
it('should render min-length error when the username is lower than 4 characters', injectAsync([TestComponentBuilder], (tcb:TestComponentBuilder) => {
return tcb
.createAsync(AlfrescoLoginComponent)
.then((fixture) => {
let component = fixture.componentInstance;
component.isErrorStyle = function () {
};
let compiled = fixture.debugElement.nativeElement;
component.form.controls['username']._value = 'us';
fixture.detectChanges();
component.onValueChanged();
fixture.detectChanges();
expect(component.formError).toBeDefined(true);
expect(component.formError['username']).toBeDefined(true);
expect(component.formError['username']).toEqual('input-min-message');
expect(compiled.querySelector('#username-error').innerText).toEqual('input-min-message');
});
}));
it('should render no errors when the username and password are correct', injectAsync([TestComponentBuilder], (tcb:TestComponentBuilder) => {
return tcb
.createAsync(AlfrescoLoginComponent)
.then((fixture) => {
let component = fixture.componentInstance;
component.isErrorStyle = function () {
};
let compiled = fixture.debugElement.nativeElement;
component.form.controls['username']._value = 'fake-user';
component.form.controls['password']._value = 'fake-password';
fixture.detectChanges();
component.onValueChanged();
fixture.detectChanges();
expect(component.formError).toBeDefined(true);
expect(component.formError['username']).toEqual('');
expect(component.formError['password']).toEqual('');
});
}));
it('should render the new values after user and password values are changed', injectAsync([TestComponentBuilder], (tcb:TestComponentBuilder) => { it('should render the new values after user and password values are changed', injectAsync([TestComponentBuilder], (tcb:TestComponentBuilder) => {
return tcb return tcb

72
ng2-components/ng2-alfresco-login/src/components/alfresco-login.ts
View File

@ -20,7 +20,7 @@ import {FORM_DIRECTIVES, ControlGroup, FormBuilder, Validators} from 'angular2/c
import {AlfrescoAuthenticationService} from '../services/alfresco-authentication'; import {AlfrescoAuthenticationService} from '../services/alfresco-authentication';
import {TranslateService, TranslatePipe} from 'ng2-translate/ng2-translate'; import {TranslateService, TranslatePipe} from 'ng2-translate/ng2-translate';
declare let componentHandler; declare let componentHandler;
declare let __moduleName:string; declare let __moduleName: string;
@Component({ @Component({
selector: 'alfresco-login', selector: 'alfresco-login',
@ -32,32 +32,56 @@ declare let __moduleName:string;
}) })
export class AlfrescoLoginComponent { export class AlfrescoLoginComponent {
@Input() method:string = 'POST'; @Input() method: string = 'POST';
@Output() onSuccess = new EventEmitter(); @Output() onSuccess = new EventEmitter();
@Output() onError = new EventEmitter(); @Output() onError = new EventEmitter();
translate: TranslateService; translate: TranslateService;
form:ControlGroup; form: ControlGroup;
error:boolean = false; error: boolean = false;
success:boolean = false; success: boolean = false;
formError: { [id: string]: string };
private _message: { [id:string]:
{ [id: string]: string }
};
/** /**
* Constructor * Constructor
* @param fb * @param _fb
* @param auth * @param auth
* @param router * @param router
*/ */
constructor(fb:FormBuilder, constructor(private _fb: FormBuilder,
public auth:AlfrescoAuthenticationService, public auth: AlfrescoAuthenticationService,
public router:Router, public router: Router,
translate:TranslateService translate: TranslateService) {
) {
this.form = fb.group({ this.formError = {
'username': '',
'password': ''
};
this.form = this._fb.group({
username: ['', Validators.compose([Validators.required, Validators.minLength(4)])], username: ['', Validators.compose([Validators.required, Validators.minLength(4)])],
password: ['', Validators.required] password: ['', Validators.required]
}); });
this._message = {
'username': {
'required': 'input-required-message',
'minlength': 'input-min-message'
},
'password': {
'required': 'input-required-message'
}
};
this.translationInit(translate); this.translationInit(translate);
this.form.valueChanges.subscribe(data => this.onValueChanged(data));
this.onValueChanged();
} }
/** /**
@ -65,14 +89,14 @@ export class AlfrescoLoginComponent {
* @param value * @param value
* @param event * @param event
*/ */
onSubmit(value:any, event) { onSubmit(value: any, event) {
this.error = false; this.error = false;
if (event) { if (event) {
event.preventDefault(); event.preventDefault();
} }
this.auth.login(this.method, value.username, value.password) this.auth.login(this.method, value.username, value.password)
.subscribe( .subscribe(
(token:any) => { (token: any) => {
try { try {
this.success = true; this.success = true;
this.onSuccess.emit({ this.onSuccess.emit({
@ -84,7 +108,7 @@ export class AlfrescoLoginComponent {
} }
}, },
(err:any) => { (err: any) => {
this.error = true; this.error = true;
this.onError.emit({ this.onError.emit({
value: 'Login KO' value: 'Login KO'
@ -96,12 +120,28 @@ export class AlfrescoLoginComponent {
); );
} }
/**
* The method check the error in the form and push the error in the formError object
* @param data
*/
onValueChanged(data: any) {
for (let field in this.formError) {
this.formError[field] = '';
let hasError = this.form.controls[field].errors || (this.form.controls[field].dirty && !this.form.controls[field].valid);
if (hasError) {
for (let key in this.form.controls[field].errors) {
this.formError[field] += this._message[field][key] + '';
}
}
}
}
/** /**
* The method return if a field is valid or not * The method return if a field is valid or not
* @param field * @param field
* @returns {boolean} * @returns {boolean}
*/ */
isErrorStyle(field:ControlGroup) { isErrorStyle(field: ControlGroup) {
if (componentHandler) { if (componentHandler) {
componentHandler.upgradeAllRegistered(); componentHandler.upgradeAllRegistered();
} }

8
ng2-components/ng2-alfresco-login/tsconfig.json
View File

@ -13,10 +13,10 @@
"files":[ "files":[
"node_modules/angular2/typings/browser.d.ts", "node_modules/angular2/typings/browser.d.ts",
"typings/browser/ambient/jasmine/index.d.ts", "typings/browser/ambient/jasmine/index.d.ts",
"src/alfresco-login.component.ts", "src/components/alfresco-login.ts",
"src/alfresco-login.component.spec.ts", "src/components/alfresco-login.spec.ts",
"src/alfresco-authentication.service.ts", "src/services/alfresco-authentication.ts",
"src/alfresco-authentication.service.spec.ts" "src/services/alfresco-authentication.spec.ts"
], ],
"exclude": [ "exclude": [
"**/node_modules", "**/node_modules",