added coverage task

ABNER SILVA DE OLIVEIRA
2 parents 6f744e76 f18ccc08
Showing 34 changed files with 526 additions and 187 deletions Show diff stats
.vscode/tasks.json
gulp/server.js
karma.conf.js
package.json
src/app/components/auth/index.ts
src/app/components/navbar/index.ts
src/app/components/navbar/navbar.directive.js
src/app/components/navbar/navbar.html
src/app/components/navbar/navbar.spec.ts
src/app/components/navbar/navbar.ts
src/app/components/noosfero-blocks/block.component.ts
src/app/components/noosfero-blocks/link-list/index.ts
src/app/components/noosfero-blocks/link-list/link-list.component.spec.ts
src/app/components/noosfero-blocks/link-list/link-list.component.ts
src/app/components/noosfero-blocks/main-block/main-block.component.js
src/app/components/noosfero-blocks/main-block/main-block.component.spec.ts
src/app/components/noosfero-blocks/main-block/main-block.component.ts
src/app/components/noosfero-blocks/members-block/members-block.component.js
src/app/components/noosfero-blocks/members-block/members-block.component.spec.ts
src/app/components/noosfero-blocks/members-block/members-block.component.ts
@@ -23,6 +23,10 @@
         {
             "taskName": "test",
             "isTestCommand": true
+        },
+        {
+            "taskName": "generate-indexes",
+            "args": []
         }
     ]
 }
 \ No newline at end of file
@@ -36,6 +36,7 @@ function browserSyncInit(baseDir, browser) {
   browserSync.instance = browserSync.init({
     startPath: '/',
     server: server,
+    port: 3001,
     browser: browser
   });
 }
@@ -112,7 +112,6 @@ module.exports = function (config) {
         browsers: ['PhantomJS'],
-
         plugins: karmaPlugins,
@@ -124,6 +123,7 @@ module.exports = function (config) {
         }
     };
