Added unit test to profile-data directive and refactor quickComponent helper method

Michel Felipe de Oliveira Ferreira - SUPDE/DESDR/DE502
1 parent d7dd90d7
Showing 4 changed files with 86 additions and 7 deletions Show diff stats
src/app/profile/data/profile-data.component.spec.ts
src/app/profile/data/profile-data.html
src/lib/ng-noosfero-api/interfaces/profile.ts
src/spec/helpers.ts
@@ -0,0 +1,57 @@
+import * as helpers from "./../../../spec/helpers";
+
+import {Injectable, Provider, provide} from "ng-forward";
+import {providers} from 'ng-forward/cjs/testing/providers';
+
+import {ComponentFixture} from 'ng-forward/cjs/testing/test-component-builder';
+
+import {ProfileDataComponent} from "./profile-data.component";
+import {TranslateProfile} from '../../shared/pipes/translate-profile.filter';
+
+let templateHtml = '<profile-data [profile]="ctrl.profile"></profile-data>';
+
+describe('Profile data component', () => {
+
+    let profileMock = <noosfero.Profile>{
+        id: 1,
+        identifier: 'profile-test',
+        type: 'Person'
+    };
+
+    beforeEach(() => {
+
+        angular.mock.module("templates");
+        angular.mock.module("angularMoment");
+
+        providers((provide: any) => {
+            return <any>helpers.provideFilters('TranslateProfile', 'translateFilter')
+        });
+    });
+
+    let buildComponent = (): Promise<ComponentFixture> => {
+        return helpers.quickCreateComponent({
+            directives: [ProfileDataComponent],
+            template: templateHtml,
+            properties: {
+                profile: profileMock
+            }
+        });
+    };
+
+    it('renders profile-data directive', () => {
+        buildComponent().then((fixture: ComponentFixture) => {
+            expect(fixture.debugElement.query('div.table-responsive').length).toEqual(1);
+            expect(fixture.debugElement.query('span.label-info').length).toEqual(1);
+        });
+    });
+
+    it('renders profile-data directive with custom fields', () => {
+        profileMock.additional_data = {
+            'Address': 'Street A, Number 102'
+        };
+
+        buildComponent().then((fixture: ComponentFixture) => {
+            expect(fixture.debugElement.query('div.profile-custom-fields').length).toEqual(1);
+        });
+    });
+});
@@ -22,7 +22,7 @@
 </div>
  
 <!-- Custom Fields -->
-<div class="main-box clearfix">
+<div class="main-box clearfix profile-custom-fields" ng-if="ctrl.profile.additional_data">
   <header class="main-box-header clearfix">
     <h2>{{"profile.others_info" | translate}}</h2>
   </header>
@@ -31,6 +31,20 @@ namespace noosfero {
          */
         type: string;
  
+        /**
+         * @ngdoc property
+         * @name name
+         * @propertyOf noofero.Profile
+         * @returns {string} The name of Profile (e.g.: "Mr. Janson", etc.)
+         */
         name: string;
+
+        /**
+         * @ngdoc property
+         * @name additional_data
+         * @propertyOf noofero.Profile
+         * @returns {string} A key => value custom fields data of Profile (e.g.: "{'Address':'Street A, Number 102...'}")
+         */
+        additional_data?: any;
     }
-}
 \ No newline at end of file
