Repository: ProcessMaker/modeler (js)

Issue:
Call Activity breaks when selecting process with dash in ID
## Description
When a process's ID contains a dash, the Call Activity is unable to correctly parse the ID of that process.

## Reproduction steps
Drag a Call Activity onto the grid, select it, and in the Process dropdown in the inspector config, select a process which is known to contain a dash (`-`) in its ID.

## Expected behaviour
The process is selected and its ID is assigned to the call activity's `calledElement` attribute.

## Actual behaviour
Selecting the process throws the following error in the console:
```
[Vue warn]: Error in callback for watcher "node.definition.calledElement": "TypeError: Cannot read property 'name' of undefined"
```

## Software used
Latest modeler `develop` branch, Chrome 78, maxOS Mojave 10.14.6.

## Other information
The relevant code is:
https://github.com/ProcessMaker/modeler/blob/2374a7f1136ae6e4484eb46e0a26303a009584c5/src/components/nodes/callActivity/callActivity.vue#L57

Pull request description:
Dashes in process id break call activity
Closes #767 

Split out last dashed digit from the rest of the process id

Patch:
diff --git a/src/components/nodes/callActivity/callActivity.vue b/src/components/nodes/callActivity/callActivity.vue
index 380a7e6a..33c71e3b 100644
--- a/src/components/nodes/callActivity/callActivity.vue
+++ b/src/components/nodes/callActivity/callActivity.vue
@@ -1,5 +1,5 @@
 <template>
-  <div/>
+  <div />
 </template>
 
 <script>
@@ -11,9 +11,9 @@ import TaskShape from '@/components/nodes/task/shape';
 import { taskHeight } from '@/components/nodes/task/taskConfig';
 import store from '@/store';
 import uniqBy from 'lodash/uniqBy';
-import hasMarkers from '@/mixins/hasMarkers';
-import {markerSize} from '@/mixins/hasMarkers';
+import hasMarkers, { markerSize } from '@/mixins/hasMarkers';
 import hideLabelOnDrag from '@/mixins/hideLabelOnDrag';
+import { elementIdParser } from '@/components/nodes/callActivity/elementIdParser';
 
 const labelPadding = 15;
 const topAndBottomMarkersSpace = 2 * markerSize;
@@ -54,7 +54,7 @@ export default {
         return;
       }
 
-      const [ownerProcessId, processId] = calledElement.split('-');
+      const { ownerProcessId, processId } = elementIdParser(calledElement);
 
       const calledProcess = store.getters.globalProcesses
         .find(process => process.id == processId);
diff --git a/src/components/nodes/callActivity/elementIdParser.js b/src/components/nodes/callActivity/elementIdParser.js
new file mode 100644
index 00000000..3a5f3a42
--- /dev/null
+++ b/src/components/nodes/callActivity/elementIdParser.js
@@ -0,0 +1,6 @@
+export function elementIdParser(calledElement) {
+  const ownerProcessId = calledElement.substring(0, calledElement.lastIndexOf('-'));
+  const processId = calledElement.substring(calledElement.lastIndexOf('-') + 1);
+
+  return { ownerProcessId, processId };
+}


Test patch:
diff --git a/tests/unit/elementIdParser.spec.js b/tests/unit/elementIdParser.spec.js
new file mode 100644
index 00000000..4a9ce62f
--- /dev/null
+++ b/tests/unit/elementIdParser.spec.js
@@ -0,0 +1,13 @@
+import { elementIdParser } from '@/components/nodes/callActivity/elementIdParser';
+
+describe('element id parser', () => {
+  it.each(['abcd-1234', 'ghghghghghgh-123', 'abcd-efgh-12345'])('should correctly parse element id %s', elementId => {
+    const expectedOwnerProcessId = elementId.substring(0, elementId.lastIndexOf('-'));
+    const expectedProcessId = elementId.substring(elementId.lastIndexOf('-') + 1);
+
+    const { ownerProcessId, processId } = elementIdParser(elementId);
+
+    expect(ownerProcessId).toEqual(expectedOwnerProcessId);
+    expect(processId).toEqual(expectedProcessId);
+  });
+});