+
     if (argv.coverage) {
         /*configuration.webpack = {
@@ -177,9 +177,6 @@ module.exports = function (config) {
         };
     }
-    //     'src/**/*.js': ['sourcemap'],
-    //     'src/**/*.[sS]pec.ts': ['sourcemap']
-    // };
     pathSrcHtml.forEach(function (path) {
         configuration.preprocessors[path] = ['ng-html2js'];
@@ -11,7 +11,7 @@
     "remap-coverage": "ts-node --project ./dev-scripts ./dev-scripts/remapCoverage.ts",
     "test-single": "webpack && karma start --single-run",
     "test": "concurrently \"webpack -w\" \"karma start\"",
-    "postinstall": "npm install -g bower && bower install",
+    "postinstall": "npm install -g bower && bower install && typings install",
     "start": "concurrently \"webpack -w\" \"gulp serve\"",
     "generate-indexes": "ts-node --project ./dev-scripts ./dev-scripts/generate-index-modules.ts"
   },
-/* Module Index Entry - generated using the script npm run generate-indexes */
+/* Module Index Entry - generated using the script npm run generate-index */
 export * from "./auth_controller";
 export * from "./auth_events";
 export * from "./auth_service";
 /* Module Index Entry - generated using the script npm run generate-index */
+export * from "./navbar";
@@ -1,58 +0,0 @@
-(function() {
-  'use strict';
-
-  angular
-    .module('noosferoApp')
-    .directive('acmeNavbar', acmeNavbar);
-
-  /** @ngInject */
-  function acmeNavbar() {
-    var directive = {
-      restrict: 'E',
-      templateUrl: 'app/components/navbar/navbar.html',
-      scope: {},
-      controller: NavbarController,
-      controllerAs: 'vm',
-      bindToController: true
-    };
-
-    return directive;
-
-    /** @ngInject */
-    function NavbarController(moment, $modal, AuthService, Session, $scope, $state, AUTH_EVENTS) {
-      var vm = this;
-
-      vm.currentUser = Session.getCurrentUser();
-      vm.modalInstance = null;
-
-      vm.openLogin = function() {
-        vm.modalInstance = $modal.open({
-          templateUrl: 'app/components/auth/login.html',
-          controller: 'AuthController',
-          controllerAs: 'vm',
-          bindToController: true
-        });
-      };
-      vm.logout = function() {
-        AuthService.logout();
-        $state.go($state.current, {}, {reload: true});  //TODO move to auth
-      };
-      $scope.$on(AUTH_EVENTS.loginSuccess, function() {
-        if(vm.modalInstance) {
-          vm.modalInstance.close();
-          vm.modalInstance = null;
-        }
-        $state.go($state.current, {}, {reload: true}); //TODO move to auth
-      });
-      $scope.$on(AUTH_EVENTS.logoutSuccess, function() {
-        vm.currentUser = Session.getCurrentUser();
-      });
-
-      vm.activate = function() {
-        if(!vm.currentUser) vm.openLogin();
-      }
-      vm.activate();
-    }
-  }
-
-})();
@@ -17,25 +17,25 @@
       </ul>
       <ul class="nav navbar-nav navbar-right">
-        <li ng-show="!vm.currentUser">
-          <a ng-href="#" ng-click="vm.openLogin()">Login</a>
+        <li ng-show="!ctrl.currentUser">
+          <a ng-href="#" ng-click="ctrl.openLogin()">Login</a>
         </li>
-        <li class="dropdown profile-menu" ng-show="vm.currentUser" dropdown>
+        <li class="dropdown profile-menu" ng-show="ctrl.currentUser" dropdown>
           <a href="#" class="dropdown-toggle" aria-expanded="false" dropdown-toggle>
-            <noosfero-profile-image profile="vm.currentUser.person" class="profile-image"></noosfero-profile-image>
-            <span ng-bind="vm.currentUser.person.name"></span> <b class="caret"></b>
+            <noosfero-profile-image profile="ctrl.currentUser.person" class="profile-image"></noosfero-profile-image>
+            <span ng-bind="ctrl.currentUser.person.name"></span> <b class="caret"></b>
           </a>
           <ul class="dropdown-menu" dropdown-menu>
               <li>
-                  <a ui-sref="main.profile.info({profile: vm.currentUser.person.identifier})"><i class="fa fa-fw fa-user"></i> Profile</a>
+                  <a ui-sref="main.profile.info({profile: ctrl.currentUser.person.identifier})"><i class="fa fa-fw fa-user"></i> Profile</a>
               </li>
               <li>
-                  <a target="_self" ui-sref="main.profile.settings({profile: vm.currentUser.person.identifier})"><i class="fa fa-fw fa-gear"></i> Settings</a>
+                  <a target="_self" ui-sref="main.profile.settings({profile: ctrl.currentUser.person.identifier})"><i class="fa fa-fw fa-gear"></i> Settings</a>
               </li>
               <li class="divider"></li>
               <li>
-                  <a href="#" ng-click="vm.logout()"><i class="fa fa-fw fa-power-off"></i> Log Out</a>
+                  <a href="#" ng-click="ctrl.logout()"><i class="fa fa-fw fa-power-off"></i> Log Out</a>
               </li>
           </ul>
         </li>
@@ -0,0 +1,56 @@
+import {createComponentFromClass, quickCreateComponent} from "./../../../spec/helpers";
+import {Navbar} from "./";
+import {AUTH_EVENTS} from "./../auth";
+import {User} from "./../../models/interfaces";
+import {Injectable, Provider, provide} from "ng-forward";
+
+
+
+describe("Navbar Component", () => {
+
+    let $rootScope: ng.IRootScopeService;
+    let user = <User>{
+        id: 1,
+        login: "user"
+    };
+    
+    beforeEach(angular.mock.module("templates"));
+    
+    // beforeEach(inject((_$rootScope_: ng.IRootScopeService) => {
+    //     $rootScope = _$rootScope_;
+    // }));
+
+    it('should get the loggedIn user', (done: Function) => {
+      
+        
+        let scope = jasmine.createSpyObj("scope", ["$on"]);
+        
+        let providers = [
+            
+            
+            new Provider('moment', { useValue: {} }),
+            new Provider('$modal', { useValue: {} }),
+            new Provider('AuthService', { useValue: {} }),
+            new Provider('Session', { useValue: {
+                getCurrentUser: () => { return user}
+            } }),
+            new Provider('$scope', { useValue: scope }),
+            new Provider('$state', { useValue: {} }),
+            new Provider('AUTH_EVENTS', { useValue: {AUTH_EVENTS} })
+        ];
+        
+        
+        
+        quickCreateComponent({
+            providers: providers,
+            template: "<acme-navbar></acme-navbar>",
+            directives: [Navbar]
+        }).then(fixture => {
+            let navbarInstance: Navbar = fixture.debugElement.componentViewChildren[0].componentInstance;
+            expect(navbarInstance).toBeDefined();
+            expect(navbarInstance["currentUser"]).toEqual(user)
+            done();
+        })
+    });
+
+});
 \ No newline at end of file
@@ -0,0 +1,68 @@
+import {Component, Inject} from "ng-forward";
+
+
+import {Session, AuthService, IAuthEvents} from "./../auth";
+import {User} from "./../../models/interfaces";
+
+@Component({
+    selector: "acme-navbar",
+    templateUrl: "app/components/navbar/navbar.html"
+})
+@Inject("moment", "$modal", "AuthService", "Session", "$scope", "$state", "AUTH_EVENTS")
+export class Navbar {
+
+    private currentUser: User;
+    private modalInstance: any = null;
+    /**
+     *
+     */
+    constructor(
+        private moment: moment.MomentStatic,
+        private $modal: any,
+        private authService: AuthService,
+        private session: Session,
+        private $scope: ng.IScope,
+        private $state: ng.ui.IStateService,
+        private AUTH_EVENTS: IAuthEvents
+    ) {
+
+        this.currentUser = session.getCurrentUser();
+
+        $scope.$on(AUTH_EVENTS.loginSuccess, function() {
+            if (this.modalInstance) {
+                this.modalInstance.close();
+                this.modalInstance = null;
+            }
+
+            this.$state.go(this.$state.current, {}, { reload: true }); //TODO move to auth
+        });
+
+        $scope.$on(AUTH_EVENTS.logoutSuccess, () => {
+            this.currentUser = this.session.getCurrentUser();
+        });
+
+    }
+
+    openLogin() {
+        this.modalInstance = this.$modal.open({
+            templateUrl: 'app/components/auth/login.html',
+            controller: 'AuthController',
+            controllerAs: 'vm',
+            bindToController: true
+        });
+    };
+
+    logout() {
+        this.authService.logout();
+        this.$state.go(this.$state.current, {}, { reload: true });  //TODO move to auth
+    };
+
+
+
+    activate() {
+        if (!this.currentUser) {
+            this.openLogin();
+        }
+    }
+
+}
 \ No newline at end of file
@@ -11,7 +11,7 @@ export class Block {
     @Input() owner: any;
     ngOnInit() {
-        let blockName = this.block.type ? this.block.type.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase() : "default-block";
+        let blockName = (this.block && this.block.type) ? this.block.type.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase() : "default-block";
         this.$element.replaceWith(this.$compile('<noosfero-' + blockName + ' [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-' + blockName + '>')(this.$scope));
     }
 /* Module Index Entry - generated using the script npm run generate-index */
+export * from "./link-list.component";
@@ -0,0 +1,64 @@
+import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
+import {Pipe, Input, provide, Component} from 'ng-forward';
+
+import {LinkListBlock} from './link-list.component';
+
+const tcb = new TestComponentBuilder();
+
+const htmlTemplate: string = '<noosfero-link-list-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-link-list-block>';
+
+
+describe("Link List Block Component", () => {
+
+    beforeEach(angular.mock.module("templates"));
+
+    it("receives the block and the owner as inputs", done => {
+
+        // Creating a container component (BlockContainerComponent) to include
+        // the component under test (Block)
+        @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [LinkListBlock] })
+        class BlockContainerComponent {
+            block = { type: 'Block' };
+            owner = { name: 'profile-name' };
+            constructor() {
+            }
+        }
+
+        // uses the TestComponentBuilder instance to initialize the component
+        //.overrideView(LinkListBlock, { template: 'asdasdasd', pipes: [NoosferoTemplate] })
+        tcb.createAsync(BlockContainerComponent).then(fixture => {
+            // and here we can inspect and run the test assertions
+            let myComponent: LinkListBlock = fixture.componentInstance;
+
+            // assure the block object inside the Block matches
+            // the provided through the parent component
+            expect(myComponent.block.type).toEqual("Block");
+            expect(myComponent.owner.name).toEqual("profile-name");
+            done();
+        });
+    });
+
+
+    it("display links stored in block settings", done => {
+
+        @Pipe('noosferoTemplateFilter')
+        class NoosferoTemplateFilter {
+            transform(input: any, changeTo: any) {
+                return input;
+            }
+        }
+
+        @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [LinkListBlock] })
+        class CustomBlockType {
+            block: any = { settings: { links: [{ name: 'link1', address: 'address1' }, { name: 'link2', address: 'address2' }] } };
+            owner: any = { name: 'profile-name' };
+            constructor() {
+            }
+        }
+        tcb.overrideView(LinkListBlock, { templateUrl: "app/components/noosfero-blocks/link-list/link-list.html", pipes: [NoosferoTemplateFilter] }).createAsync(CustomBlockType).then(fixture => {
+            expect(fixture.debugElement.queryAll(".link-list-block a").length).toEqual(2);
+            done();
+        });
+    });
+
+});
@@ -12,7 +12,9 @@ export class LinkListBlock {
     links: any;
     ngOnInit() {
-        this.links = this.block.settings.links;
+        if (this.block && this.block.settings) {
+            this.links = this.block.settings.links;
+        }
     }
 }