+}
@@ -5,9 +5,9 @@ import {Injectable, Inject, Provider, Input, provide, Component} from &#39;ng-forwar
  
  
 export var ngforward = {
-  providers: providers,
-  TestComponentBuilder: TestComponentBuilder,
-  ComponentFixture: ComponentFixture
+    providers: providers,
+    TestComponentBuilder: TestComponentBuilder,
+    ComponentFixture: ComponentFixture
 };
  
 export interface ComponentFixtureTemplate {
@@ -21,11 +21,19 @@ export let tcb: TestComponentBuilder = new TestComponentBuilder();
 export function quickCreateComponent({
     providers = [],
     directives = [],
-    template = '<div></div>'
+    template = '<div></div>',
+    properties = {},
 }): Promise<ComponentFixture> {
  
     @Component({ selector: 'test', template, directives, providers })
-    class Test { }
+    class Test {
+
+        constructor() {
+            Object.keys(properties).forEach((key) => {
+                this[key] = properties[key];
+            });
+        }
+    }
  
     return tcb.createAsync(Test);
 }
...	...	@@ -0,0 +1,57 @@
	1	+import * as helpers from "./../../../spec/helpers";
	2	+
	3	+import {Injectable, Provider, provide} from "ng-forward";
	4	+import {providers} from 'ng-forward/cjs/testing/providers';
	5	+
	6	+import {ComponentFixture} from 'ng-forward/cjs/testing/test-component-builder';
	7	+
	8	+import {ProfileDataComponent} from "./profile-data.component";
	9	+import {TranslateProfile} from '../../shared/pipes/translate-profile.filter';
	10	+
	11	+let templateHtml = '<profile-data [profile]="ctrl.profile"></profile-data>';
	12	+
	13	+describe('Profile data component', () => {
	14	+
	15	+ let profileMock = <noosfero.Profile>{
	16	+ id: 1,
	17	+ identifier: 'profile-test',
	18	+ type: 'Person'
	19	+ };
	20	+
	21	+ beforeEach(() => {
	22	+
	23	+ angular.mock.module("templates");
	24	+ angular.mock.module("angularMoment");
	25	+
	26	+ providers((provide: any) => {
	27	+ return <any>helpers.provideFilters('TranslateProfile', 'translateFilter')
	28	+ });
	29	+ });
	30	+
	31	+ let buildComponent = (): Promise<ComponentFixture> => {
	32	+ return helpers.quickCreateComponent({
	33	+ directives: [ProfileDataComponent],
	34	+ template: templateHtml,
	35	+ properties: {
	36	+ profile: profileMock
	37	+ }
	38	+ });
	39	+ };
	40	+
	41	+ it('renders profile-data directive', () => {
	42	+ buildComponent().then((fixture: ComponentFixture) => {
	43	+ expect(fixture.debugElement.query('div.table-responsive').length).toEqual(1);
	44	+ expect(fixture.debugElement.query('span.label-info').length).toEqual(1);
	45	+ });
	46	+ });
	47	+
	48	+ it('renders profile-data directive with custom fields', () => {
	49	+ profileMock.additional_data = {
	50	+ 'Address': 'Street A, Number 102'
	51	+ };
	52	+
	53	+ buildComponent().then((fixture: ComponentFixture) => {
	54	+ expect(fixture.debugElement.query('div.profile-custom-fields').length).toEqual(1);
	55	+ });
	56	+ });
	57	+});
...	...
...	...	@@ -22,7 +22,7 @@
22	22	</div>
23	23
24	24	<!-- Custom Fields -->
25		-<div class="main-box clearfix">
	25	+<div class="main-box clearfix profile-custom-fields" ng-if="ctrl.profile.additional_data">
26	26	<header class="main-box-header clearfix">
27	27	<h2>{{"profile.others_info" \| translate}}</h2>
28	28	</header>
...	...
...	...	@@ -31,6 +31,20 @@ namespace noosfero {
31	31	*/
32	32	type: string;
33	33
	34	+ /**
	35	+ * @ngdoc property
	36	+ * @name name
	37	+ * @propertyOf noofero.Profile
	38	+ * @returns {string} The name of Profile (e.g.: "Mr. Janson", etc.)
	39	+ */
34	40	name: string;
	41	+
	42	+ /**
	43	+ * @ngdoc property
	44	+ * @name additional_data
	45	+ * @propertyOf noofero.Profile
	46	+ * @returns {string} A key => value custom fields data of Profile (e.g.: "{'Address':'Street A, Number 102...'}")
	47	+ */
	48	+ additional_data?: any;
35	49	}
36		-}
37	50	\ No newline at end of file
	51	+}
...	...
...	...	@@ -5,9 +5,9 @@ import {Injectable, Inject, Provider, Input, provide, Component} from 'ng-forwar
5	5
6	6
7	7	export var ngforward = {
8		- providers: providers,
9		- TestComponentBuilder: TestComponentBuilder,
10		- ComponentFixture: ComponentFixture
	8	+ providers: providers,
	9	+ TestComponentBuilder: TestComponentBuilder,
	10	+ ComponentFixture: ComponentFixture
11	11	};
12	12
13	13	export interface ComponentFixtureTemplate {
...	...	@@ -21,11 +21,19 @@ export let tcb: TestComponentBuilder = new TestComponentBuilder();
21	21	export function quickCreateComponent({
22	22	providers = [],
23	23	directives = [],
24		- template = '<div></div>'
	24	+ template = '<div></div>',
	25	+ properties = {},
25	26	}): Promise<ComponentFixture> {
26	27
27	28	@Component({ selector: 'test', template, directives, providers })
28		- class Test { }
	29	+ class Test {
	30	+
	31	+ constructor() {
	32	+ Object.keys(properties).forEach((key) => {
	33	+ this[key] = properties[key];
	34	+ });
	35	+ }
	36	+ }
29	37
30	38	return tcb.createAsync(Test);
31	39	}
...	...