Add analytics report list unit tests

ng2-components/ng2-activiti-analytics/karma.conf.js

@@ -34,25 +34,19 @@ module.exports = function (config) {
 
       'node_modules/alfresco-js-api/dist/alfresco-js-api.js',
       {pattern: 'node_modules/ng2-translate/**/*.js', included: false, watched: false},
-      {pattern: 'node_modules/ng2-translate/**/*.js.map', included: false, watched: false},
 
       'karma-test-shim.js',
 
       // paths loaded via module imports
-      {pattern: 'dist/**/*.*', included: false, watched: true},
+      {pattern: 'dist/**/*.js', included: false, watched: true},
+      {pattern: 'dist/**/*.html', included: true, served: true, watched: true},
+      {pattern: 'dist/**/*.css', included: true, served: true, watched: true},
 
       // ng2-components
-
-      { pattern: 'node_modules/ng2-alfresco-core/dist/**/*.js', included: false, served: true, watched: false },
-      { pattern: 'node_modules/ng2-activiti-analytics/dist/**/*.js', included: false, served: true, watched: false },
+      { pattern: 'node_modules/ng2-alfresco-core/dist/**/*.*', included: false, served: true, watched: false },
       { pattern: 'node_modules/ng2-charts/**/*.js', included: false, served: true, watched: false },
       { pattern: 'node_modules/moment/**/*.js', included: false, served: true, watched: false },
 
-      // ng2-components
-      {pattern: 'node_modules/ng2-alfresco-core/dist/**/*.*', included: false, served: true, watched: false},
-
-      {pattern: 'node_modules/ng2-charts/**/*.js', included: false, served: true, watched: false},
-
       // paths to support debugging with source maps in dev tools
       {pattern: 'src/**/*.ts', included: false, watched: false},
       {pattern: 'dist/**/*.js.map', included: false, watched: false}

ng2-components/ng2-activiti-analytics/src/components/analytics-report-list.component.html

@@ -1,9 +1,9 @@
 <div class="menu-container">
     <ul class='mdl-list'>
-        <li class="mdl-list__item" (click)="selectReport(report)" *ngFor="let report of reports">
-            <span class="mdl-list__item-primary-content">
+        <li class="mdl-list__item" (click)="selectReport(report)" *ngFor="let report of reports; let idx = index">
+            <span [attr.id]="'report-list-' + idx" class="mdl-list__item-primary-content">
             <i class="material-icons mdl-list__item-icon">assignment</i>
-            {{report.name}}
+            <span class="text">{{report.name}}</span>
             </span>
         </li>
     </ul>

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

@@ -0,0 +1,131 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { ComponentFixture, TestBed, async } from '@angular/core/testing';
+import { CoreModule } from 'ng2-alfresco-core';
+import { AnalyticsReportListComponent } from '../components/analytics-report-list.component';
+import { AnalyticsService } from '../services/analytics.service';
+import { DebugElement }    from '@angular/core';
+
+declare let jasmine: any;
+
+describe('Test ng2-activiti-analytics Report list', () => {
+
+    let reportList = [
+        {'id': 2002, 'name': 'Fake Test Process definition heat map'},
+        {'id': 2003, 'name': 'Fake Test Process definition overview'},
+        {'id': 2004, 'name': 'Fake Test Process instances overview'},
+        {'id': 2005, 'name': 'Fake Test Task overview'},
+        {'id': 2006, 'name': 'Fake Test Task service level agreement'}
+    ];
+
+    let reportSelected = {'id': 2003, 'name': 'Fake Test Process definition overview'};
+
+    let component: any;
+    let fixture: ComponentFixture<AnalyticsReportListComponent>;
+    let debug: DebugElement;
+    let element: HTMLElement;
+
+    beforeEach(async(() => {
+        TestBed.configureTestingModule({
+            imports: [
+                CoreModule
+            ],
+            declarations: [
+                AnalyticsReportListComponent
+            ],
+            providers: [
+                AnalyticsService
+            ]
+        }).compileComponents();
+    }));
+
+    beforeEach(() => {
+        fixture = TestBed.createComponent(AnalyticsReportListComponent);
+        component = fixture.componentInstance;
+        debug = fixture.debugElement;
+        element = fixture.nativeElement;
+    });
+
+    describe('Rendering tests', () => {
+
+        beforeEach(() => {
+            jasmine.Ajax.install();
+        });
+
+        afterEach(() => {
+            jasmine.Ajax.uninstall();
+        });
+
+        it('Report return true with undefined reports', () => {
+            expect(component.isReportsEmpty()).toBeTruthy();
+
+        });
+
+        it('Report return true with an empty reports', () => {
+            component.reports = [];
+            expect(component.isReportsEmpty()).toBeTruthy();
+        });
+
+        it('Report render the report list relative to a single app', (done) => {
+            fixture.detectChanges();
+
+            component.onSuccess.subscribe(() => {
+                fixture.detectChanges();
+                expect(element.querySelector('#report-list-0 > i').innerHTML).toBe('assignment');
+                expect(element.querySelector('#report-list-0 > span').innerHTML).toBe('Fake Test Process definition heat map');
+                expect(element.querySelector('#report-list-1 > span').innerHTML).toBe('Fake Test Process definition overview');
+                expect(element.querySelector('#report-list-2 > span').innerHTML).toBe('Fake Test Process instances overview');
+                expect(element.querySelector('#report-list-3 > span').innerHTML).toBe('Fake Test Task overview');
+                expect(element.querySelector('#report-list-4 > span').innerHTML).toBe('Fake Test Task service level agreement');
+                expect(component.isReportsEmpty()).toBeFalsy();
+                done();
+            });
+
+            jasmine.Ajax.requests.mostRecent().respondWith({
+                status: 200,
+                contentType: 'json',
+                responseText: reportList
+            });
+        });
+
+        it('Report emit an error with a empty response', (done) => {
+            fixture.detectChanges();
+
+            component.onError.subscribe((err) => {
+                expect(err).toBeDefined();
+                done();
+            });
+
+            jasmine.Ajax.requests.mostRecent().respondWith({
+                status: 404,
+                contentType: 'json',
+                responseText: []
+            });
+        });
+
+        it('Should return the current report when one report is selected', () => {
+            component.reportClick.subscribe(() => {
+                expect(component.currentReport).toEqual(reportSelected);
+            });
+
+            component.selectReport(reportSelected);
+        });
+
+    });
+
+});

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

@@ -65,7 +65,9 @@ export class AnalyticsReportListComponent implements  OnInit {
     getReportListByAppId() {
         this.analyticsService.getReportList().subscribe(
             (res: ReportModel[]) => {
-                this.reports = res;
+                res.forEach((report) => {
+                    this.reportObserver.next(report);
+                });
                 this.onSuccess.emit(res);
             },
             (err: any) => {