@@ -1,20 +0,0 @@
-(function() {
-  'use strict';
-
-  angular
-    .module('noosferoApp')
-    .component('noosferoMainBlock', {
-      restrict: 'E',
-      templateUrl: 'app/components/noosfero-blocks/main-block/main-block.html',
-      bindings: {
-          block: '<',
-          owner: '<'
-      },
-      controller: MainBlockController
-    });
-
-  /** @ngInject */
-  function MainBlockController() {
-  }
-
-})();
@@ -0,0 +1,40 @@
+import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
+import {Input, provide, Component, StateConfig} from 'ng-forward';
+
+import {MainBlock} from './main-block.component';
+import {NoosferoApp} from '../../../index.module';
+
+const tcb = new TestComponentBuilder();
+
+const htmlTemplate: string = '<noosfero-main-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-main-block>';
+
+
+describe("Main Block Component", () => {
+
+    // the karma preprocessor html2js transform the templates html into js files which put
+    // the templates to the templateCache into the module templates
+    // we need to load the module templates here as the template for the
+    // component Block will be load on our tests
+    beforeEach(angular.mock.module("templates"));
+
+    it("check if the main block has a tag with ui-view attribute", done => {
+
+        // Creating a container component (BlockContainerComponent) to include
+        // the component under test (Block)
+        @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [MainBlock] })
+        class BlockContainerComponent {
+        }
+
+        // uses the TestComponentBuilder instance to initialize the component
+        tcb.createAsync(BlockContainerComponent).then(fixture => {
+            // and here we can inspect and run the test assertions
+            //let myComponent: MainBlock = fixture.componentInstance;
+
+            // assure the block object inside the Block matches
+            // the provided through the parent component
+            expect(fixture.debugElement.queryAll('[ui-view="mainBlockContent"]').length).toEqual(1)
+            done();
+        });
+    });
+
+});
@@ -0,0 +1,10 @@
+import {Component, Input} from 'ng-forward'
+import {Block} from '../block.component';
+
+@Component({
+    selector: 'noosfero-main-block',
+    templateUrl: 'app/components/noosfero-blocks/main-block/main-block.html'
+})
+export class MainBlock {
+
+}
@@ -1,26 +0,0 @@
-(function() {
-  'use strict';
-
-  angular
-    .module('noosferoApp')
-    .component('noosferoMembersBlock', {
-      restrict: 'E',
-      templateUrl: 'app/components/noosfero-blocks/members-block/members-block.html',
-      bindings: {
-          block: '<',
-          owner: '<'
-      },
-      controller: MembersBlockController
-    });
-
-  /** @ngInject */
-  function MembersBlockController(noosfero) {
-    var vm = this;
-    vm.members = [];
-
-    noosfero.members(noosfero.profiles.one(vm.owner.id)).one().get({per_page: 6}).then(function(response) {
-      vm.members = response.data.people;
-    });
-  }
-
-})();
@@ -0,0 +1,52 @@
+import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
+import {Provider, Input, provide, Component} from 'ng-forward';
+
+import {MembersBlock} from './members-block.component';
+
+const htmlTemplate: string = '<noosfero-members-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-members-block>';
+
+const tcb = new TestComponentBuilder();
+
+describe("Members Block Component", () => {
+
+    beforeEach(angular.mock.module("templates"));
+
+    let state = jasmine.createSpyObj("state", ["go"]);
+    let providers = [
+        new Provider('truncateFilter', { useValue: () => { } }),
+        new Provider('stripTagsFilter', { useValue: () => { } }),
+        new Provider('$state', { useValue: state }),
+        new Provider('ProfileService', {
+            useValue: {
+                getProfileMembers: (profileId: number, filters: any): any => {
+                    return Promise.resolve({ data: { people: [{ identifier: "person1" }] } });
+                }
+            }
+        }),
+    ];
+    @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [MembersBlock], providers: providers })
+    class BlockContainerComponent {
+        block = { type: 'Block', settings: {} };
+        owner = { name: 'profile-name' };
+        constructor() {
+        }
+    }
+
+    it("get members of the block owner", done => {
+        tcb.createAsync(BlockContainerComponent).then(fixture => {
+            let recentDocumentsBlock: MembersBlock = fixture.debugElement.componentViewChildren[0].componentInstance;
+            expect(recentDocumentsBlock.members).toEqual([{ identifier: "person1" }]);
+            done();
+        });
+    });
+
+    it("render the profile image for each member", done => {
+        tcb.createAsync(BlockContainerComponent).then(fixture => {
+            let recentDocumentsBlock: MembersBlock = fixture.debugElement.componentViewChildren[0].componentInstance;
+            fixture.debugElement.getLocal("$rootScope").$apply();
+            expect(fixture.debugElement.queryAll("noosfero-profile-image").length).toEqual(1);
+            done();
+        });
+    });
+
+});
@@ -0,0 +1,25 @@
+import {Input, Inject, Component} from "ng-forward";
+import {ProfileService} from "../../../../lib/ng-noosfero-api/http/profile.service";
+
+@Component({
+    selector: "noosfero-members-block",
+    templateUrl: 'app/components/noosfero-blocks/members-block/members-block.html',
+})
+@Inject(ProfileService)
+export class MembersBlock {
+
+    @Input() block: any;
+    @Input() owner: any;
+
+    members: any = [];
+
+    constructor(private ProfileService: ProfileService) {
+
+    }
+
+    ngOnInit() {
+        this.ProfileService.getProfileMembers(this.owner.id, { per_page: 6 }).then((response: any) => {
+            this.members = response.data.people;
+        });
+    }
+}
 <div class="members-block">
