From f711ee9ce0e341dcf29ec2d72371ab5b042d25f3 Mon Sep 17 00:00:00 2001 From: Michel Felipe Date: Mon, 25 Apr 2016 17:52:09 -0300 Subject: [PATCH] Refactory into ComponentTestHelper and sidebar unit tests enhancements --- src/app/layout/blocks/people-block/people-block.component.spec.ts | 4 ++-- src/app/layout/sidebar/sidebar.component.spec.ts | 75 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ src/app/layout/sidebar/sidebar.component.ts | 29 ++++++++++++++++++++++------- src/spec/helpers.ts | 16 +++++++++------- 4 files changed, 108 insertions(+), 16 deletions(-) create mode 100644 src/app/layout/sidebar/sidebar.component.spec.ts diff --git a/src/app/layout/blocks/people-block/people-block.component.spec.ts b/src/app/layout/blocks/people-block/people-block.component.spec.ts index f5a480f..a64ce95 100644 --- a/src/app/layout/blocks/people-block/people-block.component.spec.ts +++ b/src/app/layout/blocks/people-block/people-block.component.spec.ts @@ -39,8 +39,8 @@ describe("Components", () => { }); /** - * By default the helper will have the component, with all properties - * ready to be used. Here the mock provider 'EnvironmentService' will + * By default the helper will have the component, with all properties + * ready to be used. Here the mock provider 'EnvironmentService' will * return the given array with one person. */ it("get block with one people", () => { diff --git a/src/app/layout/sidebar/sidebar.component.spec.ts b/src/app/layout/sidebar/sidebar.component.spec.ts new file mode 100644 index 0000000..74c4db5 --- /dev/null +++ b/src/app/layout/sidebar/sidebar.component.spec.ts @@ -0,0 +1,75 @@ +import {provide} from 'ng-forward'; +import {ComponentTestHelper, createClass} from '../../../spec/component-test-helper'; +import {providers} from 'ng-forward/cjs/testing/providers'; +import {SidebarComponent} from './sidebar.component'; + +const htmlTemplate: string = ''; + +describe('Sidebar Component', () => { + + let helper: ComponentTestHelper; + let notifyService: any = { + event: Function, + subscribe: (fn: (visible: boolean) => void) => { + notifyService.event = fn; + }, + next: (value: any) => { + notifyService.event(value); + }, + setVisibility: (visible: boolean) => { + notifyService.event(visible); + } + }; + + let sessionService: any = { + currentUser: (): any => { + return { + person: { name: 'test' } + }; + } + }; + + + beforeEach(angular.mock.module("templates")); + + beforeEach((done: Function) => { + providers((provide: any) => { + return [ + provide('SidebarNotificationService', { + useValue: notifyService + }), + provide('SessionService', { + useValue: sessionService + }) + ]; + }); + + let cls = createClass({ + template: htmlTemplate, + directives: [SidebarComponent], + properties: { + visible: false + } + }); + + helper = new ComponentTestHelper(cls, done); + }); + + it('render the sidebar html content', () => { + expect(helper.all('div#nav-col').length).toEqual(1); + }); + + it('show sidebar only if a service emit a visibility event', () => { + + notifyService.setVisibility(true); + expect(helper.component.isVisible()).toBeTruthy(); + }); + + it('show user name into sidebar', () => { + + notifyService.setVisibility(true); + expect(helper.component.user.name).toEqual(sessionService.currentUser().person.name); + expect(helper.debugElement.query('div.user-box .name a').text()).toMatch(sessionService.currentUser().person.name); + }); + +}); diff --git a/src/app/layout/sidebar/sidebar.component.ts b/src/app/layout/sidebar/sidebar.component.ts index 485d8e5..7a54655 100644 --- a/src/app/layout/sidebar/sidebar.component.ts +++ b/src/app/layout/sidebar/sidebar.component.ts @@ -1,23 +1,38 @@ import {Component, Inject, Input} from "ng-forward"; import {SidebarNotificationService} from "./sidebar.notification.service"; +import {SessionService} from '../../login/session.service'; @Component({ selector: 'sidebar', templateUrl: 'app/layout/sidebar/sidebar.html' }) -@Inject(SidebarNotificationService) +@Inject(SidebarNotificationService, SessionService) export class SidebarComponent { - @Input('visible') - private isVisible: boolean = false; + @Input() + private visible: boolean = false; - constructor(private notificationService: SidebarNotificationService) { } + @Input() + public user: { name: string } = { + name: '' + }; + + constructor(private notificationService: SidebarNotificationService, private session: SessionService) { } ngOnInit() { - this.notificationService.setVisibility(this.isVisible); - this.notificationService.subscribe((visible) => { - this.isVisible = visible; + let userData: any = this.session.currentUser(); + if (userData) { + this.user = userData.person; + } + + this.notificationService.setVisibility(this.visible); + this.notificationService.subscribe((visible: boolean) => { + this.visible = visible; }); } + + isVisible(): boolean { + return this.visible; + } } diff --git a/src/spec/helpers.ts b/src/spec/helpers.ts index 48f7538..0774f74 100644 --- a/src/spec/helpers.ts +++ b/src/spec/helpers.ts @@ -1,7 +1,7 @@ import {ngClass, TestComponentBuilder, ComponentFixture} from 'ng-forward/cjs/testing/test-component-builder'; import {providers} from 'ng-forward/cjs/testing/providers'; -import {Injectable, Inject, Provider, Input, provide, Component} from 'ng-forward'; +import {Injectable, Inject, Provider, Input, Output, EventEmitter, provide, Component} from 'ng-forward'; export var ngforward = { @@ -62,7 +62,6 @@ export function provideFilters(...filters: string[]) { return providers; } - @Component({ selector: 'helper_get_angular_service', template: 'not-used', @@ -78,12 +77,15 @@ class AngularServiceHookComponent { * This helper class allows get angular services to be used in integration tests * i.e: '$http', '$q', '$location', etc... */ -class AngularServiceFactory { +export class AngularServiceFactory { + + private fixtureComponentHookPoint: ComponentFixture; - constructor(private fixtureComponentHookPoint: ComponentFixture) { - this.fixtureComponentHookPoint = (tcb)["create"](AngularServiceHookComponent); + constructor() { + this.fixtureComponentHookPoint = (tcb)["create"](ComponentWithOutputCall); } + getAngularService(angularService: string) { return this.fixtureComponentHookPoint.debugElement.getLocal(angularService); } @@ -97,8 +99,8 @@ class AngularServiceFactory { } } -export function getAngularServiceFactory(fixture: ComponentFixture) { - return new AngularServiceFactory(fixture); +export function getAngularServiceFactory() { + return new AngularServiceFactory(); } export {mocks} from "./mocks"; -- libgit2 0.21.2