From c591f754683e3308d9620e1298213a412bc38ad6 Mon Sep 17 00:00:00 2001 From: Roman Hotsiy Date: Sat, 19 Dec 2015 14:16:29 +0200 Subject: [PATCH] Add Zippy component spec --- lib/common/components/Zippy/zippy.spec.js | 111 ++++++++++++++++++++++ tests/helpers.js | 9 ++ 2 files changed, 120 insertions(+) create mode 100644 lib/common/components/Zippy/zippy.spec.js diff --git a/lib/common/components/Zippy/zippy.spec.js b/lib/common/components/Zippy/zippy.spec.js new file mode 100644 index 00000000..ac75d6e7 --- /dev/null +++ b/lib/common/components/Zippy/zippy.spec.js @@ -0,0 +1,111 @@ +'use strict'; + +import { getChildDebugElement, mouseclick } from 'tests/helpers'; +import {Component, View} from 'angular2/core'; + +import { + TestComponentBuilder, + inject, + beforeEach, + it +} from 'angular2/testing'; + +import Zippy from 'lib/common/components/Zippy/zippy'; + + +describe('Zippy Component', () => { + let builder; + let component; + let nativeElement; + let fixture; + + beforeEach(inject([TestComponentBuilder], (tcb) => { + builder = tcb; + })); + beforeEach((done) => { + builder.createAsync(TestApp).then(_fixture => { + fixture = _fixture; + let debugEl = getChildDebugElement(fixture.debugElement, 'zippy'); + component = debugEl.componentInstance; + nativeElement = debugEl.nativeElement; + done(); + }, err => done.fail(err)); + }); + + + it('should init component', () => { + expect(component).not.toBeNull(); + }); + + it('should init component defaults', () => { + component.empty.should.be.false; + component.visible.should.be.false; + component.type.should.be.equal('general'); + }); + + it('should init properties from dom params', () => { + fixture.detectChanges(); + component.visible.should.be.true; + component.empty.should.be.true; + component.title.should.be.equal('Zippy'); + component.type.should.be.equal('test'); + }); + + it('should open and close zippy', () => { + fixture.detectChanges(); + component.empty = false; + component.visible = true; + fixture.detectChanges(); + + let testComponent = fixture.debugElement.componentInstance; + + let titleEl = nativeElement.querySelector('.zippy-title'); + mouseclick(titleEl); + fixture.detectChanges(); + component.visible.should.be.false; + testComponent.opened.should.be.false; + + mouseclick(titleEl); + fixture.detectChanges(); + component.visible.should.be.true; + testComponent.opened.should.be.true; + }); + + it('should disable empty zippy', () => { + fixture.detectChanges(); + component.empty = true; + fixture.detectChanges(); + + let testComponent = fixture.debugElement.componentInstance; + + let titleEl = nativeElement.querySelector('.zippy-title'); + mouseclick(titleEl); + fixture.detectChanges(); + testComponent.clickCount.should.be.equal(0); + }); +}); + + +/** Test component that contains an ApiInfo. */ +@Component({selector: 'test-app'}) +@View({ + directives: [Zippy], + template: + ` + test + ` +}) +class TestApp { + constructor() { + this.opened = false; + this.clickCount = 0; + } + open() { + this.opened = true; + this.clickCount++; + } + close() { + this.opened = false; + this.clickCount++; + } +} diff --git a/tests/helpers.js b/tests/helpers.js index 0c5bb32e..a1909ac2 100644 --- a/tests/helpers.js +++ b/tests/helpers.js @@ -9,3 +9,12 @@ export function getChildDebugElement(parent, tagName) { return debugEl.nativeElement.tagName && debugEl.nativeElement.tagName.toLowerCase() === tagName; }); } + +export function mouseclick( element ) { + // create a mouse click event + var event = document.createEvent( 'MouseEvents' ); + event.initMouseEvent( 'click', true, true, window, 1, 0, 0 ); + + // send click to element + element.dispatchEvent( event ); +}