-  <a ng-repeat="member in $ctrl.members" ui-sref="main.profile({profile: member.identifier})" class="member">
+  <a ng-repeat="member in ctrl.members" ui-sref="main.profile({profile: member.identifier})" class="member">
     <noosfero-profile-image profile="member"></noosfero-profile-image>
   </a>
 </div>
@@ -1,22 +0,0 @@
-(function() {
-  'use strict';
-
-  angular
-    .module('noosferoApp')
-    .component('noosferoProfileImageBlock', {
-      restrict: 'E',
-      templateUrl: 'app/components/noosfero-blocks/profile-image/profile-image.html',
-      bindings: {
-          block: '<',
-          owner: '<'
-      },
-      controller: ProfileImageBlockController
-    });
-
-  /** @ngInject */
-  function ProfileImageBlockController() {
-    var vm = this;
-    vm.profile = vm.owner;
-  }
-
-})();
@@ -0,0 +1,37 @@
+import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
+import {Pipe, Input, provide, Component} from 'ng-forward';
+
+import {ProfileImageBlock} from './profile-image.component';
+
+const tcb = new TestComponentBuilder();
+
+const htmlTemplate: string = '<noosfero-profile-image-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-profile-image-block>';
+
+
+describe("Profile Image Block Component", () => {
+
+    beforeEach(angular.mock.module("templates"));
+
+    @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [ProfileImageBlock] })
+    class BlockContainerComponent {
+        block = { type: 'Block' };
+        owner = { name: 'profile-name' };
+        constructor() {
+        }
+    }
+
+    it("render the profile image", done => {
+        tcb.createAsync(BlockContainerComponent).then(fixture => {
+            expect(fixture.debugElement.queryAll("noosfero-profile-image").length).toEqual(1);
+            done();
+        });
+    });
+
+    it("render the settings link", done => {
+        tcb.createAsync(BlockContainerComponent).then(fixture => {
+            expect(fixture.debugElement.queryAll(".settings-link").length).toEqual(1);
+            done();
+        });
+    });
+
+});
@@ -0,0 +1,12 @@
+import {Input, Component} from "ng-forward";
+
+@Component({
+    selector: "noosfero-profile-image-block",
+    templateUrl: 'app/components/noosfero-blocks/profile-image/profile-image.html',
+})
+export class ProfileImageBlock {
+
+    @Input() block: any;
+    @Input() owner: any;
+
+}
 <div class="center-block text-center profile-image-block">
-  <a ui-sref="main.profile.info({profile: $ctrl.owner.identifier})">
-    <noosfero-profile-image profile="$ctrl.owner"></noosfero-profile-image>
+  <a ui-sref="main.profile.info({profile: ctrl.owner.identifier})">
+    <noosfero-profile-image profile="ctrl.owner"></noosfero-profile-image>
   </a>
