diff --git a/src/app/shared/message/index.ts b/src/app/shared/message/index.ts index 650c8a6..d1be057 100644 --- a/src/app/shared/message/index.ts +++ b/src/app/shared/message/index.ts @@ -1,4 +1,4 @@ export { Message } from './message.model'; export { MessageComponent } from './message.component'; export { MessageService } from './message.service'; -export { MessageType } from './message-type.enum'; \ No newline at end of file +export { MessageType } from './message-type.type'; diff --git a/src/app/shared/message/message-type.type.spec.ts b/src/app/shared/message/message-type.type.spec.ts new file mode 100644 index 0000000..9d5bd3a --- /dev/null +++ b/src/app/shared/message/message-type.type.spec.ts @@ -0,0 +1,21 @@ +import { + beforeEach, beforeEachProviders, + describe, xdescribe, + expect, it, xit, + async, inject +} from '@angular/core/testing'; + +import { MessageType } from './message-type.type'; + +let type: MessageType; + +describe('Type: MessageType', () => { + it('should accept value "success"', () => { + this.type = 'success'; + expect(this.type).toEqual('success'); + }); + it('should accept value "error"', () => { + this.type = 'error'; + expect(this.type).toEqual('error'); + }); +}); diff --git a/src/app/shared/message/message-type.enum.ts b/src/app/shared/message/message-type.type.ts similarity index 100% rename from src/app/shared/message/message-type.enum.ts rename to src/app/shared/message/message-type.type.ts diff --git a/src/app/shared/message/message.component.html b/src/app/shared/message/message.component.html index ecb1744..5d477f6 100644 --- a/src/app/shared/message/message.component.html +++ b/src/app/shared/message/message.component.html @@ -1,8 +1,8 @@ - + {{message.title}}

{{message.description}}

