Merge pull request #209 from Alfresco/dev-mvitale-loginroute

Fix test login component #208

demo-shell-ng2/app/components/login/login-demo.component.html

@@ -1 +1 @@
-<alfresco-login></alfresco-login>
+<alfresco-login (onSuccess)="onLogin($event)" (onError)="onError($event)"></alfresco-login>

demo-shell-ng2/app/components/login/login-demo.component.ts

@@ -17,6 +17,7 @@
 
 import { Component } from '@angular/core';
 import { AlfrescoLoginComponent } from 'ng2-alfresco-login';
+import { Router, ROUTER_DIRECTIVES } from '@angular/router-deprecated';
 
 declare let __moduleName: string;
 
@@ -24,9 +25,21 @@ declare let __moduleName: string;
     moduleId: __moduleName,
     selector: 'login-demo',
     templateUrl: './login-demo.component.html',
-    directives: [AlfrescoLoginComponent],
+    directives: [ROUTER_DIRECTIVES, AlfrescoLoginComponent],
     pipes: []
 })
 export class LoginDemoComponent {
 
+    constructor(public router: Router) {
+    }
+
+    onLogin($event) {
+        console.log($event);
+        this.router.navigate(['Home']);
+    }
+
+    onError($event) {
+        console.log($event);
+    }
+
 }

ng2-components/ng2-alfresco-login/README.md

@@ -92,31 +92,26 @@ Example of an App that use Alfresco login component :
 main.ts
 ```ts
 
-import { bootstrap }    from 'angular2/platform/browser';
+import { Component } from '@angular/core';
-import { Component } from 'angular2/core';
+import { bootstrap } from '@angular/platform-browser-dynamic';
-import { Router, RouteConfig, ROUTER_DIRECTIVES } from 'angular2/router';
+import { AlfrescoLoginComponent } from 'ng2-alfresco-login';
-import { AlfrescoSettingsService, AlfrescoAuthenticationService } from 'ng2-alfresco-core/dist/ng2-alfresco-core';
+import { HTTP_PROVIDERS } from '@angular/http';
-import { AlfrescoLoginComponent } from 'ng2-alfresco-login/dist/ng2-alfresco-login';
+import {
-import { ROUTER_PROVIDERS } from 'angular2/router';
+    ALFRESCO_CORE_PROVIDERS,
-import { HTTP_PROVIDERS }    from 'angular2/http';
+    AlfrescoSettingsService,
-import { ALFRESCO_CORE_PROVIDERS, AlfrescoTranslationService, AlfrescoTranslationLoader } from 'ng2-alfresco-core/dist/ng2-alfresco-core';
+    AlfrescoAuthenticationService
+} from 'ng2-alfresco-core';
 
-
-@RouteConfig([
-    {path: '/', name: 'Login', component: AlfrescoLoginComponent, useAsDefault: true}
-])
 @Component({
     selector: 'my-app',
-    template: '<alfresco-login method="POST" (onSuccess)="mySuccessMethod($event)" (onError)="myErrorMethod($event)"></alfresco-login>',
+    template: '<alfresco-login (onSuccess)="mySuccessMethod($event)" (onError)="myErrorMethod($event)"></alfresco-login>',
-    directives: [ROUTER_DIRECTIVES, AlfrescoLoginComponent]
+    directives: [AlfrescoLoginComponent]
 })
 export class AppComponent {
 
     constructor(public auth: AlfrescoAuthenticationService,
-                public router: Router,
                 alfrescoSettingsService: AlfrescoSettingsService) {
         alfrescoSettingsService.host = 'http://192.168.99.100:8080';
-
     }
 
     mySuccessMethod($event) {
@@ -130,11 +125,7 @@ export class AppComponent {
 }
 
 bootstrap(AppComponent, [
-    ROUTER_PROVIDERS,
     HTTP_PROVIDERS,
-    AlfrescoTranslationLoader,
-    AlfrescoTranslationService,
-    AlfrescoAuthenticationService,
     ALFRESCO_CORE_PROVIDERS
 ]);
 

ng2-components/ng2-alfresco-login/demo/src/main.ts

@@ -17,12 +17,6 @@
 
 import { Component } from '@angular/core';
 import { bootstrap } from '@angular/platform-browser-dynamic';
-import {
-    Router,
-    RouteConfig,
-    ROUTER_PROVIDERS,
-    ROUTER_DIRECTIVES
-} from '@angular/router-deprecated';
 import { AlfrescoLoginComponent } from 'ng2-alfresco-login';
 import { HTTP_PROVIDERS } from '@angular/http';
 import {
@@ -32,17 +26,14 @@ import {
 } from 'ng2-alfresco-core';
 
 
-@RouteConfig([
-    {path: '/', name: 'Login', component: AlfrescoLoginComponent, useAsDefault: true}
-])
 @Component({
     selector: 'my-app',
     template: `<label for="token"><b>Insert the ip of your Alfresco instance:</b></label><br>
                <input id="token" type="text" size="48" (change)="updateHost()" [(ngModel)]="host"><br><br>
                {{ status }}
                <hr>