-  <a class="settings-link" target="_self" ui-sref="main.profile.settings({profile: $ctrl.owner.identifier})">Control panel</a>
+  <a class="settings-link" target="_self" ui-sref="main.profile.settings({profile: ctrl.owner.identifier})">Control panel</a>
 </div>
@@ -1,33 +0,0 @@
-(function() {
-  'use strict';
-
-  angular
-    .module('noosferoApp')
-    .component('noosferoRecentDocumentsBlock', {
-      restrict: 'E',
-      templateUrl: 'app/components/noosfero-blocks/recent-documents/recent-documents.html',
-      bindings: {
-          block: '<',
-          owner: '<'
-      },
-      controller: RecentDocumentsController
-    });
-
-  /** @ngInject */
-  function RecentDocumentsController(noosfero, $state) {
-    var vm = this;
-    vm.profile = vm.owner;
-    vm.documents = [];
-
-    vm.openDocument = function(article) {
-      $state.go("main.profile.page", {page: article.path, profile: article.profile.identifier}); 
-    }
-
-    var limit = vm.block.settings.limit || 5;
-    //FIXME get all text articles
-    noosfero.profiles.one(vm.profile.id).one('articles').get({content_type: 'TinyMceArticle', per_page: limit}).then(function(response) {
-      vm.documents = response.data.articles;
-    });
-  }
-
-})();
@@ -0,0 +1,52 @@
+import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
+import {Provider, Input, provide, Component} from 'ng-forward';
+
+import {RecentDocumentsBlock} from './recent-documents.component';
+
+const htmlTemplate: string = '<noosfero-recent-documents-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-recent-documents-block>';
+
+const tcb = new TestComponentBuilder();
+
+describe("Recent Documents Block Component", () => {
+
+    beforeEach(angular.mock.module("templates"));
+
+    let state = jasmine.createSpyObj("state", ["go"]);
+    let providers = [
+        new Provider('truncateFilter', { useValue: () => { } }),
+        new Provider('stripTagsFilter', { useValue: () => { } }),
+        new Provider('$state', { useValue: state }),
+        new Provider('ArticleService', {
+            useValue: {
+                getByProfile: (profileId: number, filters: any): any => {
+                    return Promise.resolve({ data: { articles: [{ name: "article1" }] } });
+                }
+            }
+        }),
+    ];
+    @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [RecentDocumentsBlock], providers: providers })
+    class BlockContainerComponent {
+        block = { type: 'Block', settings: {} };
+        owner = { name: 'profile-name' };
+        constructor() {
+        }
+    }
+
+    it("get recent documents from the article service", done => {
+        tcb.createAsync(BlockContainerComponent).then(fixture => {
+            let recentDocumentsBlock: RecentDocumentsBlock = fixture.debugElement.componentViewChildren[0].componentInstance;
+            expect(recentDocumentsBlock.documents).toEqual([{ name: "article1" }]);
+            done();
+        });
+    });
+
+    it("go to article page when open a document", done => {
+        tcb.createAsync(BlockContainerComponent).then(fixture => {
+            let recentDocumentsBlock: RecentDocumentsBlock = fixture.debugElement.componentViewChildren[0].componentInstance;
+            recentDocumentsBlock.openDocument({ path: "path", profile: { identifier: "identifier" } });
+            expect(state.go).toHaveBeenCalledWith("main.profile.page", { page: "path", profile: "identifier" });
+            done();
+        });
+    });
+
+});
@@ -0,0 +1,35 @@
+import {Component, Inject, Input} from "ng-forward";
+import {ArticleService} from "../../../../lib/ng-noosfero-api/http/article.service";
+
+@Component({
+    selector: "noosfero-recent-documents-block",
+    templateUrl: 'app/components/noosfero-blocks/recent-documents/recent-documents.html'
+})
+@Inject(ArticleService, "$state")
+export class RecentDocumentsBlock {
+
+    @Input() block: any;
+    @Input() owner: any;
+
+    profile: any;
+    documents: any;
+
+    constructor(private ArticleService: ArticleService, private $state: any) {
+    }
+
+    ngOnInit() {
+        this.profile = this.owner;
+        this.documents = [];
+
+        var limit = (this.block && this.block.settings) ? this.block.settings.limit : null || 5;
+        //FIXME get all text articles
+        this.ArticleService.getByProfile(this.profile.id, { content_type: 'TinyMceArticle', per_page: limit }).then((response: any) => {
+            this.documents = response.data.articles;
+        });
+    }
+
+    openDocument(article: any) {
+        this.$state.go("main.profile.page", { page: article.path, profile: article.profile.identifier });
+    }
+
+}
-<div deckgrid source="$ctrl.documents" class="deckgrid">
-  <div class="a-card panel media" ng-click="mother.$ctrl.openDocument(card);">
+<div deckgrid source="ctrl.documents" class="deckgrid">
+  <div class="a-card panel media" ng-click="mother.ctrl.openDocument(card);">
       <div class="author media-left" ng-show="card.author.image">
         <img ng-src="{{card.author.image.url}}" class="img-circle">
       </div>
@@ -19,6 +19,8 @@ import {bootstrap, bundle} from &quot;ng-forward&quot;;
 import {AUTH_EVENTS} from "./components/auth/auth_events";
 import {AuthController} from "./components/auth/auth_controller";
