First working component and add tests

Refs #344
This commit is contained in:
Will Abson 2016-07-14 12:45:41 +01:00
parent 13820a0f9f
commit c68de6d89d
10 changed files with 348 additions and 35 deletions

View File

@ -0,0 +1,49 @@
/*!
* @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 { Observable } from 'rxjs/Observable';
import {
ProcessList,
SingleProcessList
} from './activiti-process.model.mock';
import { ActivitiProcessService } from './../services/activiti-process-service.service';
import { AlfrescoSettingsService } from 'ng2-alfresco-core';
export class ActivitiProcessServiceMock extends ActivitiProcessService {
getProcessesResult: ProcessList = new SingleProcessList('Example process 1');
getProcessesReject: boolean = false;
getProcessesRejectError: string = 'Error';
constructor(
settings?: AlfrescoSettingsService
) {
super(settings, null);
}
getProcesses() {
if (this.getProcessesReject) {
return Observable.throw(this.getProcessesRejectError);
}
return Observable.create(observer => {
observer.next(this.getProcessesResult);
observer.complete();
}).map((json) => {
return json.data;
});
}
}

View File

@ -0,0 +1,39 @@
/*!
* @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 { ProcessInstance } from '../models/process-instance';
export class ProcessList {
data: ProcessInstance[];
size: number;
start: number;
total: number;
constructor(data?: ProcessInstance[]) {
this.data = data || [];
}
}
export class SingleProcessList extends ProcessList {
constructor(name?: string) {
let instance = new ProcessInstance();
instance.id = '123';
instance.name = name;
super([instance]);
}
}

View File

@ -0,0 +1,37 @@
/*!
* @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 { Observable } from 'rxjs/Rx';
import { EventEmitter } from '@angular/core';
export interface LangChangeEvent {
lang: string;
translations: any;
}
export class TranslationMock {
public onLangChange: EventEmitter<LangChangeEvent> = new EventEmitter<LangChangeEvent>();
public get(key: string|Array<string>, interpolateParams?: Object): Observable<string|any> {
return Observable.of(key);
}
addTranslationFolder() {
}
}

View File

@ -0,0 +1,20 @@
<h1>My Activiti Processes</h1>
<p *ngIf="processInstances && processInstances.length == 0">{{ 'PROCESSLIST.NONE' | translate }}</p>
<table *ngIf="processInstances && processInstances.length" class="mdl-data-table mdl-js-data-table mdl-shadow--2dp full-width">
<caption>{{ 'PROCESSLIST.SUMMARY' | translate:{total: processInstances.length} }}</caption>
<thead>
<tr>
<td class="mdl-data-table__cell--non-numeric">{{ 'PROCESSLIST.COLUMN.NAME' | translate }}</td>
</tr>
</thead>
<tbody>
<tr *ngFor="let instance of processInstances; let idx = index" (click)="onItemClick(instance, $event)">
<td class="mdl-data-table__cell--non-numeric">{{instance.name}}</td>
</tr>
</tbody>
</table>
<p *ngIf="errorMessage">{{ 'PROCESSLIST.ERROR' | translate:{errorMessage: errorMessage} }}</p>

View File

@ -15,19 +15,49 @@
* limitations under the License.
*/
import {describe, expect, it, inject} from '@angular/core/testing';
import { HTTP_PROVIDERS } from '@angular/http';
import {describe, expect, it, inject, beforeEachProviders} from '@angular/core/testing';
import { TestComponentBuilder } from '@angular/compiler/testing';
import {Ng2ActivitiProcesslistComponent} from '../../src/components/ng2-activiti-processlist.component';
import {
AlfrescoSettingsService,
AlfrescoTranslationService
} from 'ng2-alfresco-core';
import { Ng2ActivitiProcesslistComponent } from '../../src/components/ng2-activiti-processlist.component';
import { ActivitiProcessServiceMock } from '../assets/activiti-process-service.mock';
import { TranslationMock } from './../assets/translation.service.mock';
import { ActivitiProcessService } from '../services/activiti-process-service.service';
describe('Basic Example test ng2-activiti-processlist', () => {
describe('ActivitiProcesslistComponent', () => {
it('Test hello world', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
beforeEachProviders(() => {
return [
{ provide: AlfrescoSettingsService },
{ provide: AlfrescoTranslationService, useClass: TranslationMock },
{ provide: ActivitiProcessService, useClass: ActivitiProcessServiceMock },
HTTP_PROVIDERS
];
});
it('should have a valid title', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
return tcb
.createAsync(Ng2ActivitiProcesslistComponent)
.then((fixture) => {
let element = fixture.nativeElement;
expect(element.querySelector('h1')).toBeDefined();
expect(element.getElementsByTagName('h1')[0].innerHTML).toEqual('Hello World Angular 2 ng2-activiti-processlist');
expect(element.getElementsByTagName('h1')[0].innerHTML).toEqual('My Activiti Processes');
});
}));
it('should contain a list of processes', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
return tcb
.createAsync(Ng2ActivitiProcesslistComponent)
.then((fixture) => {
let element = fixture.nativeElement, component = fixture.componentInstance;
component.ngOnInit();
fixture.detectChanges();
expect(element.querySelector('table')).toBeDefined();
expect(element.querySelectorAll('table tbody tr').length).toEqual(1);
});
}));
});

View File

