process-analytics · assynour · Sep 27, 2022 · Sep 15, 2022 · Sep 15, 2022 · Sep 15, 2022
diff --git a/docs/contributors/bpmn-support-how-to.md b/docs/contributors/bpmn-support-how-to.md
@@ -32,12 +32,12 @@ Overview of tasks to be achieved:
 * Update the json parsing to store the new element in the BPMN model
 * Add arbitrary rendering
 * Add/Update tests
-* Update the BPMN support documentation
+* Update the BPMN support documentation. Add the element with the [experimental icon](https://process-analytics.github.io/bpmn-visualization-js/#supported-bpmn-elements).
 
 Refer to existing Pull Requests to have a better view about the work to do, for instance:
-- [Link Event Detection Pull Request](https://github.com/process-analytics/bpmn-visualization-js/pull/501/files)
-- [Manual Task Detection Pull Request](https://github.com/process-analytics/bpmn-visualization-js/pull/582/files)
-
+- [Detect Complex Gateway Pull Request](https://github.com/process-analytics/bpmn-visualization-js/pull/2250/files)
+- [Detect and Render Group Pull Request](https://github.com/process-analytics/bpmn-visualization-js/pull/1462/files)
+- [Detect call activities calling different global tasks Pull Request](https://github.com/process-analytics/bpmn-visualization-js/pull/1447/files)
 
 ### BPMN model update
 
@@ -119,7 +119,7 @@ So before committing the modification, verify that some elements/configuration a
 Overview of tasks to be achieved:
 - Use the final icon chosen for the BPMN Elements.
 - Add/Update visual tests
-- Update the BPMN support documentation (see also [icons license](#icons-license))
+- Update the BPMN support documentation (see also [icons license](#icons-license)). Add the element with the [early access icon](https://process-analytics.github.io/bpmn-visualization-js/#supported-bpmn-elements)
 
 Refer to existing Pull Requests to have a better view about the work to do, for instance:
 - [Error Event Rendering Pull Request](https://github.com/process-analytics/bpmn-visualization-js/pull/505/files)

diff --git a/docs/contributors/testing.md b/docs/contributors/testing.md
@@ -105,7 +105,7 @@ You should add visual tests when:
 tests are supposed to fail in that case).
 <br/><br/>
 `bpmn.rendering.test.ts` drives all visual tests for this part. A visual test only requires a BPMN diagram as input, stored in the
-`test/fixtures/bpmn/non-regression` folder. It is automatically considered and use as test input.
+  `test/fixtures/bpmn/bpmn-rendering` folder. It is automatically considered and use as test input.
 <br/><br/>
 * You have added an interface for handling custom behaviors that manipulates the visible diagram.
 <br/><br/>
@@ -184,7 +184,7 @@ as the diagrams are served by the dev server. The parameter name is `url` and th
 `/test/fixtures/bpmn/simple-start-task-end.bpmn`. This works with all test pages of the project.
 
 Example: 
-> http://localhost:10001/dev/public/index.html?url=/test/fixtures/bpmn/non-regression/associations.and.annotations.01.general.bpmn
+> http://localhost:10001/dev/public/index.html?url=/test/fixtures/bpmn/bpmn-rendering/associations.and.annotations.01.general.bpmn
 
 In tests, convenient methods exist to only pass the name of the diagram without having to manage the folder tree to the file.
 

diff --git a/docs/users/bpmn-support.adoc b/docs/users/bpmn-support.adoc
@@ -573,6 +573,11 @@ The event definition can be defined on the event or on the definitions.
 ^.^|icon:check-circle-o[]
 ^.^|image:images/icons/gateway_event_based.svg[Event-Based icon,30] image:images/icons/gateway_event_based_exclusive.svg[Exclusive Event-Based icon,30] image:images/icons/gateway_event_based_parallel.svg[Parallel Event-Based icon,30]
 .^|Support the `event gateway type` (Exclusive and Parallel) and the `instantiate` status
+
+.^|Complex
+^.^|icon:flask[]
+^.^|
+.^|
 |===
 
 

diff --git a/src/component/mxgraph/config/ShapeConfigurator.ts b/src/component/mxgraph/config/ShapeConfigurator.ts
@@ -18,7 +18,7 @@ import { mxgraph } from '../initializer';
 import type { mxCellState, mxImageShape, mxShape } from 'mxgraph';
 import { ShapeBpmnElementKind } from '../../../model/bpmn/internal';
 import { EndEventShape, EventShape, IntermediateEventShape, ThrowIntermediateEventShape } from '../shape/event-shapes';
-import { EventBasedGatewayShape, ExclusiveGatewayShape, InclusiveGatewayShape, ParallelGatewayShape } from '../shape/gateway-shapes';
+import { ComplexGatewayShape, EventBasedGatewayShape, ExclusiveGatewayShape, InclusiveGatewayShape, ParallelGatewayShape } from '../shape/gateway-shapes';
 import {
   BusinessRuleTaskShape,
   CallActivityShape,
@@ -58,6 +58,7 @@ export default class ShapeConfigurator {
     mxgraph.mxCellRenderer.registerShape(ShapeBpmnElementKind.EVENT_INTERMEDIATE_CATCH, IntermediateEventShape);
     mxgraph.mxCellRenderer.registerShape(ShapeBpmnElementKind.EVENT_BOUNDARY, IntermediateEventShape);
     // gateways
+    mxgraph.mxCellRenderer.registerShape(ShapeBpmnElementKind.GATEWAY_COMPLEX, ComplexGatewayShape);
     mxgraph.mxCellRenderer.registerShape(ShapeBpmnElementKind.GATEWAY_EVENT_BASED, EventBasedGatewayShape);
     mxgraph.mxCellRenderer.registerShape(ShapeBpmnElementKind.GATEWAY_EXCLUSIVE, ExclusiveGatewayShape);
     mxgraph.mxCellRenderer.registerShape(ShapeBpmnElementKind.GATEWAY_INCLUSIVE, InclusiveGatewayShape);

diff --git a/src/component/mxgraph/shape/gateway-shapes.ts b/src/component/mxgraph/shape/gateway-shapes.ts
@@ -76,6 +76,16 @@ export class InclusiveGatewayShape extends GatewayShape {
   }
 }
 
+/**
+ * @internal
+ */
+export class ComplexGatewayShape extends GatewayShape {
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  protected paintInnerShape(paintParameter: PaintParameter): void {
+    this.fill = 'red';
+  }
+}
+
 /**
  * @internal
  */

diff --git a/src/model/bpmn/internal/shape/kinds.ts b/src/model/bpmn/internal/shape/kinds.ts
@@ -53,16 +53,7 @@ export enum ShapeBpmnElementKind {
   GATEWAY_EXCLUSIVE = 'exclusiveGateway',
   GATEWAY_INCLUSIVE = 'inclusiveGateway',
   GATEWAY_EVENT_BASED = 'eventBasedGateway',
-
-  // When adding support for GATEWAY_COMPLEX, uncomment corresponding test in the following files
-  // test/unit/component/parser/json/BpmnJsonParser.sequenceFlow.default.test.ts
-  // test/unit/component/parser/json/BpmnJsonParser.sequenceFlow.conditional.test.ts
-  // test/unit/component/parser/json/BpmnJsonParser.flowNode.test.ts
-  // test/unit/component/parser/json/BpmnJsonParser.label.bounds.test.ts
-  // test/unit/component/parser/json/BpmnJsonParser.label.font.test.ts
-  // test/unit/component/parser/json/BpmnJsonParser.label.test.ts
-  // Uncomment corresponding line in src/model/bpmn/shape/utils.ts FLOW_NODE_WITH_DEFAULT_SEQUENCE_FLOW_KINDS
-  // GATEWAY_COMPLEX = 'complexGateway',
+  GATEWAY_COMPLEX = 'complexGateway',
 
   EVENT_START = 'startEvent',
   EVENT_END = 'endEvent',

diff --git a/src/model/bpmn/internal/shape/utils.ts b/src/model/bpmn/internal/shape/utils.ts
@@ -117,8 +117,7 @@ const FLOW_NODE_WITH_DEFAULT_SEQUENCE_FLOW_KINDS = [
   ...ACTIVITY_KINDS,
   ShapeBpmnElementKind.GATEWAY_EXCLUSIVE,
   ShapeBpmnElementKind.GATEWAY_INCLUSIVE,
-  // Uncomment when supported
-  // ShapeBpmnElementKind.GATEWAY_COMPLEX,
+  ShapeBpmnElementKind.GATEWAY_COMPLEX,
 ];
 
 /**

diff --git a/test/e2e/__image_snapshots__/bpmn-rendering/gateways.png b/test/e2e/__image_snapshots__/bpmn-rendering/gateways.png
diff --git a/test/fixtures/bpmn/model-complete-semantic.bpmn b/test/fixtures/bpmn/model-complete-semantic.bpmn
@@ -647,6 +647,7 @@
     <semantic:eventBasedGateway id="gateway_event_based_id" name="Event-Based Gateway" />
     <semantic:eventBasedGateway id="gateway_event_based_instantiate_id" name="Event-Based Gateway Instantiate" instantiate="true" />
     <semantic:eventBasedGateway id="gateway_event_based_instantiate_parallel_id" name="Event-Based Gateway Instantiate Parallel" instantiate="true" eventGatewayType="Parallel" />
+    <semantic:complexGateway id="complex_gateway_id" name="Complex Gateway" />
 
     <!-- Artifact -->
     <semantic:textAnnotation id="text_annotation_id">
@@ -1685,6 +1686,12 @@
           <dc:Bounds x="2525" y="1250" width="90" height="14" />
         </bpmndi:BPMNLabel>
       </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="shape_complex_gateway_id" bpmnElement="complex_gateway_id">
+        <dc:Bounds x="2545" y="1320" width="50" height="50" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="2525" y="1370" width="90" height="14" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNShape>
 
       <!-- Artifact -->
       <bpmndi:BPMNShape id="shape_text_annotation_id" bpmnElement="text_annotation_id">

diff --git a/test/unit/component/parser/json/BpmnJsonParser.flowNode.test.ts b/test/unit/component/parser/json/BpmnJsonParser.flowNode.test.ts
@@ -34,7 +34,7 @@ describe.each([
   ['inclusiveGateway', ShapeBpmnElementKind.GATEWAY_INCLUSIVE],
   ['parallelGateway', ShapeBpmnElementKind.GATEWAY_PARALLEL],
   ['eventBasedGateway', ShapeBpmnElementKind.GATEWAY_EVENT_BASED],
-  // ['complexGateway', ShapeBpmnElementKind.GATEWAY_COMPLEX],
+  ['complexGateway', ShapeBpmnElementKind.GATEWAY_COMPLEX],
 ])('parse bpmn as json for %s', (bpmnKind: string, expectedShapeBpmnElementKind: ShapeBpmnElementKind) => {
   const processWithFlowNodeAsObject = {} as TProcess;
   processWithFlowNodeAsObject[`${bpmnKind}`] = {

diff --git a/test/unit/component/parser/json/BpmnJsonParser.sequenceFlow.conditional.test.ts b/test/unit/component/parser/json/BpmnJsonParser.sequenceFlow.conditional.test.ts
@@ -26,8 +26,7 @@ describe('parse bpmn as json for conditional sequence flow', () => {
   it.each([
     ['exclusiveGateway', SequenceFlowKind.CONDITIONAL_FROM_GATEWAY],
     ['inclusiveGateway', SequenceFlowKind.CONDITIONAL_FROM_GATEWAY],
-    // To uncomment when we support complex gateway
-    // ['complexGateway', SequenceFlowKind.CONDITIONAL_FROM_GATEWAY],
+    ['complexGateway', SequenceFlowKind.CONDITIONAL_FROM_GATEWAY],
     ['task', SequenceFlowKind.CONDITIONAL_FROM_ACTIVITY],
     ['userTask', SequenceFlowKind.CONDITIONAL_FROM_ACTIVITY],
     ['serviceTask', SequenceFlowKind.CONDITIONAL_FROM_ACTIVITY],

diff --git a/test/unit/component/parser/json/BpmnJsonParser.sequenceFlow.default.test.ts b/test/unit/component/parser/json/BpmnJsonParser.sequenceFlow.default.test.ts
@@ -25,8 +25,7 @@ describe('parse bpmn as json for default sequence flow', () => {
   it.each([
     ['exclusiveGateway'],
     ['inclusiveGateway'],
-    // To uncomment when we support complex gateway
-    // ['complexGateway'],
+    ['complexGateway'],
     ['task'],
     ['userTask'],
     ['serviceTask'],