Add analytics component unit test

ng2-components/ng2-activiti-analytics/src/components/analytics.component.spec.ts

@@ -27,7 +27,7 @@ import { CHART_DIRECTIVES } from 'ng2-charts/ng2-charts';
 
 import { AnalyticsService } from '../services/analytics.service';
 
-import { DebugElement }    from '@angular/core';
+import { DebugElement, SimpleChange }    from '@angular/core';
 
 export const ANALYTICS_DIRECTIVES: any[] = [
     AnalyticsComponent,
@@ -38,13 +38,38 @@ export const ANALYTICS_PROVIDERS: any[] = [
     AnalyticsService
 ];
 
-describe('Show component HTML', () => {
+declare let jasmine: any;
+
+describe('Test ng2-activiti-analytics Report ', () => {
+
+    let reportDefParamStatus = {
+        'id': 2005,
+        'name': 'Fake Task overview status',
+        'created': '2016-10-05T15:39:40.222+0000',
+        'definition': '{ "parameters" :[{"id":"status","name":null,"nameKey":null,"type":"status","value":null,"dependsOn":null}]}'
+    };
+
+    let reportDefParamRangeInterval = {
+        'id': 2006,
+        'name': 'Fake Task overview RangeInterval',
+        'created': '2016-10-05T15:39:40.222+0000',
+        'definition': '{ "parameters" :[{"id":"dateRangeInterval","name":null,"nameKey":null,"type":"dateInterval","value":null,"dependsOn":null}]}'
+    };
+
+    let reportDefParamProcessDef = {
+        'id': 2006,
+        'name': 'Fake Task overview ProcessDefinition',
+        'created': '2016-10-05T15:39:40.222+0000',
+        'definition': '{ "parameters" :[{"id":"processDefinitionId","name":null,"nameKey":null,"type":"processDefinition","value":null,"dependsOn":null}]}'
+    };
 
     let component: any;
     let fixture: ComponentFixture<AnalyticsComponent>;
     let debug: DebugElement;
     let element: HTMLElement;
 
+    let componentHandler: any;
+
     beforeEach(async(() => {
         TestBed.configureTestingModule({
             imports: [
@@ -66,10 +91,130 @@ describe('Show component HTML', () => {
         debug = fixture.debugElement;
         element = fixture.nativeElement;
         fixture.detectChanges();
+        componentHandler = jasmine.createSpyObj('componentHandler', [
+            'upgradeAllRegistered'
+        ]);
+        window['componentHandler'] = componentHandler;
     });
 
-    it('Display component tag base-chart', () => {
+    describe('Rendering tests', () => {
-        expect(true).toBe(true);
+
+        beforeEach(() => {
+            jasmine.Ajax.install();
+        });
+
+        afterEach(() => {
+            jasmine.Ajax.uninstall();
+        });
+
+        it('Should initialize the Report form with a Form Group ', () => {
+            fixture.detectChanges();
+
+            expect(component.reportForm.get('dateRange')).toBeDefined();
+            expect(component.reportForm.get('dateRange').get('startDate')).toBeDefined();
+            expect(component.reportForm.get('dateRange').get('endDate')).toBeDefined();
+        });
+
+        it('Should render a dropdown with all the status when the definition parameter type is \'status\' ', (done) => {
+            fixture.detectChanges();
+
+            component.onSuccess.subscribe(() => {
+                fixture.detectChanges();
+                let dropDown: any = element.querySelector('#select-status');
+                expect(element.querySelector('h1').innerHTML).toEqual('Fake Task overview status');
+                expect(dropDown).toBeDefined();
+                expect(dropDown.length).toEqual(4);
+                expect(dropDown[0].innerHTML).toEqual('Choose One');
+                expect(dropDown[1].innerHTML).toEqual('All');
+                expect(dropDown[2].innerHTML).toEqual('Active');
+                expect(dropDown[3].innerHTML).toEqual('Complete');
+                done();
+            });
+
+            let reportId = 1;
+            let change = new SimpleChange(null, reportId);
+            component.ngOnChanges({ 'reportId': change });
+
+            jasmine.Ajax.requests.mostRecent().respondWith({
+                status: 200,
+                contentType: 'json',
+                responseText: reportDefParamStatus
+            });
+        });
+
+        it('Should render a dropdown with all the RangeInterval when the definition parameter type is \'dateRangeInterval\' ', (done) => {
+            fixture.detectChanges();
+
+            component.onSuccess.subscribe(() => {
+                fixture.detectChanges();
+                let dropDown: any = element.querySelector('#select-dateRangeInterval');
+                expect(dropDown).toBeDefined();
+                expect(dropDown.length).toEqual(5);
+                expect(dropDown[0].innerHTML).toEqual('By hour');
+                expect(dropDown[1].innerHTML).toEqual('By day');
+                expect(dropDown[2].innerHTML).toEqual('By week');
+                expect(dropDown[3].innerHTML).toEqual('By month');
+                expect(dropDown[4].innerHTML).toEqual('By year');
+                done();
+            });
+
+            let reportId = 1;
+            let change = new SimpleChange(null, reportId);
+            component.ngOnChanges({ 'reportId': change });
+
+            jasmine.Ajax.requests.mostRecent().respondWith({
+                status: 200,
+                contentType: 'json',
+                responseText: reportDefParamRangeInterval
+            });
+        });
+
+        it('Should render a dropdown with all the process definition when the definition parameter type is \'processDefinition\' ', (done) => {
+            fixture.detectChanges();
+
+            component.onSuccess.subscribe(() => {
+                fixture.detectChanges();
+                let dropDown: any = element.querySelector('#select-processDefinition');
+                expect(dropDown).toBeDefined();
+                expect(dropDown.length).toEqual(5);
+                expect(dropDown[0].innerHTML).toEqual('By hour');
+                expect(dropDown[1].innerHTML).toEqual('By day');
+                expect(dropDown[2].innerHTML).toEqual('By week');
+                expect(dropDown[3].innerHTML).toEqual('By month');
+                expect(dropDown[4].innerHTML).toEqual('By year');
+                done();
+            });
+
+            let reportId = 1;
+            let change = new SimpleChange(null, reportId);
+            component.ngOnChanges({ 'reportId': change });
+
+            jasmine.Ajax.requests.mostRecent().respondWith({
+                status: 200,
+                contentType: 'json',
+                responseText: reportDefParamProcessDef
+            });
+        });
+
+        it('Should emit an error with a 404 response', (done) => {
+            fixture.detectChanges();
+
+            component.onError.subscribe((err) => {
+                expect(err).toBeDefined();
+                done();
+            });
+
+            let reportId = 1;
+            let change = new SimpleChange(null, reportId);
+            component.ngOnChanges({ 'reportId': change });
+
+            jasmine.Ajax.requests.mostRecent().respondWith({
+                status: 404,
+                contentType: 'json',
+                responseText: []
+            });
+        });
+
     });
 
 });

ng2-components/ng2-activiti-analytics/src/components/analytics.component.ts

@@ -85,7 +85,9 @@ export class AnalyticsComponent implements  OnInit, OnChanges {
         this.analyticsService.getParamsReports(reportId).subscribe(
             (res: ReportModel) => {
                 this.reportDetails = res;
-                this.retriveParameterOptions();
+                if (this.reportDetails.hasParameters()) {
+                    this.retriveParameterOptions(this.reportDetails.definition.parameters);
+                }
                 this.onSuccess.emit(res);
             },
             (err: any) => {
@@ -96,8 +98,8 @@ export class AnalyticsComponent implements  OnInit, OnChanges {
         );
     }
 
-    private retriveParameterOptions() {
+    private retriveParameterOptions(parameters: ReportParameterModel[]) {
-        this.reportDetails.definition.parameters.forEach((param) => {
+        parameters.forEach((param) => {
             this.analyticsService.getParamValuesByType(param.type).subscribe(
                 (opts: ParameterValueModel[]) => {
                     param.options = opts;

ng2-components/ng2-activiti-analytics/src/components/widgets/dropdown/dropdown.widget.html

@@ -1,6 +1,6 @@
 <div class="dropdown-widget">
     <label class="dropdown-widget__label" [attr.for]="field.id">{{field.nameKey | translate}}</label>
-    <select class="dropdown-widget__select"
+    <select [attr.id]="'select-' + field.id" class="dropdown-widget__select"
             [(ngModel)]="field.value" (ngModelChange)="changeValue($event)" required>
         <option *ngIf="showDefaultOption">{{defaultOptionText}}</option>
         <option *ngFor="let opt of field.options" [value]="opt.id">{{opt.label}}</option>

ng2-components/ng2-activiti-analytics/src/components/widgets/dropdown/dropdown.widget.ts

@@ -41,9 +41,4 @@ export class DropdownWidget extends WidgetComponent {
     constructor() {
         super();
     }
-
-    handleError(error: any) {
-        console.error(error);
-    }
-
 }

ng2-components/ng2-activiti-analytics/src/models/report.model.ts

@@ -36,6 +36,10 @@ export class ReportModel {
         }
         this.created = obj && obj.created || null;
     }
+
+    hasParameters() {
+        return (this.definition && this.definition.parameters) ? true : false;
+    }
 }
 
 export class ReportParametersModel {