@ -15,10 +15,19 @@
* limitations under the License.
*/
import { Component } from '@angular/core';
import {
Component,
OnInit
} from '@angular/core';
import { AlfrescoPipeTranslate, AlfrescoTranslationService } from 'ng2-alfresco-core';
import { ActivitiProcessService } from '../services/activiti-process-service.service';
import { ProcessInstance } from '../models/process-instance';
declare let __moduleName: string;
@Component({
selector: 'ng-2-activiti-processlist',
moduleId: __moduleName,
selector: 'ng2-activiti-processlist',
styles: [
`
:host h1 {
@ -26,6 +35,36 @@ import { Component } from '@angular/core';
}
`
],
template: `<H1>Hello World Angular 2 ng2-activiti-processlist</H1>`
templateUrl: './ng2-activiti-processlist.component.html',
pipes: [ AlfrescoPipeTranslate ]
})
export class Ng2ActivitiProcesslistComponent {}
export class Ng2ActivitiProcesslistComponent implements OnInit {
errorMessage: string;
processInstances: ProcessInstance[];
constructor (
private processService: ActivitiProcessService,
private translate: AlfrescoTranslationService
) {
if (translate !== null) {
translate.addTranslationFolder('node_modules/ng2-activiti-processlist');
}
}
ngOnInit() {
this.getProcesses();
}
getProcesses() {
this.processService.getProcesses()
.subscribe(
processInstances => this.processInstances = processInstances,
error => this.errorMessage = <any>error);
}
onItemClick(processInstance: ProcessInstance, event: any) {
console.log(processInstance, event);
}
}

View File

@ -0,0 +1,10 @@
{
"PROCESSLIST": {
"NONE": "No active processes were found",
"SUMMARY": "Found {{total}} active process instances",
"ERROR": "An error occurred while loading the processes: {{errorMessage}}",
"COLUMN": {
"NAME": "Name"
}
}
}

View File

@ -0,0 +1,39 @@
/*!
* @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.
*/
export class ProcessInstance {
public businessKey: string;
public ended: any;
public graphicalNotationDefined: boolean;
public id: string;
public name: string;
public processDefinitionCategory: string;
public processDefinitionDeploymentId: string;
public processDefinitionDescription: string;
public processDefinitionId: string;
public processDefinitionKey: string;
public processDefinitionName: string;
public processDefinitionVersion: number;
public startFormDefined: boolean;
public started: string;
public startedBy: any;
public suspended: boolean;
public tenantId: string;
public variables: any;
}

View File

@ -15,37 +15,60 @@
* limitations under the License.
*/
import { ReflectiveInjector } from '@angular/core';
import {
it,
describe,
expect,
beforeEach
beforeEachProviders,
inject
} from '@angular/core/testing';
import {
AlfrescoSettingsService
} from 'ng2-alfresco-core';
Response,
ResponseOptions,
HTTP_PROVIDERS,
XHRBackend
} from '@angular/http';
import { MockBackend, MockConnection } from '@angular/http/testing';
import { AlfrescoSettingsService } from 'ng2-alfresco-core';
import { ActivitiProcessService } from './activiti-process-service.service';
import { HTTP_PROVIDERS } from '@angular/http';
import { ProcessInstance } from '../models/process-instance';
describe('ActivitiProcessService', () => {
let injector;
let service: ActivitiProcessService;
let settingsService: AlfrescoSettingsService;
beforeEach(() => {
injector = ReflectiveInjector.resolveAndCreate([
beforeEachProviders(() => {
return [
HTTP_PROVIDERS,
{ provide: XHRBackend, useClass: MockBackend },
ActivitiProcessService,
AlfrescoSettingsService
]);
settingsService = injector.get(AlfrescoSettingsService);
service = new ActivitiProcessService(settingsService);
];
});
it('should require node to get thumbnail url', () => {
expect(null).toBeNull();
it('should be there', inject([ActivitiProcessService], (processService: ActivitiProcessService) => {
expect(typeof processService.getProcesses).toBe('function');
}));
it('should get process instances',
inject([ActivitiProcessService, XHRBackend], (processService: ActivitiProcessService, mockBackend: MockBackend) => {
mockBackend.connections.subscribe(
(connection: MockConnection) => {
connection.mockRespond(new Response(
new ResponseOptions({
body: {
data: [{
id: 'myprocess:1',
name: 'my process'
}]
}
})));
});
processService.getProcesses().subscribe((instances: ProcessInstance[]) => {
expect(instances.length).toBe(1);
expect(instances[0].id).toBe('myprocess:1');
expect(instances[0].name).toBe('my process');
});
}));
});

View File

@ -18,9 +18,36 @@
import {
AlfrescoSettingsService
} from 'ng2-alfresco-core';
import { ProcessInstance } from '../models/process-instance';
import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
@Injectable()
export class ActivitiProcessService {
constructor(private alfrescoSettingsService: AlfrescoSettingsService) {
private processesUrl = 'http://localhost:9999/activiti-app/app/rest/filter/process-instances';
constructor(private alfrescoSettingsService: AlfrescoSettingsService, private http: Http) {
}
getProcesses(): Observable<ProcessInstance[]> {
return this.http.get(this.processesUrl)
.map(this.extractData)
.catch(this.handleError);
}
private extractData(res: Response) {
let body = res.json();
return body.data || { };
}
private handleError(error: any) {
let errMsg = (error.message) ? error.message :
error.status ? `${error.status} - ${error.statusText}` : 'Server error';
console.error(errMsg); // log to console instead
return Observable.throw(errMsg);
}
}