diff --git a/ng2-components/ng2-activiti-diagrams/assets/Polyline.js b/ng2-components/ng2-activiti-diagrams/assets/Polyline.js new file mode 100644 index 0000000000..9983929cf1 --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/assets/Polyline.js @@ -0,0 +1,372 @@ +/** + * Class to generate polyline + * + * @author Dmitry Farafonov + */ + +var ANCHOR_TYPE= { + main: "main", + middle: "middle", + first: "first", + last: "last" +}; + +function Anchor(uuid, type, x, y) { + this.uuid = uuid; + this.x = x; + this.y = y; + this.type = (type == ANCHOR_TYPE.middle) ? ANCHOR_TYPE.middle : ANCHOR_TYPE.main; +}; +Anchor.prototype = { + uuid: null, + x: 0, + y: 0, + type: ANCHOR_TYPE.main, + isFirst: false, + isLast: false, + ndex: 0, + typeIndex: 0 +}; + +function Polyline(uuid, points, strokeWidth, paper) { + /* Array on coordinates: + * points: [{x: 410, y: 110}, 1 + * {x: 570, y: 110}, 1 2 + * {x: 620, y: 240}, 2 3 + * {x: 750, y: 270}, 3 4 + * {x: 650, y: 370}]; 4 + */ + this.points = points; + + /* + * path for graph + * [["M", x1, y1], ["L", x2, y2], ["C", ax, ay, bx, by, x3, y3], ["L", x3, y3]] + */ + this.path = []; + + this.anchors = []; + + if (strokeWidth) this.strokeWidth = strokeWidth; + + this.paper = paper; + + this.closePath = false; + + this.init(); +}; + +Polyline.prototype = { + id: null, + points: [], + path: [], + anchors: [], + strokeWidth: 1, + radius: 1, + showDetails: false, + paper: null, + element: null, + isDefaultConditionAvailable: false, + closePath: false, + + init: function(points){ + var linesCount = this.getLinesCount(); + if (linesCount < 1) + return; + + this.normalizeCoordinates(); + + // create anchors + + this.pushAnchor(ANCHOR_TYPE.first, this.getLine(0).x1, this.getLine(0).y1); + + for (var i = 1; i < linesCount; i++) + { + var line1 = this.getLine(i-1); + this.pushAnchor(ANCHOR_TYPE.main, line1.x2, line1.y2); + } + + this.pushAnchor(ANCHOR_TYPE.last, this.getLine(linesCount-1).x2, this.getLine(linesCount-1).y2); + + this.rebuildPath(); + }, + + normalizeCoordinates: function(){ + for(var i=0; i < this.points.length; i++){ + this.points[i].x = parseFloat(this.points[i].x); + this.points[i].y = parseFloat(this.points[i].y); + } + }, + + getLinesCount: function(){ + return this.points.length-1; + }, + _getLine: function(i){ + if (this.points.length > i && this.points[i]) { + return {x1: this.points[i].x, y1: this.points[i].y, x2: this.points[i+1].x, y2: this.points[i+1].y}; + } else { + return undefined; + } + }, + getLine: function(i){ + var line = this._getLine(i); + if (line != undefined) { + line.angle = this.getLineAngle(i); + } + return line; + }, + getLineAngle: function(i){ + var line = this._getLine(i); + return Math.atan2(line.y2 - line.y1, line.x2 - line.x1); + }, + getLineLengthX: function(i){ + var line = this.getLine(i); + return (line.x2 - line.x1); + }, + getLineLengthY: function(i){ + var line = this.getLine(i); + return (line.y2 - line.y1); + }, + getLineLength: function(i){ + return Math.sqrt(Math.pow(this.getLineLengthX(i), 2) + Math.pow(this.getLineLengthY(i), 2)); + }, + + getAnchors: function(){ + return this.anchors; + }, + getAnchorsCount: function(type){ + if (!type) + return this.anchors.length; + else { + var count = 0; + for(var i=0; i < this.getAnchorsCount(); i++){ + var anchor = this.anchors[i]; + if (anchor.getType() == type) { + count++; + } + } + return count; + } + }, + + pushAnchor: function(type, x, y, index){ + if (type == ANCHOR_TYPE.first) { + index = 0; + typeIndex = 0; + } else if (type == ANCHOR_TYPE.last) { + index = this.getAnchorsCount(); + typeIndex = 0; + } else if (!index) { + index = this.anchors.length; + } else { + for(var i=0; i < this.getAnchorsCount(); i++){ + var anchor = this.anchors[i]; + if (anchor.index > index) { + anchor.index++; + anchor.typeIndex++; + } + } + } + + var anchor = new Anchor(this.id, ANCHOR_TYPE.main, x, y, index, typeIndex); + + this.anchors.push(anchor); + }, + + getAnchor: function(position){ + return this.anchors[position]; + }, + + getAnchorByType: function(type, position){ + if (type == ANCHOR_TYPE.first) + return this.anchors[0]; + if (type == ANCHOR_TYPE.last) + return this.anchors[this.getAnchorsCount()-1]; + + for(var i=0; i < this.getAnchorsCount(); i++){ + var anchor = this.anchors[i]; + if (anchor.type == type) { + if( position == anchor.position) + return anchor; + } + } + return null; + }, + + addNewPoint: function(position, x, y){ + // + for(var i = 0; i < this.getLinesCount(); i++){ + var line = this.getLine(i); + if (x > line.x1 && x < line.x2 && y > line.y1 && y < line.y2) { + this.points.splice(i+1,0,{x: x, y: y}); + break; + } + } + + this.rebuildPath(); + }, + + rebuildPath: function(){ + var path = []; + + for(var i = 0; i < this.getAnchorsCount(); i++){ + var anchor = this.getAnchor(i); + + var pathType = ""; + if (i == 0) + pathType = "M"; + else + pathType = "L"; + + // TODO: save previous points and calculate new path just if points are updated, and then save currents values as previous + + var targetX = anchor.x, targetY = anchor.y; + if (i>0 && i < this.getAnchorsCount()-1) { + // get new x,y + var cx = anchor.x, cy = anchor.y; + + // pivot point of prev line + var AO = this.getLineLength(i-1); + if (AO < this.radius) { + AO = this.radius; + } + + this.isDefaultConditionAvailable = (this.isDefaultConditionAvailable || (i == 1 && AO > 10)); + + var ED = this.getLineLengthY(i-1) * this.radius / AO; + var OD = this.getLineLengthX(i-1) * this.radius / AO; + targetX = anchor.x - OD; + targetY = anchor.y - ED; + + if (AO < 2*this.radius && i>1) { + targetX = anchor.x - this.getLineLengthX(i-1)/2; + targetY = anchor.y - this.getLineLengthY(i-1)/2;; + } + + // pivot point of next line + var AO = this.getLineLength(i); + if (AO < this.radius) { + AO = this.radius; + } + var ED = this.getLineLengthY(i) * this.radius / AO; + var OD = this.getLineLengthX(i) * this.radius / AO; + var nextSrcX = anchor.x + OD; + var nextSrcY = anchor.y + ED; + + if (AO < 2*this.radius && i 10)); + } + + // anti smoothing + if (this.strokeWidth%2 == 1) { + targetX += 0.5; + targetY += 0.5; + } + + path.push([pathType, targetX, targetY]); + + if (i>0 && i < this.getAnchorsCount()-1) { + path.push(["C", ax, ay, bx, by, zx, zy]); + } + } + + if (this.closePath) + { + path.push(["Z"]); + } + + this.path = path; + }, + + transform: function(transformation) + { + this.element.transform(transformation); + }, + attr: function(attrs) + { + // TODO: foreach and set each + this.element.attr(attrs); + } +}; + +function Polygone(points, strokeWidth) { + /* Array on coordinates: + * points: [{x: 410, y: 110}, 1 + * {x: 570, y: 110}, 1 2 + * {x: 620, y: 240}, 2 3 + * {x: 750, y: 270}, 3 4 + * {x: 650, y: 370}]; 4 + */ + this.points = points; + + /* + * path for graph + * [["M", x1, y1], ["L", x2, y2], ["C", ax, ay, bx, by, x3, y3], ["L", x3, y3]] + */ + this.path = []; + + this.anchors = []; + + if (strokeWidth) this.strokeWidth = strokeWidth; + + this.closePath = true; + this.init(); +}; + + +/* + * Poligone is inherited from Poliline: draws closedPath of polyline + */ + +var Foo = function () { }; +Foo.prototype = Polyline.prototype; + +Polygone.prototype = new Foo(); + +Polygone.prototype.rebuildPath = function(){ + var path = []; + for(var i = 0; i < this.getAnchorsCount(); i++){ + var anchor = this.getAnchor(i); + + var pathType = ""; + if (i == 0) + pathType = "M"; + else + pathType = "L"; + + var targetX = anchor.x, targetY = anchor.y; + + // anti smoothing + if (this.strokeWidth%2 == 1) { + targetX += 0.5; + targetY += 0.5; + } + + path.push([pathType, targetX, targetY]); + } + if (this.closePath) + path.push(["Z"]); + + this.path = path; +}; \ No newline at end of file diff --git a/ng2-components/ng2-activiti-diagrams/karma.conf.js b/ng2-components/ng2-activiti-diagrams/karma.conf.js index 5b088f0af2..2806957c37 100644 --- a/ng2-components/ng2-activiti-diagrams/karma.conf.js +++ b/ng2-components/ng2-activiti-diagrams/karma.conf.js @@ -34,6 +34,7 @@ module.exports = function (config) { 'node_modules/alfresco-js-api/dist/alfresco-js-api.js', 'node_modules/raphael/raphael.min.js', + 'assets/Polyline.js', {pattern: 'node_modules/ng2-translate/**/*.js', included: false, watched: false}, 'karma-test-shim.js', diff --git a/ng2-components/ng2-activiti-diagrams/src/assets/analyticsComponent.mock.ts b/ng2-components/ng2-activiti-diagrams/src/assets/analyticsComponent.mock.ts deleted file mode 100644 index 79b185cf0f..0000000000 --- a/ng2-components/ng2-activiti-diagrams/src/assets/analyticsComponent.mock.ts +++ /dev/null @@ -1,97 +0,0 @@ -/*! - * @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 var chartProcessDefOverview = { - 'elements': [{ - 'id': 'id1585876275153', - 'type': 'table', - 'rows': [ - ['__KEY_REPORTING.DEFAULT-REPORTS.PROCESS-DEFINITION-OVERVIEW.GENERAL-TABLE-TOTAL-PROCESS-DEFINITIONS', '9'], - ['__KEY_REPORTING.DEFAULT-REPORTS.PROCESS-DEFINITION-OVERVIEW.GENERAL-TABLE-TOTAL-PROCESS-INSTANCES', '41'], - ['__KEY_REPORTING.DEFAULT-REPORTS.PROCESS-DEFINITION-OVERVIEW.GENERAL-TABLE-ACTIVE-PROCESS-INSTANCES', '3'], - ['__KEY_REPORTING.DEFAULT-REPORTS.PROCESS-DEFINITION-OVERVIEW.GENERAL-TABLE-COMPLETED-PROCESS-INSTANCES', '38'] - ] - }, { - 'id': 'id1585876413072', - 'type': 'pieChart', - 'title': 'Total process instances overview', - 'titleKey': 'REPORTING.DEFAULT-REPORTS.PROCESS-DEFINITION-OVERVIEW.PROC-INST-CHART-TITLE', - 'values': [{ - 'key': 'Second Process', - 'y': 4, - 'keyAndValue': ['Second Process', '4'] - }, { - 'key': 'Simple process', - 'y': 30, - 'keyAndValue': ['Simple process', '30'] - }, { - 'key': 'Third Process', - 'y': 7, - 'keyAndValue': ['Third Process', '7'] - }] - }, { - 'id': 'id1585877659181', - 'type': 'table', - 'title': 'Process definition details', - 'titleKey': 'REPORTING.DEFAULT-REPORTS.PROCESS-DEFINITION-OVERVIEW.DETAIL-TABLE', - 'columnNames': ['Process definition', 'Total', 'Active', 'Completed'], - 'columnNameKeys': ['REPORTING.DEFAULT-REPORTS.PROCESS-DEFINITION-OVERVIEW.DETAIL-TABLE-PROCESS', - 'REPORTING.DEFAULT-REPORTS.PROCESS-DEFINITION-OVERVIEW.DETAIL-TABLE-TOTAL', - 'REPORTING.DEFAULT-REPORTS.PROCESS-DEFINITION-OVERVIEW.DETAIL-TABLE-ACTIVE', - 'REPORTING.DEFAULT-REPORTS.PROCESS-DEFINITION-OVERVIEW.DETAIL-TABLE-COMPLETED'], - 'columnsCentered': [false, false, false, false], - 'rows': [ - ['Second Process', '4', '0', '4'], - ['Simple process', '30', '3', '27'], - ['Third Process', '7', '0', '7'] - ] - }] -}; - -export var chartTaskOverview = { - 'elements': [{ - 'id': 'id792351752194', - 'type': 'barChart', - 'title': 'title', - 'titleKey': 'REPORTING.DEFAULT-REPORTS.TASK-OVERVIEW.TASK-HISTOGRAM-TITLE', - 'values': [{ - 'key': 'series1', - 'values': [['2016-09-30T00:00:00.000+0000', 3], ['2016-10-04T00:00:00.000+0000', 1]] - }], - 'xAxisType': 'date_month', - 'yAxisType': 'count' - }, { - 'id': 'id792349721129', - 'type': 'masterDetailTable', - 'title': 'Detailed task statistics', - 'titleKey': 'REPORTING.DEFAULT-REPORTS.TASK-OVERVIEW.DETAILED-TASK-STATS-TITLE', - 'columnNames': ['Task', 'Count', 'Sum', 'Min duration', 'Max duration', 'Average duration', 'Stddev duration'], - 'columnNameKeys': [ - 'REPORTING.DEFAULT-REPORTS.TASK-OVERVIEW.DETAILED-TASK-STATS-TASK', - 'REPORTING.DEFAULT-REPORTS.TASK-OVERVIEW.COUNT', - 'REPORTING.DEFAULT-REPORTS.TASK-OVERVIEW.SUM', - 'REPORTING.DEFAULT-REPORTS.TASK-OVERVIEW.MIN-DURATION', - 'REPORTING.DEFAULT-REPORTS.TASK-OVERVIEW.MAX-DURATION', - 'REPORTING.DEFAULT-REPORTS.TASK-OVERVIEW.AVERAGE', - 'REPORTING.DEFAULT-REPORTS.TASK-OVERVIEW.STDDE'], - 'columnsCentered': [false, false, false, false], - 'rows': [ - ['fake 1 user task', '1', '2.0', '3.0', '4.0', '5.0', '6.0'], - ['fake 2 user task', '1', '2.0', '3.0', '4.0', '5.0', '6.0'] - ] - }] -}; diff --git a/ng2-components/ng2-activiti-diagrams/src/assets/analyticsParamsReportComponent.mock.ts b/ng2-components/ng2-activiti-diagrams/src/assets/analyticsParamsReportComponent.mock.ts deleted file mode 100644 index 626996af3b..0000000000 --- a/ng2-components/ng2-activiti-diagrams/src/assets/analyticsParamsReportComponent.mock.ts +++ /dev/null @@ -1,127 +0,0 @@ -/*! - * @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 { ReportParameterDetailsModel } from '../models/report.model'; - -export var 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}]}' -}; - -export var reportDefParamNumber = { - 'id': 2005, - 'name': 'Fake Process instances overview', - 'created': '2016-10-05T15:39:40.222+0000', - 'definition': '{ "parameters"' + - ' :[{"id":"slowProcessInstanceInteger","name":null,"nameKey":null,"type":"integer","value":10,"dependsOn":null}]}' -}; - -export var reportDefParamDuration = { - 'id': 2005, - 'name': 'Fake Task service level agreement', - 'created': '2016-10-05T15:39:40.222+0000', - 'definition': '{ "parameters"' + - ' :[{"id":"duration","name":null,"nameKey":null,"type":"duration","value":null,"dependsOn":null}]}' -}; - -export var reportDefParamCheck = { - 'id': 2005, - 'name': 'Fake Task service level agreement', - 'created': '2016-10-05T15:39:40.222+0000', - 'definition': '{ "parameters"' + - ' :[{"id":"typeFiltering","name":null,"nameKey":null,"type":"boolean","value":true,"dependsOn":null}]}' -}; - -export var reportDefParamDateRange = { - 'id': 2005, - 'name': 'Fake Process instances overview', - 'created': '2016-10-05T15:39:40.222+0000', - 'definition': '{ "parameters" :[{"id":"dateRange","name":null,"nameKey":null,"type":"dateRange","value":null,"dependsOn":null}]}' -}; - -export var 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}]}' -}; - -export var 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}]}' -}; - -export var reportDefParamProcessDefOptions = { - 'size': 4, 'total': 4, 'start': 0, 'data': [ - { - 'id': 'FakeProcessTest 1:1:1', - 'name': 'Fake Process Test 1 Name ', - 'version': 1 - }, - { - 'id': 'FakeProcessTest 1:2:1', - 'name': 'Fake Process Test 1 Name ', - 'version': 2 - }, - { - 'id': 'FakeProcessTest 2:1:1', - 'name': 'Fake Process Test 2 Name ', - 'version': 1 - }, - { - 'id': 'FakeProcessTest 3:1:1', - 'name': 'Fake Process Test 3 Name ', - 'version': 1 - } - ] -}; - -export var reportDefParamProcessDefOptionsApp = { - 'size': 2, 'total': 2, 'start': 2, 'data': [ - { - 'id': 'FakeProcessTest 1:1:1', - 'name': 'Fake Process Test 1 Name ', - 'version': 1 - }, - { - 'id': 'FakeProcessTest 1:2:1', - 'name': 'Fake Process Test 1 Name ', - 'version': 2 - } - ] -}; - -export var reportDefParamTask = { - 'id': 2006, - 'name': 'Fake Task service level agreement', - 'created': '2016-10-05T15:39:40.222+0000', - 'definition': '{ "parameters" :[{"id":"taskName","name":null,"nameKey":null,"type":"task","value":null,"dependsOn":"processDefinitionId"}]}' -}; - -export var reportDefParamTaskOptions = ['Fake task name 1', 'Fake task name 2']; - -export var fieldProcessDef = new ReportParameterDetailsModel( - { - id: 'processDefinitionId', - type: 'processDefinition', - value: 'fake-process-name:1:15027' - } -); diff --git a/ng2-components/ng2-activiti-diagrams/src/assets/diagramActivities.mock.ts b/ng2-components/ng2-activiti-diagrams/src/assets/diagramActivities.mock.ts new file mode 100644 index 0000000000..ec7a3b31aa --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/src/assets/diagramActivities.mock.ts @@ -0,0 +1,166 @@ +/*! + * @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 let userTask = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + name: 'Fake User task', + type: 'UserTask', + width: 82, + height: 67, + x: 75.56890135999998, + y: 30, + properties: [{}] +}; + +export let manualTask = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + name: 'Fake Manual task', + type: 'ManualTask', + width: 82, + height: 67, + x: 75.56890135999998, + y: 30, + properties: [{}] +}; + +export let serviceTask = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + name: 'Fake Service task', + type: 'ServiceTask', + width: 82, + height: 67, + x: 75.56890135999998, + y: 30, + properties: [{}] +}; + +export let receiveTask = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + name: 'Fake Receive task', + type: 'ReceiveTask', + width: 82, + height: 67, + x: 75.56890135999998, + y: 30, + properties: [{}] +}; + +export let scriptTask = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + name: 'Fake Script task', + type: 'ScriptTask', + width: 82, + height: 67, + x: 75.56890135999998, + y: 30, + properties: [{}] +}; + +export let businessRuleTask = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + name: 'Fake BusinessRule task', + type: 'BusinessRuleTask', + width: 82, + height: 67, + x: 75.56890135999998, + y: 30, + properties: [{}] +}; + +export let mailTask = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + name: 'Fake Mail task', + type: 'ServiceTask', + width: 82, + height: 67, + x: 75.56890135999998, + y: 30, + properties: [{}], + taskType: 'mail' +}; + +export let camelTask = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + name: 'Fake Camel task', + type: 'ServiceTask', + width: 82, + height: 67, + x: 75.56890135999998, + y: 30, + properties: [{}], + taskType: 'camel' +}; + +export let restCallTask = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + name: 'Fake Rest Call task', + type: 'ServiceTask', + width: 82, + height: 67, + x: 75.56890135999998, + y: 30, + properties: [{}], + taskType: 'rest_call' +}; + +export let muleTask = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + name: 'Fake Mule task', + type: 'ServiceTask', + width: 82, + height: 67, + x: 75.56890135999998, + y: 30, + properties: [{}], + taskType: 'mule' +}; + +export let alfrescoPublishTask = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + name: 'Fake Alfresco Publish task', + type: 'ServiceTask', + width: 82, + height: 67, + x: 75.56890135999998, + y: 30, + properties: [{}], + taskType: 'alfresco_publish' +}; + +export let googleDrivePublishTask = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + name: 'Fake Google Drive Publish task', + type: 'ServiceTask', + width: 82, + height: 67, + x: 75.56890135999998, + y: 30, + properties: [{}], + taskType: 'google_drive_publish' +}; + +export let boxPublishTask = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + name: 'Fake Box Publish task', + type: 'ServiceTask', + width: 82, + height: 67, + x: 75.56890135999998, + y: 30, + properties: [{}], + taskType: 'box_publish' +}; diff --git a/ng2-components/ng2-activiti-diagrams/src/assets/diagramBoundary.mock.ts b/ng2-components/ng2-activiti-diagrams/src/assets/diagramBoundary.mock.ts new file mode 100644 index 0000000000..daaf33a467 --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/src/assets/diagramBoundary.mock.ts @@ -0,0 +1,60 @@ +/*! + * @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 let boundaryTimeEvent = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'BoundaryEvent', + width: 31, + height: 31, + x: 40, + y: 30, + properties: [{}], + eventDefinition: {type: 'timer'} +}; + +export let boundaryErrorEvent = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'BoundaryEvent', + width: 31, + height: 31, + x: 40, + y: 30, + properties: [{}], + eventDefinition: {type: 'error'} +}; + +export let boundarySignalEvent = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'BoundaryEvent', + width: 31, + height: 31, + x: 40, + y: 30, + properties: [{}], + eventDefinition: {type: 'signal'} +}; + +export let boundaryMessageEvent = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'BoundaryEvent', + width: 31, + height: 31, + x: 40, + y: 30, + properties: [{}], + eventDefinition: {type: 'message'} +}; diff --git a/ng2-components/ng2-activiti-diagrams/src/assets/diagramEvents.mock.ts b/ng2-components/ng2-activiti-diagrams/src/assets/diagramEvents.mock.ts new file mode 100644 index 0000000000..404208d178 --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/src/assets/diagramEvents.mock.ts @@ -0,0 +1,91 @@ +/*! + * @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 let startEvent = { + id: 'startEvent1', + type: 'StartEvent', + width: 30, + height: 30, + x: 15, + y: 48.5, + properties: [{}] +}; + +export let startTimeEvent = { + id: 'startEvent1', + type: 'StartEvent', + width: 30, + height: 30, + x: 15, + y: 48.5, + eventDefinition: {type: 'timer'}, + properties: [{}] +}; + +export let startSignalEvent = { + id: 'startEvent1', + type: 'StartEvent', + width: 30, + height: 30, + x: 15, + y: 48.5, + eventDefinition: {type: 'signal'}, + properties: [{}] +}; + +export let startMessageEvent = { + id: 'startEvent1', + type: 'StartEvent', + width: 30, + height: 30, + x: 15, + y: 48.5, + eventDefinition: {type: 'message'}, + properties: [{}] +}; + +export let startErrorEvent = { + id: 'startEvent1', + type: 'StartEvent', + width: 30, + height: 30, + x: 15, + y: 48.5, + eventDefinition: {type: 'error'}, + properties: [{}] +}; + +export let endEvent = { + id: 'sid-CED2A8DB-47E2-4057-A7B8-3ABBE5CE795E', + type: 'EndEvent', + width: 28, + height: 28, + x: 15, + y: 48.5, + properties: [{}] +}; + +export let endErrorEvent = { + id: 'sid-CED2A8DB-47E2-4057-A7B8-3ABBE5CE795E', + type: 'EndEvent', + width: 28, + height: 28, + x: 15, + y: 48.5, + eventDefinition: {type: 'error'}, + properties: [{}] +}; diff --git a/ng2-components/ng2-activiti-diagrams/src/assets/diagramFlows.mock.ts b/ng2-components/ng2-activiti-diagrams/src/assets/diagramFlows.mock.ts new file mode 100644 index 0000000000..68a3b32b68 --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/src/assets/diagramFlows.mock.ts @@ -0,0 +1,24 @@ +/*! + * @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 let flow = { + id: 'sid-5BA99724-A3BD-4F8E-B69F-222F9FF66335', + sourceRef: 'startEvent1', + targetRef: 'sid-811B9223-E72E-4991-AAA5-4E1A01095D08', + type: 'sequenceFlow', + waypoints: [{x: 165, y: 122}, {x: 210, y: 122}] +}; diff --git a/ng2-components/ng2-activiti-diagrams/src/assets/diagramGateways.mock.ts b/ng2-components/ng2-activiti-diagrams/src/assets/diagramGateways.mock.ts new file mode 100644 index 0000000000..85163c3d4f --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/src/assets/diagramGateways.mock.ts @@ -0,0 +1,56 @@ +/*! + * @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 let exclusiveGatway = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'ExclusiveGateway', + width: 40, + height: 40, + x: 40, + y: 30, + properties: [{}] +}; + +export let inclusiveGatway = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'InclusiveGateway', + width: 40, + height: 40, + x: 40, + y: 30, + properties: [{}] +}; + +export let parallelGatway = { + id: 'sid-14EE23CE-0731-4E23-80F3-C557DA2A0CFC', + type: 'ParallelGateway', + width: 40, + height: 40, + x: 40, + y: 30, + properties: [{}] +}; + +export let eventGatway = { + id: 'sid-14EE23CE-0731-4E23-80F3-C557DA2A0CFC', + type: 'EventGateway', + width: 40, + height: 40, + x: 40, + y: 30, + properties: [{}] +}; diff --git a/ng2-components/ng2-activiti-diagrams/src/assets/diagramIntermediate.mock.ts b/ng2-components/ng2-activiti-diagrams/src/assets/diagramIntermediate.mock.ts new file mode 100644 index 0000000000..600156fd01 --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/src/assets/diagramIntermediate.mock.ts @@ -0,0 +1,60 @@ +/*! + * @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 let intermediateCatchingTimeEvent = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'IntermediateCatchEvent', + width: 31, + height: 31, + x: 40, + y: 30, + properties: [{}], + eventDefinition: {type: 'timer'} +}; + +export let intermediateCatchingErrorEvent = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'IntermediateCatchEvent', + width: 31, + height: 31, + x: 40, + y: 30, + properties: [{}], + eventDefinition: {type: 'error'} +}; + +export let intermediateCatchingSignalEvent = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'IntermediateCatchEvent', + width: 31, + height: 31, + x: 40, + y: 30, + properties: [{}], + eventDefinition: {type: 'signal'} +}; + +export let intermediateCatchingMessageEvent = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'IntermediateCatchEvent', + width: 31, + height: 31, + x: 40, + y: 30, + properties: [{}], + eventDefinition: {type: 'message'} +}; diff --git a/ng2-components/ng2-activiti-diagrams/src/assets/diagramStructural.mock.ts b/ng2-components/ng2-activiti-diagrams/src/assets/diagramStructural.mock.ts new file mode 100644 index 0000000000..4dace0d7e3 --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/src/assets/diagramStructural.mock.ts @@ -0,0 +1,36 @@ +/*! + * @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 let subProcess = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'SubProcess', + width: 300, + height: 200, + x: 40, + y: 30, + properties: [{}] +}; + +export let eventSubProcess = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'EventSubProcess', + width: 300, + height: 200, + x: 40, + y: 30, + properties: [{}] +}; diff --git a/ng2-components/ng2-activiti-diagrams/src/assets/diagramSwimlanes.mock.ts b/ng2-components/ng2-activiti-diagrams/src/assets/diagramSwimlanes.mock.ts new file mode 100644 index 0000000000..e9d41c2131 --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/src/assets/diagramSwimlanes.mock.ts @@ -0,0 +1,44 @@ +/*! + * @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 let pool = { + id: 'sid-0FF10DA3-E2BD-4E6A-9013-6D66FC8A4716', + name: 'Activiti', + width: 600, + height: 500, + x: 60, + y: 45, + properties: [{}] +}; + +export let poolLanes = { + id: 'sid-0FF10DA3-E2BD-4E6A-9013-6D66FC8A4716', + name: 'Activiti', + width: 600, + height: 500, + x: 60, + y: 45, + lanes: [{ + id: 'sid-332204AB-D0F8-44CD-87B3-BF9DF59FF8AB', + name: 'Beckend', + width: 570, + height: 250, + x: 90, + y: 45 + }], + properties: [{}] +}; diff --git a/ng2-components/ng2-activiti-diagrams/src/assets/diagramThrow.mock.ts b/ng2-components/ng2-activiti-diagrams/src/assets/diagramThrow.mock.ts new file mode 100644 index 0000000000..f854de07f1 --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/src/assets/diagramThrow.mock.ts @@ -0,0 +1,60 @@ +/*! + * @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 let throwTimeEvent = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'ThrowEvent', + width: 31, + height: 31, + x: 40, + y: 30, + properties: [{}], + eventDefinition: {type: 'timer'} +}; + +export let throwErrorEvent = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'ThrowEvent', + width: 31, + height: 31, + x: 40, + y: 30, + properties: [{}], + eventDefinition: {type: 'error'} +}; + +export let throwSignalEvent = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'ThrowEvent', + width: 31, + height: 31, + x: 40, + y: 30, + properties: [{}], + eventDefinition: {type: 'signal'} +}; + +export let throwMessageEvent = { + id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', + type: 'ThrowEvent', + width: 31, + height: 31, + x: 40, + y: 30, + properties: [{}], + eventDefinition: {type: 'message'} +}; diff --git a/ng2-components/ng2-activiti-diagrams/src/components/diagram.component.spec.ts b/ng2-components/ng2-activiti-diagrams/src/components/diagram.component.spec.ts index f436e82842..67a9b0ebcc 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/diagram.component.spec.ts +++ b/ng2-components/ng2-activiti-diagrams/src/components/diagram.component.spec.ts @@ -24,6 +24,15 @@ import { DIAGRAM_DIRECTIVES, DIAGRAM_PROVIDERS } from './index'; import { RAPHAEL_DIRECTIVES, RAPHAEL_PROVIDERS } from './raphael/index'; import { DiagramComponent } from './index'; import { DebugElement } from '@angular/core'; +import * as diagramsEventsMock from '../assets/diagramEvents.mock'; +import * as diagramsActivitiesMock from '../assets/diagramActivities.mock'; +import * as diagramsGatewaysMock from '../assets/diagramGateways.mock'; +import * as intermediateCatchingMock from '../assets/diagramIntermediate.mock'; +import * as boundaryEventMock from '../assets/diagramBoundary.mock'; +import * as throwEventMock from '../assets/diagramThrow.mock'; +import * as structuralMock from '../assets/diagramStructural.mock'; +import * as swimLanesMock from '../assets/diagramSwimlanes.mock'; +import * as flowsMock from '../assets/diagramFlows.mock'; declare let jasmine: any; @@ -64,40 +73,50 @@ describe('Test ng2-activiti-diagrams ', () => { window['componentHandler'] = componentHandler; }); - describe('Diagrams component ', () => { + describe('Diagrams component Events: ', () => { beforeEach(() => { jasmine.Ajax.install(); + component.processDefinitionId = 'fakeprocess:24:38399'; + component.metricPercentages = {startEvent: 0}; }); afterEach(() => { jasmine.Ajax.uninstall(); }); - it('Should render the StartEvent', async(() => { - component.processDefinitionId = 'fakeprocess:24:38399'; - component.metricPercentages = {startEvent: 0}; + it('Should render the Start Event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let event: any = element.querySelector('diagram-start-event > diagram-event > raphael-circle'); + expect(event).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsEventsMock.startEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + it('Should render the Start Timer Event', async(() => { component.onSuccess.subscribe((res) => { fixture.detectChanges(); fixture.whenStable().then(() => { expect(res).toBeDefined(); - let startEvent: any = element.querySelector('diagram-start-event'); - expect(startEvent).toBeDefined(); - let raphaelCircle: any = element.querySelector('raphael-circle'); - expect(raphaelCircle).toBeDefined(); + let event: any = element.querySelector('diagram-start-event > diagram-event > raphael-circle'); + expect(event).not.toBeNull(); + + let iconEvent: any = element.querySelector('diagram-start-event > diagram-event >' + + ' diagram-container-icon-event > div > div > diagram-icon-timer > raphael-icon-timer'); + expect(iconEvent).not.toBeNull(); }); }); component.ngOnChanges(); - let startEvent = { - id: 'startEvent1', - type: 'StartEvent', - width: 30, - height: 30, - x: 15, - y: 48.5, - properties: [{}] - }; - let resp = {elements : [startEvent] }; + let resp = {elements: [diagramsEventsMock.startTimeEvent]}; jasmine.Ajax.requests.mostRecent().respondWith({ status: 200, @@ -105,5 +124,1129 @@ describe('Test ng2-activiti-diagrams ', () => { responseText: resp }); })); + + it('Should render the Start Signal Event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).toBeDefined(); + let event: any = element.querySelector('diagram-start-event > diagram-event > raphael-circle'); + expect(event).not.toBeNull(); + + let iconEvent: any = element.querySelector('diagram-start-event > diagram-event >' + + ' diagram-container-icon-event > div > div > diagram-icon-signal > raphael-icon-signal'); + expect(iconEvent).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsEventsMock.startSignalEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Start Message Event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).toBeDefined(); + let event: any = element.querySelector('diagram-start-event > diagram-event > raphael-circle'); + expect(event).not.toBeNull(); + + let iconEvent: any = element.querySelector('diagram-start-event > diagram-event >' + + ' diagram-container-icon-event > div > div > diagram-icon-message > raphael-icon-message'); + expect(iconEvent).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsEventsMock.startMessageEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Start Error Event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).toBeDefined(); + let event: any = element.querySelector('diagram-start-event > diagram-event > raphael-circle'); + expect(event).not.toBeNull(); + + let iconEvent: any = element.querySelector('diagram-start-event > diagram-event >' + + ' diagram-container-icon-event > div > div > diagram-icon-error > raphael-icon-error'); + expect(iconEvent).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsEventsMock.startErrorEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the End Event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).toBeDefined(); + let event: any = element.querySelector('diagram-end-event > diagram-event > raphael-circle'); + expect(event).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsEventsMock.endEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the End Error Event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).toBeDefined(); + let event: any = element.querySelector('diagram-end-event > diagram-event > raphael-circle'); + expect(event).not.toBeNull(); + + let iconEvent: any = element.querySelector('diagram-end-event > diagram-event >' + + ' diagram-container-icon-event > div > div > diagram-icon-error > raphael-icon-error'); + expect(iconEvent).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsEventsMock.endErrorEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + }); + + describe('Diagrams component Activities: ', () => { + beforeEach(() => { + jasmine.Ajax.install(); + component.processDefinitionId = 'fakeprocess:24:38399'; + component.metricPercentages = {startEvent: 0}; + }); + + afterEach(() => { + jasmine.Ajax.uninstall(); + }); + + it('Should render the User Task', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let task: any = element.querySelector('diagram-user-task > diagram-task > raphael-rect'); + expect(task).not.toBeNull(); + + let taskText: any = element.querySelector('diagram-user-task > diagram-task > raphael-text'); + expect(taskText).not.toBeNull(); + expect(taskText.attributes[1].value).toEqual('Fake User task'); + + let iconTask: any = element.querySelector('diagram-user-task > diagram-icon-user-task > raphael-icon-user'); + expect(iconTask).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsActivitiesMock.userTask]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Manual Task', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let task: any = element.querySelector('diagram-manual-task > diagram-task > raphael-rect'); + expect(task).not.toBeNull(); + + let taskText: any = element.querySelector('diagram-manual-task > diagram-task > raphael-text'); + expect(taskText).not.toBeNull(); + expect(taskText.attributes[1].value).toEqual('Fake Manual task'); + + let iconTask: any = element.querySelector('diagram-manual-task > diagram-icon-manual-task > raphael-icon-manual'); + expect(iconTask).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsActivitiesMock.manualTask]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Service Task', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let task: any = element.querySelector('diagram-service-task > diagram-task > raphael-rect'); + expect(task).not.toBeNull(); + + let taskText: any = element.querySelector('diagram-service-task > diagram-task > raphael-text'); + expect(taskText).not.toBeNull(); + expect(taskText.attributes[1].value).toEqual('Fake Service task'); + + let iconTask: any = element.querySelector('diagram-service-task > diagram-icon-service-task > raphael-icon-service'); + expect(iconTask).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsActivitiesMock.serviceTask]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Service Mail Task', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(true).toBe(true); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsActivitiesMock.mailTask]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Service Camel Task', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let task: any = element.querySelector('diagram-camel-task > diagram-task > raphael-rect'); + expect(task).not.toBeNull(); + + let taskText: any = element.querySelector('diagram-camel-task > diagram-task > raphael-text'); + expect(taskText).not.toBeNull(); + expect(taskText.attributes[1].value).toEqual('Fake Camel task'); + + let iconTask: any = element.querySelector('diagram-camel-task > diagram-icon-camel-task > raphael-icon-camel'); + expect(iconTask).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsActivitiesMock.camelTask]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Service Mule Task', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let task: any = element.querySelector('diagram-mule-task > diagram-task > raphael-rect'); + expect(task).not.toBeNull(); + + let taskText: any = element.querySelector('diagram-mule-task > diagram-task > raphael-text'); + expect(taskText).not.toBeNull(); + expect(taskText.attributes[1].value).toEqual('Fake Mule task'); + + let iconTask: any = element.querySelector('diagram-mule-task > diagram-icon-mule-task > raphael-icon-mule'); + expect(iconTask).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsActivitiesMock.muleTask]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Service Alfresco Publish Task', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let task: any = element.querySelector('diagram-alfresco-publish-task > diagram-task > raphael-rect'); + expect(task).not.toBeNull(); + + let taskText: any = element.querySelector('diagram-alfresco-publish-task > diagram-task > raphael-text'); + expect(taskText).not.toBeNull(); + expect(taskText.attributes[1].value).toEqual('Fake Alfresco Publish task'); + + let iconTask: any = element.querySelector('diagram-alfresco-publish-task > diagram-icon-alfresco-publish-task >' + + ' raphael-icon-alfresco-publish'); + expect(iconTask).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsActivitiesMock.alfrescoPublishTask]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Service Google Drive Publish Task', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let task: any = element.querySelector('diagram-google-drive-publish-task > diagram-task > raphael-rect'); + expect(task).not.toBeNull(); + + let taskText: any = element.querySelector('diagram-google-drive-publish-task > diagram-task > raphael-text'); + expect(taskText).not.toBeNull(); + expect(taskText.attributes[1].value).toEqual('Fake Google Drive Publish task'); + + let iconTask: any = element.querySelector('diagram-google-drive-publish-task >' + + ' diagram-icon-google-drive-publish-task > raphael-icon-google-drive-publish'); + expect(iconTask).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsActivitiesMock.googleDrivePublishTask]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Rest Call Task', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let task: any = element.querySelector('diagram-rest-call-task > diagram-task > raphael-rect'); + expect(task).not.toBeNull(); + + let taskText: any = element.querySelector('diagram-rest-call-task > diagram-task > raphael-text'); + expect(taskText).not.toBeNull(); + expect(taskText.attributes[1].value).toEqual('Fake Rest Call task'); + + let iconTask: any = element.querySelector('diagram-rest-call-task > diagram-icon-rest-call-task >' + + ' raphael-icon-rest-call'); + expect(iconTask).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsActivitiesMock.restCallTask]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Service Box Publish Task', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let task: any = element.querySelector('diagram-box-publish-task > diagram-task > raphael-rect'); + expect(task).not.toBeNull(); + + let taskText: any = element.querySelector('diagram-box-publish-task > diagram-task > raphael-text'); + expect(taskText).not.toBeNull(); + expect(taskText.attributes[1].value).toEqual('Fake Box Publish task'); + + let iconTask: any = element.querySelector('diagram-box-publish-task >' + + ' diagram-icon-box-publish-task > raphael-icon-box-publish'); + expect(iconTask).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsActivitiesMock.boxPublishTask]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Receive Task', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let task: any = element.querySelector('diagram-receive-task > diagram-task > raphael-rect'); + expect(task).not.toBeNull(); + + let taskText: any = element.querySelector('diagram-receive-task > diagram-task > raphael-text'); + expect(taskText).not.toBeNull(); + expect(taskText.attributes[1].value).toEqual('Fake Receive task'); + + let iconTask: any = element.querySelector('diagram-receive-task > diagram-icon-receive-task > raphael-icon-receive'); + expect(iconTask).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsActivitiesMock.receiveTask]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Script Task', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let task: any = element.querySelector('diagram-script-task > diagram-task > raphael-rect'); + expect(task).not.toBeNull(); + + let taskText: any = element.querySelector('diagram-script-task > diagram-task > raphael-text'); + expect(taskText).not.toBeNull(); + expect(taskText.attributes[1].value).toEqual('Fake Script task'); + + let iconTask: any = element.querySelector('diagram-script-task > diagram-icon-script-task > raphael-icon-script'); + expect(iconTask).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsActivitiesMock.scriptTask]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Business Rule Task', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let task: any = element.querySelector('diagram-business-rule-task > diagram-task > raphael-rect'); + expect(task).not.toBeNull(); + + let taskText: any = element.querySelector('diagram-business-rule-task > diagram-task > raphael-text'); + expect(taskText).not.toBeNull(); + expect(taskText.attributes[1].value).toEqual('Fake BusinessRule task'); + + let iconTask: any = element.querySelector('diagram-business-rule-task > diagram-icon-business-rule-task > raphael-icon-business-rule'); + expect(iconTask).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsActivitiesMock.businessRuleTask]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + }); + + describe('Diagrams component Gateways: ', () => { + beforeEach(() => { + jasmine.Ajax.install(); + component.processDefinitionId = 'fakeprocess:24:38399'; + component.metricPercentages = {startEvent: 0}; + }); + + afterEach(() => { + jasmine.Ajax.uninstall(); + }); + + it('Should render the Exclusive Gateway', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-exclusive-gateway > diagram-gateway > raphael-rhombus'); + expect(shape).not.toBeNull(); + + let shape1: any = element.querySelector('diagram-exclusive-gateway > raphael-cross'); + expect(shape1).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsGatewaysMock.exclusiveGatway]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Inclusive Gateway', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-inclusive-gateway > diagram-gateway > raphael-rhombus'); + expect(shape).not.toBeNull(); + + let shape1: any = element.querySelector('diagram-inclusive-gateway > raphael-circle'); + expect(shape1).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsGatewaysMock.inclusiveGatway]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Parallel Gateway', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-parallel-gateway > diagram-gateway > raphael-rhombus'); + expect(shape).not.toBeNull(); + + let shape1: any = element.querySelector('diagram-parallel-gateway > raphael-plus'); + expect(shape1).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsGatewaysMock.parallelGatway]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Event Gateway', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-event-gateway > diagram-gateway > raphael-rhombus'); + expect(shape).not.toBeNull(); + + let shape1: any = element.querySelector('diagram-event-gateway'); + expect(shape1).not.toBeNull(); + expect(shape1.children.length).toBe(4); + + let outerCircle = shape1.children[1]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape1.children[2]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let shape2: any = element.querySelector('diagram-event-gateway > raphael-pentagon'); + expect(shape2).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [diagramsGatewaysMock.eventGatway]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + }); + + describe('Diagrams component Intermediate Catching events: ', () => { + beforeEach(() => { + jasmine.Ajax.install(); + component.processDefinitionId = 'fakeprocess:24:38399'; + component.metricPercentages = {startEvent: 0}; + }); + + afterEach(() => { + jasmine.Ajax.uninstall(); + }); + + it('Should render the Intermediate catching time event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-intermediate-catching-event'); + expect(shape).not.toBeNull(); + expect(shape.children.length).toBe(3); + + let outerCircle = shape.children[0]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape.children[1]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let iconShape: any = element.querySelector('diagram-intermediate-catching-event > diagram-container-icon-event >' + + ' div > div > diagram-icon-timer'); + expect(iconShape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [intermediateCatchingMock.intermediateCatchingTimeEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Intermediate catching error event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-intermediate-catching-event'); + expect(shape).not.toBeNull(); + expect(shape.children.length).toBe(3); + + let outerCircle = shape.children[0]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape.children[1]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let iconShape: any = element.querySelector('diagram-intermediate-catching-event > diagram-container-icon-event >' + + ' div > div > diagram-icon-error'); + expect(iconShape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [intermediateCatchingMock.intermediateCatchingErrorEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Intermediate catching signal event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-intermediate-catching-event'); + expect(shape).not.toBeNull(); + expect(shape.children.length).toBe(3); + + let outerCircle = shape.children[0]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape.children[1]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let iconShape: any = element.querySelector('diagram-intermediate-catching-event > diagram-container-icon-event >' + + ' div > div > diagram-icon-signal'); + expect(iconShape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [intermediateCatchingMock.intermediateCatchingSignalEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Intermediate catching signal message', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-intermediate-catching-event'); + expect(shape).not.toBeNull(); + expect(shape.children.length).toBe(3); + + let outerCircle = shape.children[0]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape.children[1]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let iconShape: any = element.querySelector('diagram-intermediate-catching-event > diagram-container-icon-event >' + + ' div > div > diagram-icon-message'); + expect(iconShape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [intermediateCatchingMock.intermediateCatchingMessageEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + }); + + describe('Diagrams component Boundary events: ', () => { + beforeEach(() => { + jasmine.Ajax.install(); + component.processDefinitionId = 'fakeprocess:24:38399'; + component.metricPercentages = {startEvent: 0}; + }); + + afterEach(() => { + jasmine.Ajax.uninstall(); + }); + + it('Should render the Boundary time event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-boundary-event'); + expect(shape).not.toBeNull(); + expect(shape.children.length).toBe(3); + + let outerCircle = shape.children[0]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape.children[1]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let iconShape: any = element.querySelector('diagram-boundary-event > diagram-container-icon-event >' + + ' div > div > diagram-icon-timer'); + expect(iconShape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [boundaryEventMock.boundaryTimeEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Boundary error event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-boundary-event'); + expect(shape).not.toBeNull(); + expect(shape.children.length).toBe(3); + + let outerCircle = shape.children[0]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape.children[1]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let iconShape: any = element.querySelector('diagram-boundary-event > diagram-container-icon-event >' + + ' div > div > diagram-icon-error'); + expect(iconShape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [boundaryEventMock.boundaryErrorEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Boundary signal event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-boundary-event'); + expect(shape).not.toBeNull(); + expect(shape.children.length).toBe(3); + + let outerCircle = shape.children[0]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape.children[1]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let iconShape: any = element.querySelector('diagram-boundary-event > diagram-container-icon-event >' + + ' div > div > diagram-icon-signal'); + expect(iconShape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [boundaryEventMock.boundarySignalEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Boundary signal message', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-boundary-event'); + expect(shape).not.toBeNull(); + expect(shape.children.length).toBe(3); + + let outerCircle = shape.children[0]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape.children[1]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let iconShape: any = element.querySelector('diagram-boundary-event > diagram-container-icon-event >' + + ' div > div > diagram-icon-message'); + expect(iconShape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [boundaryEventMock.boundaryMessageEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Boundary signal message', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-boundary-event'); + expect(shape).not.toBeNull(); + expect(shape.children.length).toBe(3); + + let outerCircle = shape.children[0]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape.children[1]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let iconShape: any = element.querySelector('diagram-boundary-event > diagram-container-icon-event >' + + ' div > div > diagram-icon-message'); + expect(iconShape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [boundaryEventMock.boundaryMessageEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + }); + + describe('Diagrams component Throw events: ', () => { + beforeEach(() => { + jasmine.Ajax.install(); + component.processDefinitionId = 'fakeprocess:24:38399'; + component.metricPercentages = {startEvent: 0}; + }); + + afterEach(() => { + jasmine.Ajax.uninstall(); + }); + + it('Should render the Throw time event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-throw-event'); + expect(shape).not.toBeNull(); + expect(shape.children.length).toBe(3); + + let outerCircle = shape.children[0]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape.children[1]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let iconShape: any = element.querySelector('diagram-throw-event > diagram-container-icon-event >' + + ' div > div > diagram-icon-timer'); + expect(iconShape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [throwEventMock.throwTimeEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Throw error event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-throw-event'); + expect(shape).not.toBeNull(); + expect(shape.children.length).toBe(3); + + let outerCircle = shape.children[0]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape.children[1]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let iconShape: any = element.querySelector('diagram-throw-event > diagram-container-icon-event >' + + ' div > div > diagram-icon-error'); + expect(iconShape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [throwEventMock.throwErrorEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Throw signal event', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-throw-event'); + expect(shape).not.toBeNull(); + expect(shape.children.length).toBe(3); + + let outerCircle = shape.children[0]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape.children[1]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let iconShape: any = element.querySelector('diagram-throw-event > diagram-container-icon-event >' + + ' div > div > diagram-icon-signal'); + expect(iconShape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [throwEventMock.throwSignalEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Throw signal message', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-throw-event'); + expect(shape).not.toBeNull(); + expect(shape.children.length).toBe(3); + + let outerCircle = shape.children[0]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape.children[1]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let iconShape: any = element.querySelector('diagram-throw-event > diagram-container-icon-event >' + + ' div > div > diagram-icon-message'); + expect(iconShape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [throwEventMock.throwMessageEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Throw signal message', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-throw-event'); + expect(shape).not.toBeNull(); + expect(shape.children.length).toBe(3); + + let outerCircle = shape.children[0]; + expect(outerCircle.localName).toEqual('raphael-circle'); + + let innerCircle = shape.children[1]; + expect(innerCircle.localName).toEqual('raphael-circle'); + + let iconShape: any = element.querySelector('diagram-throw-event > diagram-container-icon-event >' + + ' div > div > diagram-icon-message'); + expect(iconShape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [throwEventMock.throwMessageEvent]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + }); + + describe('Diagrams component Structural: ', () => { + beforeEach(() => { + jasmine.Ajax.install(); + component.processDefinitionId = 'fakeprocess:24:38399'; + component.metricPercentages = {startEvent: 0}; + }); + + afterEach(() => { + jasmine.Ajax.uninstall(); + }); + + it('Should render the Subprocess', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-subprocess > raphael-rect'); + expect(shape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [structuralMock.subProcess]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Event Subprocess', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-event-subprocess > raphael-rect'); + expect(shape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {elements: [structuralMock.eventSubProcess]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + }); + + describe('Diagrams component Swim lane: ', () => { + beforeEach(() => { + jasmine.Ajax.install(); + component.processDefinitionId = 'fakeprocess:24:38399'; + component.metricPercentages = {startEvent: 0}; + }); + + afterEach(() => { + jasmine.Ajax.uninstall(); + }); + + it('Should render the Pool', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-pool > raphael-rect'); + expect(shape).not.toBeNull(); + + let shapeText: any = element.querySelector('diagram-pool > raphael-text'); + expect(shapeText).not.toBeNull(); + expect(shapeText.attributes[2].value).toEqual('Activiti'); + }); + }); + component.ngOnChanges(); + let resp = {pools: [swimLanesMock.pool]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + + it('Should render the Pool with Lanes', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shapeLane: any = element.querySelector('diagram-lanes > div > div > diagram-lane'); + expect(shapeLane).not.toBeNull(); + + let shapeRect: any = element.querySelector('diagram-lanes > div > div > diagram-lane > raphael-rect'); + expect(shapeRect).not.toBeNull(); + + let shapeText: any = element.querySelector('diagram-lanes > div > div > diagram-lane > raphael-text'); + expect(shapeText).not.toBeNull(); + expect(shapeText.attributes[2].value).toEqual('Beckend'); + }); + }); + component.ngOnChanges(); + let resp = {pools: [swimLanesMock.poolLanes]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); + }); + + describe('Diagrams component Flows: ', () => { + beforeEach(() => { + jasmine.Ajax.install(); + component.processDefinitionId = 'fakeprocess:24:38399'; + component.metricPercentages = {startEvent: 0}; + }); + + afterEach(() => { + jasmine.Ajax.uninstall(); + }); + + it('Should render the flow', async(() => { + component.onSuccess.subscribe((res) => { + fixture.detectChanges(); + fixture.whenStable().then(() => { + expect(res).not.toBeNull(); + let shape: any = element.querySelector('diagram-sequence-flow > raphael-flow-arrow'); + expect(shape).not.toBeNull(); + }); + }); + component.ngOnChanges(); + let resp = {flows: [flowsMock.flow]}; + jasmine.Ajax.requests.mostRecent().respondWith({ + status: 200, + contentType: 'json', + responseText: resp + }); + })); }); });