+import {Navbar} from "./components/navbar";
+
 declare var moment: any;
 let noosferoApp: any = bundle("noosferoApp", Main, ["ngAnimate", "ngCookies", "ngStorage", "ngTouch",
@@ -41,13 +43,8 @@ NoosferoApp.run(noosferoAngularRunBlock);
 NoosferoApp.addController("AuthController", AuthController);
-require("./components/navbar/navbar.directive.js");
 require("./components/noosfero-activities/activities.component.js");
 require("./components/noosfero-activities/activity/activity.component.js");
-require("./components/noosfero-blocks/main-block/main-block.component.js");
-require("./components/noosfero-blocks/members-block/members-block.component.js");
-require("./components/noosfero-blocks/profile-image/profile-image.component.js");
-require("./components/noosfero-blocks/recent-documents/recent-documents.component.js");
 require("./components/noosfero/noosfero-template.filter.js");
 require("./components/noosfero/noosfero.service.js");
 require("./components/noosfero/profile-image/profile-image.component.js");
@@ -7,11 +7,20 @@ import {Profile} from &quot;../profile/profile.component&quot;;
 import {Boxes} from "../components/noosfero-boxes/boxes.component";
 import {Block} from "../components/noosfero-blocks/block.component";
 import {LinkListBlock} from "../components/noosfero-blocks/link-list/link-list.component";
+import {RecentDocumentsBlock} from "../components/noosfero-blocks/recent-documents/recent-documents.component";
+import {ProfileImageBlock} from "../components/noosfero-blocks/profile-image/profile-image.component";
+import {MembersBlock} from "../components/noosfero-blocks/members-block/members-block.component";
 import {AuthService} from "./../components/auth/auth_service";
 import {Session} from "./../components/auth/session";
+
+import {Navbar} from "../components/navbar";
+
+import {MainBlock} from "../components/noosfero-blocks/main-block/main-block.component";
+
+
 @Component({
     selector: 'main-content',
     templateUrl: "app/main/main.html",
@@ -24,7 +33,10 @@ export class MainContent {
 @Component({
     selector: 'main',
     template: '<div ng-view></div>',
-    directives: [NoosferoArticleBlog, ArticleView, Boxes, Block, LinkListBlock],
+    directives: [
+        NoosferoArticleBlog, ArticleView, Boxes, Block, LinkListBlock,
+        MainBlock, RecentDocumentsBlock, Navbar, ProfileImageBlock, MembersBlock
+    ],
     providers: [AuthService, Session]
 })
 @StateConfig([
@@ -0,0 +1,15 @@
+import { Injectable, Inject } from "ng-forward";
+
+@Injectable()
+@Inject("Restangular")
+export class ArticleService {
+
+    constructor(private Restangular: any) {
+
+    }
+
+    getByProfile(profileId: number, filters: any) {
+        return this.Restangular.service('profiles').one(profileId).one('articles').get(filters);
+    }
+
+}
@@ -0,0 +1,15 @@
+import { Injectable, Inject } from "ng-forward";
+
+@Injectable()
+@Inject("Restangular")
+export class ProfileService {
+
+    constructor(private Restangular: any) {
+
+    }
+
+    getProfileMembers(profileId: number, filters: any) {
+        return this.Restangular.service('profiles').one(profileId).customGET("members", filters);
+    }
+
+}
@@ -9,6 +9,8 @@
     "es6-shim": "github:DefinitelyTyped/DefinitelyTyped/es6-shim/es6-shim.d.ts#4de74cb527395c13ba20b438c3a7a419ad931f1c",
     "jasmine": "github:DefinitelyTyped/DefinitelyTyped/jasmine/jasmine.d.ts#dd638012d63e069f2c99d06ef4dcc9616a943ee4",
     "jquery": "github:DefinitelyTyped/DefinitelyTyped/jquery/jquery.d.ts#470954c4f427e0805a2d633636a7c6aa7170def8",
+    "moment": "github:DefinitelyTyped/DefinitelyTyped/moment/moment.d.ts#b090bcf9ba9f756ec8ff53e7707269729172a325",
+    "moment-node": "github:DefinitelyTyped/DefinitelyTyped/moment/moment-node.d.ts#b090bcf9ba9f756ec8ff53e7707269729172a325",
     "ngstorage": "github:DefinitelyTyped/DefinitelyTyped/ngstorage/ngstorage.d.ts#f59279e1f7535149b4e14d2ccf537b2c81cfff75",
     "restangular": "github:DefinitelyTyped/DefinitelyTyped/restangular/restangular.d.ts#f2ae460e1751bb6668d291d4eb9255f047dd0ac5"
   }
	@@ -11,7 +11,7 @@		@@ -11,7 +11,7 @@
11	"remap-coverage": "ts-node --project ./dev-scripts ./dev-scripts/remapCoverage.ts",	11	"remap-coverage": "ts-node --project ./dev-scripts ./dev-scripts/remapCoverage.ts",
12	"test-single": "webpack && karma start --single-run",	12	"test-single": "webpack && karma start --single-run",
13	"test": "concurrently \"webpack -w\" \"karma start\"",	13	"test": "concurrently \"webpack -w\" \"karma start\"",
14	- "postinstall": "npm install -g bower && bower install",	14	+ "postinstall": "npm install -g bower && bower install && typings install",
15	"start": "concurrently \"webpack -w\" \"gulp serve\"",	15	"start": "concurrently \"webpack -w\" \"gulp serve\"",
16	"generate-indexes": "ts-node --project ./dev-scripts ./dev-scripts/generate-index-modules.ts"	16	"generate-indexes": "ts-node --project ./dev-scripts ./dev-scripts/generate-index-modules.ts"
17	},	17	},
1	-/* Module Index Entry - generated using the script npm run generate-indexes */	1	+/* Module Index Entry - generated using the script npm run generate-index */
2	export * from "./auth_controller";	2	export * from "./auth_controller";
3	export * from "./auth_events";	3	export * from "./auth_events";
4	export * from "./auth_service";	4	export * from "./auth_service";
1	/* Module Index Entry - generated using the script npm run generate-index */	1	/* Module Index Entry - generated using the script npm run generate-index */
		2	+export * from "./navbar";
	@@ -1,58 +0,0 @@	@@ -1,58 +0,0 @@
1	-(function() {
2	- 'use strict';
3	-
4	- angular
5	- .module('noosferoApp')
6	- .directive('acmeNavbar', acmeNavbar);
7	-
8	- /** @ngInject */
9	- function acmeNavbar() {
10	- var directive = {
11	- restrict: 'E',
12	- templateUrl: 'app/components/navbar/navbar.html',
13	- scope: {},
14	- controller: NavbarController,
15	- controllerAs: 'vm',
16	- bindToController: true
17	- };
18	-
19	- return directive;
20	-
21	- /** @ngInject */
22	- function NavbarController(moment, $modal, AuthService, Session, $scope, $state, AUTH_EVENTS) {
23	- var vm = this;
24	-
25	- vm.currentUser = Session.getCurrentUser();
26	- vm.modalInstance = null;
27	-
28	- vm.openLogin = function() {
29	- vm.modalInstance = $modal.open({
30	- templateUrl: 'app/components/auth/login.html',
31	- controller: 'AuthController',
32	- controllerAs: 'vm',
33	- bindToController: true
34	- });
35	- };
36	- vm.logout = function() {
37	- AuthService.logout();
38	- $state.go($state.current, {}, {reload: true}); //TODO move to auth
39	- };
40	- $scope.$on(AUTH_EVENTS.loginSuccess, function() {
41	- if(vm.modalInstance) {
42	- vm.modalInstance.close();
43	- vm.modalInstance = null;
44	- }
45	- $state.go($state.current, {}, {reload: true}); //TODO move to auth
46	- });
47	- $scope.$on(AUTH_EVENTS.logoutSuccess, function() {
48	- vm.currentUser = Session.getCurrentUser();
49	- });
50	-
51	- vm.activate = function() {
52	- if(!vm.currentUser) vm.openLogin();
53	- }
54	- vm.activate();
55	- }
56	- }
57	-
58	-})();
	@@ -0,0 +1,56 @@		@@ -0,0 +1,56 @@
		1	+import {createComponentFromClass, quickCreateComponent} from "./../../../spec/helpers";
		2	+import {Navbar} from "./";
		3	+import {AUTH_EVENTS} from "./../auth";
		4	+import {User} from "./../../models/interfaces";
		5	+import {Injectable, Provider, provide} from "ng-forward";
		6	+
		7	+
		8	+
		9	+describe("Navbar Component", () => {
		10	+
		11	+ let $rootScope: ng.IRootScopeService;
		12	+ let user = <User>{
		13	+ id: 1,
		14	+ login: "user"
		15	+ };
		16	+
		17	+ beforeEach(angular.mock.module("templates"));
		18	+
		19	+ // beforeEach(inject((_$rootScope_: ng.IRootScopeService) => {
		20	+ // $rootScope = _$rootScope_;
		21	+ // }));
		22	+
		23	+ it('should get the loggedIn user', (done: Function) => {
		24	+
		25	+
		26	+ let scope = jasmine.createSpyObj("scope", ["$on"]);
		27	+
		28	+ let providers = [
		29	+
		30	+
		31	+ new Provider('moment', { useValue: {} }),
		32	+ new Provider('$modal', { useValue: {} }),
		33	+ new Provider('AuthService', { useValue: {} }),
		34	+ new Provider('Session', { useValue: {
		35	+ getCurrentUser: () => { return user}
		36	+ } }),
		37	+ new Provider('$scope', { useValue: scope }),
		38	+ new Provider('$state', { useValue: {} }),
		39	+ new Provider('AUTH_EVENTS', { useValue: {AUTH_EVENTS} })
		40	+ ];
		41	+
		42	+
		43	+
		44	+ quickCreateComponent({
		45	+ providers: providers,
		46	+ template: "<acme-navbar></acme-navbar>",
		47	+ directives: [Navbar]
		48	+ }).then(fixture => {
		49	+ let navbarInstance: Navbar = fixture.debugElement.componentViewChildren[0].componentInstance;
		50	+ expect(navbarInstance).toBeDefined();
		51	+ expect(navbarInstance["currentUser"]).toEqual(user)
		52	+ done();
		53	+ })
		54	+ });
		55	+
		56	+});
0	\ No newline at end of file	57	\ No newline at end of file
	@@ -0,0 +1,68 @@		@@ -0,0 +1,68 @@
		1	+import {Component, Inject} from "ng-forward";
		2	+
		3	+
		4	+import {Session, AuthService, IAuthEvents} from "./../auth";
		5	+import {User} from "./../../models/interfaces";
		6	+
		7	+@Component({
		8	+ selector: "acme-navbar",
		9	+ templateUrl: "app/components/navbar/navbar.html"
		10	+})
		11	+@Inject("moment", "$modal", "AuthService", "Session", "$scope", "$state", "AUTH_EVENTS")
		12	+export class Navbar {
		13	+
		14	+ private currentUser: User;
		15	+ private modalInstance: any = null;
		16	+ /**
		17	+ *
		18	+ */
		19	+ constructor(
		20	+ private moment: moment.MomentStatic,
		21	+ private $modal: any,
		22	+ private authService: AuthService,
		23	+ private session: Session,
		24	+ private $scope: ng.IScope,
		25	+ private $state: ng.ui.IStateService,
		26	+ private AUTH_EVENTS: IAuthEvents
		27	+ ) {
		28	+
		29	+ this.currentUser = session.getCurrentUser();
		30	+
		31	+ $scope.$on(AUTH_EVENTS.loginSuccess, function() {
		32	+ if (this.modalInstance) {
		33	+ this.modalInstance.close();
		34	+ this.modalInstance = null;
		35	+ }
		36	+
		37	+ this.$state.go(this.$state.current, {}, { reload: true }); //TODO move to auth
		38	+ });
		39	+
		40	+ $scope.$on(AUTH_EVENTS.logoutSuccess, () => {
		41	+ this.currentUser = this.session.getCurrentUser();
		42	+ });
		43	+
		44	+ }
		45	+
		46	+ openLogin() {
		47	+ this.modalInstance = this.$modal.open({
		48	+ templateUrl: 'app/components/auth/login.html',
		49	+ controller: 'AuthController',
		50	+ controllerAs: 'vm',
		51	+ bindToController: true
		52	+ });
		53	+ };
		54	+
		55	+ logout() {
		56	+ this.authService.logout();
		57	+ this.$state.go(this.$state.current, {}, { reload: true }); //TODO move to auth
		58	+ };
		59	+
		60	+
		61	+
		62	+ activate() {
		63	+ if (!this.currentUser) {
		64	+ this.openLogin();
		65	+ }
		66	+ }
		67	+
		68	+}
0	\ No newline at end of file	69	\ No newline at end of file
	@@ -11,7 +11,7 @@ export class Block {		@@ -11,7 +11,7 @@ export class Block {
11	@Input() owner: any;	11	@Input() owner: any;
12		12
13	ngOnInit() {	13	ngOnInit() {
14	- let blockName = this.block.type ? this.block.type.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase() : "default-block";	14	+ let blockName = (this.block && this.block.type) ? this.block.type.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase() : "default-block";
15	this.$element.replaceWith(this.$compile('<noosfero-' + blockName + ' [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-' + blockName + '>')(this.$scope));	15	this.$element.replaceWith(this.$compile('<noosfero-' + blockName + ' [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-' + blockName + '>')(this.$scope));
16	}	16	}
17		17
1	/* Module Index Entry - generated using the script npm run generate-index */	1	/* Module Index Entry - generated using the script npm run generate-index */
		2	+export * from "./link-list.component";
@@ -0,0 +1,64 @@		@@ -0,0 +1,64 @@
	1	+import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder';
	2	+import {Pipe, Input, provide, Component} from 'ng-forward';
	3	+
	4	+import {LinkListBlock} from './link-list.component';
	5	+
	6	+const tcb = new TestComponentBuilder();
	7	+
	8	+const htmlTemplate: string = '<noosfero-link-list-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-link-list-block>';
	9	+
	10	+
	11	+describe("Link List Block Component", () => {
	12	+
	13	+ beforeEach(angular.mock.module("templates"));
	14	+
	15	+ it("receives the block and the owner as inputs", done => {
	16	+
	17	+ // Creating a container component (BlockContainerComponent) to include
	18	+ // the component under test (Block)
	19	+ @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [LinkListBlock] })
	20	+ class BlockContainerComponent {
	21	+ block = { type: 'Block' };
	22	+ owner = { name: 'profile-name' };
	23	+ constructor() {
	24	+ }
	25	+ }
	26	+
	27	+ // uses the TestComponentBuilder instance to initialize the component
	28	+ //.overrideView(LinkListBlock, { template: 'asdasdasd', pipes: [NoosferoTemplate] })
	29	+ tcb.createAsync(BlockContainerComponent).then(fixture => {
	30	+ // and here we can inspect and run the test assertions
	31	+ let myComponent: LinkListBlock = fixture.componentInstance;
	32	+
	33	+ // assure the block object inside the Block matches
	34	+ // the provided through the parent component
	35	+ expect(myComponent.block.type).toEqual("Block");
	36	+ expect(myComponent.owner.name).toEqual("profile-name");
	37	+ done();
	38	+ });
	39	+ });
	40	+
	41	+
	42	+ it("display links stored in block settings", done => {
	43	+
	44	+ @Pipe('noosferoTemplateFilter')
	45	+ class NoosferoTemplateFilter {
	46	+ transform(input: any, changeTo: any) {
	47	+ return input;
	48	+ }
	49	+ }
	50	+
	51	+ @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [LinkListBlock] })
	52	+ class CustomBlockType {
	53	+ block: any = { settings: { links: [{ name: 'link1', address: 'address1' }, { name: 'link2', address: 'address2' }] } };
	54	+ owner: any = { name: 'profile-name' };
	55	+ constructor() {
	56	+ }
	57	+ }
	58	+ tcb.overrideView(LinkListBlock, { templateUrl: "app/components/noosfero-blocks/link-list/link-list.html", pipes: [NoosferoTemplateFilter] }).createAsync(CustomBlockType).then(fixture => {
	59	+ expect(fixture.debugElement.queryAll(".link-list-block a").length).toEqual(2);
	60	+ done();
	61	+ });
	62	+ });
	63	+
	64	+});
	@@ -1,20 +0,0 @@	@@ -1,20 +0,0 @@
1	-(function() {
2	- 'use strict';
3	-
4	- angular
5	- .module('noosferoApp')
6	- .component('noosferoMainBlock', {
7	- restrict: 'E',
8	- templateUrl: 'app/components/noosfero-blocks/main-block/main-block.html',
9	- bindings: {
10	- block: '<',
11	- owner: '<'
12	- },
13	- controller: MainBlockController
14	- });
15	-
16	- /** @ngInject */
17	- function MainBlockController() {
18	- }
19	-
20	-})();