-               <alfresco-login method="POST" (onSuccess)="mySuccessMethod($event)" (onError)="myErrorMethod($event)"></alfresco-login>`,
+               <alfresco-login (onSuccess)="mySuccessMethod($event)" (onError)="myErrorMethod($event)"></alfresco-login>`,
-    directives: [ROUTER_DIRECTIVES, AlfrescoLoginComponent]
+    directives: [AlfrescoLoginComponent]
 })
 export class AppComponent {
 
@@ -53,7 +44,6 @@ export class AppComponent {
     public status: string = '';
 
     constructor(public auth: AlfrescoAuthenticationService,
-                public router: Router,
                 private alfrescoSettingsService: AlfrescoSettingsService) {
         alfrescoSettingsService.host = this.host;
     }
@@ -74,7 +64,6 @@ export class AppComponent {
 }
 
 bootstrap(AppComponent, [
-    ROUTER_PROVIDERS,
     HTTP_PROVIDERS,
     ALFRESCO_CORE_PROVIDERS
 ]);

ng2-components/ng2-alfresco-login/karma.conf.js

@@ -4,7 +4,7 @@ module.exports = function (config) {
   var configuration = {
     basePath: '.',
 
-    frameworks: ['jasmine-ajax', 'jasmine'],
+    frameworks: ['jasmine'],
 
     files: [
       // paths loaded by Karma
@@ -63,7 +63,6 @@ module.exports = function (config) {
     plugins: [
       'karma-jasmine',
       'karma-coverage',
-      'karma-jasmine-ajax',
       'karma-chrome-launcher',
       'karma-mocha-reporter',
       'karma-jasmine-html-reporter'

ng2-components/ng2-alfresco-login/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ng2-alfresco-login",
   "description": "Alfresco Angular2 Login Component",
-  "version": "0.1.18",
+  "version": "0.1.19",
   "author": "Alfresco Software, Ltd.",
   "scripts": {
     "clean": "rm -rf dist node_modules typings",

ng2-components/ng2-alfresco-login/src/components/alfresco-login.component.spec.ts

@@ -15,59 +15,42 @@
  * limitations under the License.
  */
 
-describe('AlfrescoLogin', () => {
-    it('should be upgraded to angular 2.0.0-rc.1', () => {
-        expect(false).toBe(true);
-    });
-});
 
-/*
+import {
-import { TEST_BROWSER_PLATFORM_PROVIDERS, TEST_BROWSER_APPLICATION_PROVIDERS } from 'angular2/platform/testing/browser';
+    TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
+    TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS
+} from '@angular/platform-browser-dynamic/testing';
 import {
   it,
   describe,
   expect,
   inject,
-  injectAsync,
-  beforeEach,
   beforeEachProviders,
-  TestComponentBuilder,
   setBaseTestProviders
 } from '@angular/core/testing';
+import { TestComponentBuilder } from '@angular/compiler/testing';
 import { provide } from '@angular/core';
-import { Location, Router, RouteRegistry, ROUTER_PRIMARY_COMPONENT, Route } from 'angular2/router';
+import { AlfrescoTranslationService } from 'ng2-alfresco-core';
-import { RootRouter } from 'angular2/src/router/router';
-import { SpyLocation } from 'angular2/src/mock/location_mock';
-import { AlfrescoTranslationService } from 'ng2-alfresco-core/dist/ng2-alfresco-core';
 import { AlfrescoLoginComponent } from './alfresco-login.component';
 import { AuthenticationMock } from './../assets/authentication.service.mock';
 import { TranslationMock } from './../assets/translation.service.mock';
 
 describe('AlfrescoLogin', () => {
-  let authService, location, router;
+  let authService;
 
-  setBaseTestProviders(TEST_BROWSER_PLATFORM_PROVIDERS, TEST_BROWSER_APPLICATION_PROVIDERS);
+  setBaseTestProviders(TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS, TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS);
 
   beforeEachProviders(() => {
     authService = new AuthenticationMock();
 
     return [
       authService.getProviders(),
-      RouteRegistry,
-      provide(Location, {useClass: SpyLocation}),
-      provide(ROUTER_PRIMARY_COMPONENT, {useValue: AlfrescoLoginComponent}),
-      provide(Router, {useClass: RootRouter}),
       provide(AlfrescoTranslationService, {useClass: TranslationMock})
     ];
   });
 
-  beforeEach(inject([Router, Location], (r, l) => {
-    router = r;
-    location = l;
-  }));
-
   it('should render `Login` form with all the keys to be translated',
-    injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
       return tcb
         .createAsync(AlfrescoLoginComponent)
         .then((fixture) => {
@@ -92,7 +75,7 @@ describe('AlfrescoLogin', () => {
     }));
 
   it('should render user and password input fields with default values',
-    injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
       return tcb
         .createAsync(AlfrescoLoginComponent)
         .then((fixture) => {
@@ -106,7 +89,7 @@ describe('AlfrescoLogin', () => {
     }));
 
   it('should render min-length error when the username is lower than 4 characters',
-    injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
       return tcb
         .createAsync(AlfrescoLoginComponent)
         .then((fixture) => {
@@ -133,7 +116,7 @@ describe('AlfrescoLogin', () => {
     }));
 
   it('should render no errors when the username and password are correct',
-    injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
       return tcb
         .createAsync(AlfrescoLoginComponent)
         .then((fixture) => {
@@ -161,7 +144,7 @@ describe('AlfrescoLogin', () => {
     }));
 
   it('should render the new values after user and password values are changed',
-    injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
       return tcb
         .createAsync(AlfrescoLoginComponent)
         .then((fixture) => {
@@ -182,13 +165,11 @@ describe('AlfrescoLogin', () => {
         });
     }));
 
-  it('should navigate to Home route after the login have succeeded ',
+  it('should return success true after the login have succeeded ',
-    injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
       return tcb
         .createAsync(AlfrescoLoginComponent)
         .then((fixture) => {
-          router.config([new Route({path: '/home', name: 'Home', component: AlfrescoLoginComponent})]);
-          spyOn(router, 'navigate').and.callThrough();
           let component = fixture.componentInstance;
           component.isErrorStyle = function () {
             console.log('mock');
@@ -207,16 +188,15 @@ describe('AlfrescoLogin', () => {
           fixture.detectChanges();
 
           expect(component.error).toBe(false);
-          expect(router.navigate).toHaveBeenCalledWith(['Home']);
+          expect(component.success).toBe(true);
         });
     }));
 
   it('should return error with a wrong username ',
-    injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
       return tcb
         .createAsync(AlfrescoLoginComponent)
         .then((fixture) => {
-          spyOn(router, 'navigate').and.callThrough();
           let component = fixture.componentInstance;
           component.isErrorStyle = function () {
             console.log('mock');
@@ -240,11 +220,10 @@ describe('AlfrescoLogin', () => {
     }));
 
   it('should return error with a wrong password ',
-    injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
       return tcb
         .createAsync(AlfrescoLoginComponent)
         .then((fixture) => {
-          spyOn(router, 'navigate').and.callThrough();
           let component = fixture.componentInstance;
           component.isErrorStyle = function () {
             console.log('mock');
@@ -268,11 +247,10 @@ describe('AlfrescoLogin', () => {
     }));
 
   it('should return error with a wrong username and password ',
-    injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
       return tcb
         .createAsync(AlfrescoLoginComponent)
         .then((fixture) => {
-          spyOn(router, 'navigate').and.callThrough();
           let component = fixture.componentInstance;
           component.isErrorStyle = function () {
             console.log('mock');
@@ -297,7 +275,7 @@ describe('AlfrescoLogin', () => {
 
 
   it('should emit onSuccess event after the login has succeeded',
-    injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
       return tcb
         .createAsync(AlfrescoLoginComponent)
         .then((fixture) => {
@@ -329,7 +307,7 @@ describe('AlfrescoLogin', () => {
     }));
 
   it('should emit onError event after the login has failed',
-    injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+    inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
       return tcb
         .createAsync(AlfrescoLoginComponent)
         .then((fixture) => {
@@ -362,7 +340,7 @@ describe('AlfrescoLogin', () => {
     }));
 
   it('should render the password in clear when the toggleShowPassword is call',
-      injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+      inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
         return tcb
             .createAsync(AlfrescoLoginComponent)
             .then((fixture) => {
@@ -383,7 +361,7 @@ describe('AlfrescoLogin', () => {
       }));
 
   it('should render the hide password when the password is in clear and the toggleShowPassword is call',
-      injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => {
+      inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
         return tcb
             .createAsync(AlfrescoLoginComponent)
             .then((fixture) => {
@@ -403,7 +381,5 @@ describe('AlfrescoLogin', () => {
             });
       }));
 
-
-
 });
-*/
+

ng2-components/ng2-alfresco-login/src/components/alfresco-login.component.ts

@@ -16,7 +16,6 @@
  */
 
 import { Component, Output, EventEmitter } from '@angular/core';
-import { Router, ROUTER_DIRECTIVES } from '@angular/router-deprecated';
 import { FORM_DIRECTIVES, ControlGroup, FormBuilder, Validators } from '@angular/common';
 import {
     AlfrescoTranslationService,
@@ -30,7 +29,7 @@ declare let __moduleName: string;
 @Component({
     selector: 'alfresco-login',
     moduleId: __moduleName,
-    directives: [ROUTER_DIRECTIVES, FORM_DIRECTIVES],
+    directives: [FORM_DIRECTIVES],
     templateUrl: './alfresco-login.component.html',
     styleUrls: ['./alfresco-login.component.css'],
     pipes: [AlfrescoPipeTranslate]
@@ -60,12 +59,10 @@ export class AlfrescoLoginComponent {
      * Constructor
      * @param _fb
      * @param auth
-     * @param router
      * @param translate
      */
     constructor(private _fb: FormBuilder,
                 public auth: AlfrescoAuthenticationService,
-                public router: Router,
                 private translate: AlfrescoTranslationService) {
 
         this.formError = {
@@ -108,16 +105,10 @@ export class AlfrescoLoginComponent {
         this.auth.login(value.username, value.password)
             .subscribe(
                 (token: any) => {
-                    try {
+                    this.success = true;
-                        this.success = true;
+                    this.onSuccess.emit({
-                        this.onSuccess.emit({
+                        value: 'Login OK'
-                            value: 'Login OK'
+                    });
-                        });
-                        this.router.navigate(['Home']);
-                    } catch (error) {
-                        console.error(error.message);
-                    }
-
                 },
                 (err: any) => {
                     this.error = true;