-
\ No newline at end of file +
diff --git a/src/app/shared/message/message.component.po.ts b/src/app/shared/message/message.component.po.ts new file mode 100644 index 0000000..2d6aed5 --- /dev/null +++ b/src/app/shared/message/message.component.po.ts @@ -0,0 +1,24 @@ +export class MessageComponentPage { + + private mdCard:HTMLElement; + + constructor(private element:HTMLElement) { + this.mdCard = element.querySelector('md-card'); + } + + isVisible():boolean { + return this.mdCard != null && this.mdCard != undefined; + } + + getClass():String { + return this.mdCard.classList.item(0); + } + + getTitle():String { + return this.mdCard.querySelector('md-card-title').innerHTML; + } + + getContent():String { + return this.mdCard.querySelector('md-card-content p').innerHTML; + } +} diff --git a/src/app/shared/message/message.component.spec.ts b/src/app/shared/message/message.component.spec.ts index 049e6c9..a1d2de6 100644 --- a/src/app/shared/message/message.component.spec.ts +++ b/src/app/shared/message/message.component.spec.ts @@ -5,16 +5,22 @@ import { expect, it, inject, + async } from '@angular/core/testing'; import { ComponentFixture, TestComponentBuilder } from '@angular/compiler/testing'; import { Component } from '@angular/core'; import { By } from '@angular/platform-browser'; + +import { Message } from './message.model'; import { MessageComponent } from './message.component'; +import { MessageComponentPage } from './message.component.po'; +import { MessageType } from './message-type.type'; describe('Component: Message', () => { let builder: TestComponentBuilder; beforeEachProviders(() => [MessageComponent]); + beforeEach(inject([TestComponentBuilder], function (tcb: TestComponentBuilder) { builder = tcb; })); @@ -24,21 +30,130 @@ describe('Component: Message', () => { })); it('should create the component', inject([], () => { - return builder.createAsync(MessageComponentTestController) + return builder.createAsync(MessageComponentControllerUsingObject) .then((fixture: ComponentFixture) => { let query = fixture.debugElement.query(By.directive(MessageComponent)); expect(query).toBeTruthy(); expect(query.componentInstance).toBeTruthy(); }); })); + + describe('Using message object', () => { + + let componentDebugElement, + componentInstance: MessageComponent, + componentControllerInstance: MessageComponentControllerUsingObject, + po: MessageComponentPage; + + it('should render a message', () => { + return builder.createAsync(MessageComponentControllerUsingObject).then((fixture: ComponentFixture) => { + componentDebugElement = fixture.debugElement.query(By.directive(MessageComponent)); + componentControllerInstance = fixture.debugElement.componentInstance; + componentInstance = componentDebugElement.componentInstance; + + let type: MessageType = 'success' + let title: String = 'YAY'; + let description: String = `There's a success!`; + let success = new Message(type, title, description); + componentControllerInstance.message = success; + fixture.detectChanges(); + + po = new MessageComponentPage(componentDebugElement.nativeElement); + expect(componentInstance.message).toBe(success); + expect(po.isVisible()).toBe(true); + expect(po.getClass()).toBe(type); + expect(po.getTitle()).toBe(title); + expect(po.getContent()).toContain(description); + }); + }); + + it('should not render a message when a message is not given or has no type', ()=> { + return builder.createAsync(MessageComponentControllerUsingObject).then((fixture: ComponentFixture) => { + componentDebugElement = fixture.debugElement.query(By.directive(MessageComponent)); + componentControllerInstance = fixture.debugElement.componentInstance; + componentInstance = componentDebugElement.componentInstance; + + let messageNull = null; + let messageWithoutType = new Message(null, 'a title', 'some description'); + [messageNull, messageWithoutType].forEach((message)=> { + + componentControllerInstance.message = message; + fixture.detectChanges(); + + po = new MessageComponentPage(componentDebugElement.nativeElement); + expect(po.isVisible()).toBe(false); + }) + }); + }); + }); + + describe('Using parameters', () => { + + let componentDebugElement, + componentInstance: MessageComponent, + componentControllerInstance: MessageComponentControllerUsingParameters, + po: MessageComponentPage; + + it('should render a message', () => { + return builder.createAsync(MessageComponentControllerUsingParameters).then((fixture: ComponentFixture) => { + componentDebugElement = fixture.debugElement.query(By.directive(MessageComponent)); + componentControllerInstance = fixture.debugElement.componentInstance; + componentInstance = componentDebugElement.componentInstance; + + let type: MessageType = 'error' + let title: String = 'Ops!'; + let description: String = `There's a problem!`; + componentControllerInstance.type = type + componentControllerInstance.title = title + componentControllerInstance.description = description + fixture.detectChanges(); + + po = new MessageComponentPage(componentDebugElement.nativeElement); + expect(po.isVisible()).toBe(true); + expect(po.getClass()).toBe(type); + expect(po.getTitle()).toBe(title); + expect(po.getContent()).toContain(description); + }); + }); + + it('should not render a message when type is not given', () => { + return builder.createAsync(MessageComponentControllerUsingParameters).then((fixture: ComponentFixture) => { + componentDebugElement = fixture.debugElement.query(By.directive(MessageComponent)); + componentControllerInstance = fixture.debugElement.componentInstance; + componentInstance = componentDebugElement.componentInstance; + + componentControllerInstance.type = null; + componentControllerInstance.title = 'Ops!'; + componentControllerInstance.description = `There's a problem!`; + fixture.detectChanges(); + + po = new MessageComponentPage(componentDebugElement.nativeElement); + expect(po.isVisible()).toBe(false); + }); + }); + }); }); @Component({ selector: 'test', template: ` - + + `, + directives: [MessageComponent] +}) +class MessageComponentControllerUsingObject { + message:Message = null; +} + +@Component({ + selector: 'test', + template: ` + `, directives: [MessageComponent] }) -class MessageComponentTestController { +class MessageComponentControllerUsingParameters { + type:String = null; + title:String = null; + description:String = null; } diff --git a/src/app/shared/message/message.component.ts b/src/app/shared/message/message.component.ts index 087dfba..ad5a3e0 100644 --- a/src/app/shared/message/message.component.ts +++ b/src/app/shared/message/message.component.ts @@ -18,11 +18,8 @@ export class MessageComponent implements OnInit { constructor() {} ngOnInit() { - if(!this.message && this.type && this.title && this.description) { - this.message = new Message(this.type, this.title, this.description); - } - if(this.message && (!this.message.type || !this.message.title || !this.message.description)) { - this.message = null; + if(!this.message && (this.type && this.title && this.description)) { + this.message = new Message(this.type, this.title, this.description) } } -} \ No newline at end of file +} diff --git a/src/app/shared/message/message.model.spec.ts b/src/app/shared/message/message.model.spec.ts new file mode 100644 index 0000000..f8fc177 --- /dev/null +++ b/src/app/shared/message/message.model.spec.ts @@ -0,0 +1,23 @@ +import { + beforeEach, beforeEachProviders, + describe, xdescribe, + expect, it, xit, + async, inject +} from '@angular/core/testing'; + +import { Message } from './message.model'; + +describe('Model: Message', () => { + it('should construct without Type, Title nor Description', () => { + this.model = new Message(); + expect(this.model.type).toBeUndefined(); + expect(this.model.title).toBeUndefined(); + expect(this.model.description).toBeUndefined(); + }); + it('should construct with Type, Title and Description', () => { + this.model = new Message('success', 'title', 'description'); + expect(this.model.type).toBe('success'); + expect(this.model.title).toBe('title'); + expect(this.model.description).toBe('description'); + }); +}); diff --git a/src/app/shared/message/message.model.ts b/src/app/shared/message/message.model.ts index f217bff..a413d81 100644 --- a/src/app/shared/message/message.model.ts +++ b/src/app/shared/message/message.model.ts @@ -1,4 +1,4 @@ -import { MessageType } from './message-type.enum'; +import { MessageType } from './message-type.type'; export class Message { constructor(public type?: MessageType, public title?: String, public description?: String) {} -} \ No newline at end of file +}