diff --git a/src/app/components/noosfero-blocks/block.component.spec.ts b/src/app/components/noosfero-blocks/block.component.spec.ts new file mode 100644 index 0000000..950dc9d --- /dev/null +++ b/src/app/components/noosfero-blocks/block.component.spec.ts @@ -0,0 +1,90 @@ +import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder'; +import {Input, provide, Component} from 'ng-forward'; + +import {Block} from './block.component'; + +const tcb = new TestComponentBuilder(); + +const htmlTemplate: string = ''; + + +describe("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("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: [Block] }) + class BlockContainerComponent { + block = { type: 'Block' }; + owner = { name: 'profile-name' }; + constructor() { + } + } + + // 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: Block = 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("renders a component which matches to the block type", done => { + // CustomBlock component created to check if it will be used + // when a block with type 'CustomBlock' is provided to the noosfero-block (Block) + // *** Important *** - the selector is what ng-forward uses to define the name of the directive provider + @Component({ selector: 'noosfero-custom-block', template: "

My Custom Block

" }) + class CustomBlock { + @Input() block: any; + @Input() owner: any; + } + + @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [Block, CustomBlock] }) + class CustomBlockType { + block = { type: 'CustomBlock' }; + owner = { name: 'profile-name' }; + constructor() { + } + } + tcb + .createAsync(CustomBlockType).then(fixture => { + let myComponent: CustomBlockType = fixture.componentInstance; + expect(myComponent.block.type).toEqual("CustomBlock"); + expect(fixture.debugElement.componentViewChildren[0].text()).toEqual("My Custom Block"); + done(); + }); + }); + + + it("renders the default block when hasn't defined a block type", done => { + @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [Block] }) + class CustomBlockType { + block = { type: null }; + owner = { name: 'profile-name' }; + constructor() { + } + } + tcb + .createAsync(CustomBlockType).then(fixture => { + let myComponent: CustomBlockType = fixture.componentInstance; + expect(myComponent.block.type).toBeNull(); + expect(!!fixture.debugElement.nativeElement.querySelector("noosfero-default-block")).toBeTruthy(); + done(); + }); + }); + +}); diff --git a/src/app/components/noosfero-blocks/block.directive.spec.ts b/src/app/components/noosfero-blocks/block.directive.spec.ts deleted file mode 100644 index 950dc9d..0000000 --- a/src/app/components/noosfero-blocks/block.directive.spec.ts +++ /dev/null @@ -1,90 +0,0 @@ -import {TestComponentBuilder} from 'ng-forward/cjs/testing/test-component-builder'; -import {Input, provide, Component} from 'ng-forward'; - -import {Block} from './block.component'; - -const tcb = new TestComponentBuilder(); - -const htmlTemplate: string = ''; - - -describe("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("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: [Block] }) - class BlockContainerComponent { - block = { type: 'Block' }; - owner = { name: 'profile-name' }; - constructor() { - } - } - - // 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: Block = 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("renders a component which matches to the block type", done => { - // CustomBlock component created to check if it will be used - // when a block with type 'CustomBlock' is provided to the noosfero-block (Block) - // *** Important *** - the selector is what ng-forward uses to define the name of the directive provider - @Component({ selector: 'noosfero-custom-block', template: "

My Custom Block

" }) - class CustomBlock { - @Input() block: any; - @Input() owner: any; - } - - @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [Block, CustomBlock] }) - class CustomBlockType { - block = { type: 'CustomBlock' }; - owner = { name: 'profile-name' }; - constructor() { - } - } - tcb - .createAsync(CustomBlockType).then(fixture => { - let myComponent: CustomBlockType = fixture.componentInstance; - expect(myComponent.block.type).toEqual("CustomBlock"); - expect(fixture.debugElement.componentViewChildren[0].text()).toEqual("My Custom Block"); - done(); - }); - }); - - - it("renders the default block when hasn't defined a block type", done => { - @Component({ selector: 'test-container-component', template: htmlTemplate, directives: [Block] }) - class CustomBlockType { - block = { type: null }; - owner = { name: 'profile-name' }; - constructor() { - } - } - tcb - .createAsync(CustomBlockType).then(fixture => { - let myComponent: CustomBlockType = fixture.componentInstance; - expect(myComponent.block.type).toBeNull(); - expect(!!fixture.debugElement.nativeElement.querySelector("noosfero-default-block")).toBeTruthy(); - done(); - }); - }); - -}); -- libgit2 0.21.2