bpmn-io / bpmn-js

A BPMN 2.0 rendering toolkit and web modeler.
https://bpmn.io/toolkit/bpmn-js/
Other
8.35k stars 1.29k forks source link

Attached XML can't able to open by BPMN 2.0 #2184

Closed rajasuryakumar closed 1 month ago

rajasuryakumar commented 1 month ago

Describe the Bug

Attached XML can't able to open by BPMN 2.0 XML

<?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"no\"?>\n<bpmn:definitions xmlns:bpmn=\"http://www.omg.org/spec/BPMN/20100524/MODEL\" xmlns:bpmndi=\"http://www.omg.org/spec/BPMN/20100524/DI\" xmlns:camunda=\"http://camunda.org/schema/1.0/bpmn\" xmlns:dc=\"http://www.omg.org/spec/DD/20100524/DC\" xmlns:di=\"http://www.omg.org/spec/DD/20100524/DI\" xmlns:modeler=\"http://camunda.org/schema/modeler/1.0\" xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\" exporter=\"Camunda Modeler\" exporterVersion=\"5.15.2\" expressionLanguage=\"http://www.w3.org/1999/XPath\" id=\"Definitions_0a1635k\" modeler:executionPlatform=\"Camunda Platform\" modeler:executionPlatformVersion=\"7.19.0\" targetNamespace=\"http://bpmn.io/schema/bpmn\" typeLanguage=\"http://www.w3.org/2001/XMLSchema\">\n \n <bpmn:process camunda:versionTag=\"1\" id=\"WF_KSGC1711006314_1717139207367\" isClosed=\"false\" isExecutable=\"true\" name=\"dsfdsf\" processType=\"None\">\n \n <bpmn:documentation textFormat=\"text/plain\">sdfdsf</bpmn:documentation>\n \n <bpmn:inclusiveGateway gatewayDirection=\"Unspecified\" id=\"ExclusiveGateway_Tasks\" name=\"All Done\">\n <incoming xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\">sequenceFlow_77d95537-3632-47ee-b66e-fd9a802027f7</incoming>\n <incoming xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\">sequenceFlow_ed18631c-50d5-49a8-ae7d-63567a1d9cb4</incoming>\n <incoming xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\">sequenceFlow_24c4560e-a41a-470b-8924-06b0a537f134</incoming>\n \n <bpmn:outgoing>all_complete</bpmn:outgoing>\n \n </bpmn:inclusiveGateway>\n \n <bpmn:userTask camunda:candidateGroups=\"FacilityManager\" completionQuantity=\"1\" id=\"ut_manager_approval\" implementation=\"##unspecified\" isForCompensation=\"false\" name=\"Manager approval\" startQuantity=\"1\">\n \n <bpmn:extensionElements>\n \n <camunda:formData/>\n \n <camunda:taskListener event=\"create\" expression=\"${execution.setVariable('ut_manager_approval_tag', 'button')}\"/>\n \n </bpmn:extensionElements>\n \n <bpmn:incoming>SequenceFlow_1rlrchr</bpmn:incoming>\n \n <bpmn:outgoing>SequenceFlow_0cy5jhq</bpmn:outgoing>\n \n </bpmn:userTask>\n \n <bpmn:startEvent id=\"workflow_started\" isInterrupting=\"true\" name=\"Workflow started\" parallelMultiple=\"false\">\n \n <bpmn:outgoing>Flow_1ao7911</bpmn:outgoing>\n \n </bpmn:startEvent>\n \n <bpmn:userTask camunda:candidateGroups=\"ServicePerson\" completionQuantity=\"1\" id=\"ut_sign_off_workflow\" implementation=\"##unspecified\" isForCompensation=\"false\" name=\"Sign off workflow\" startQuantity=\"1\">\n \n <bpmn:extensionElements>\n \n <camunda:formData/>\n \n <camunda:taskListener event=\"create\" expression=\"${execution.setVariable('ut_sign_off_workflow_tag', 'button')}\"/>\n \n </bpmn:extensionElements>\n \n <bpmn:incoming>all_complete</bpmn:incoming>\n \n <bpmn:outgoing>SequenceFlow_17vbx9y</bpmn:outgoing>\n \n </bpmn:userTask>\n \n <bpmn:serviceTask camunda:topic=\"workflow_complete\" camunda:type=\"external\" completionQuantity=\"1\" id=\"task_complete_workflow\" implementation=\"##WebService\" isForCompensation=\"false\" name=\"Complete Workflow\" startQuantity=\"1\">\n \n <bpmn:incoming>Flow_0w1mn6d</bpmn:incoming>\n \n <bpmn:outgoing>SequenceFlow_1uebnww</bpmn:outgoing>\n \n </bpmn:serviceTask>\n \n <bpmn:endEvent id=\"EndEvent_09q1p3q\" name=\"Workflow completed\">\n \n <bpmn:incoming>SequenceFlow_1uebnww</bpmn:incoming>\n \n <bpmn:terminateEventDefinition id=\"TerminateEventDefinition_1tksx6n\"/>\n \n </bpmn:endEvent>\n \n <bpmn:serviceTask camunda:topic=\"workflow_signoff\" camunda:type=\"external\" completionQuantity=\"1\" id=\"task_sign_off\" implementation=\"##WebService\" isForCompensation=\"false\" name=\"Handle workflow signoff\" startQuantity=\"1\">\n \n <bpmn:incoming>SequenceFlow_17vbx9y</bpmn:incoming>\n \n <bpmn:outgoing>SequenceFlow_1rlrchr</bpmn:outgoing>\n \n </bpmn:serviceTask>\n \n <bpmn:parallelGateway gatewayDirection=\"Unspecified\" id=\"ExclusiveGateway_Parallel\">\n \n <bpmn:incoming>Flow_1ao7911</bpmn:incoming>\n <outgoing xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\">sequenceFlow_2b402050-7576-44ac-9f5d-2731378a917d</outgoing>\n <outgoing xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\">sequenceFlow_2647699e-b497-4623-8dd0-e0839ae1f53a</outgoing>\n <outgoing xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\">sequenceFlow_7c584d61-dc43-473a-a44d-893a12c2cbc8</outgoing>\n \n </bpmn:parallelGateway>\n \n <bpmn:sequenceFlow id=\"all_complete\" sourceRef=\"ExclusiveGateway_Tasks\" targetRef=\"ut_sign_off_workflow\"/>\n \n <bpmn:sequenceFlow id=\"SequenceFlow_1rlrchr\" sourceRef=\"task_sign_off\" targetRef=\"ut_manager_approval\"/>\n \n <bpmn:sequenceFlow id=\"SequenceFlow_0cy5jhq\" sourceRef=\"ut_manager_approval\" targetRef=\"Gateway_07rmu70\"/>\n \n <bpmn:sequenceFlow id=\"SequenceFlow_17vbx9y\" sourceRef=\"ut_sign_off_workflow\" targetRef=\"task_sign_off\"/>\n \n <bpmn:sequenceFlow id=\"SequenceFlow_1uebnww\" sourceRef=\"task_complete_workflow\" targetRef=\"EndEvent_09q1p3q\"/>\n \n <bpmn:exclusiveGateway gatewayDirection=\"Unspecified\" id=\"Gateway_07rmu70\">\n \n <bpmn:incoming>SequenceFlow_0cy5jhq</bpmn:incoming>\n \n <bpmn:outgoing>Flow_0w1mn6d</bpmn:outgoing>\n \n <bpmn:outgoing>Flow_0f3pjdg</bpmn:outgoing>\n \n </bpmn:exclusiveGateway>\n \n <bpmn:sequenceFlow id=\"Flow_0w1mn6d\" name=\"Approved\" sourceRef=\"Gateway_07rmu70\" targetRef=\"task_complete_workflow\">\n \n <bpmn:conditionExpression xsi:type=\"bpmn:tFormalExpression\">${manager_approval_action== 'APPROVED'}</bpmn:conditionExpression>\n \n </bpmn:sequenceFlow>\n \n <bpmn:sequenceFlow id=\"Flow_0f3pjdg\" name=\"Rejected\" sourceRef=\"Gateway_07rmu70\" targetRef=\"task_handle_rejection\">\n \n <bpmn:conditionExpression xsi:type=\"bpmn:tFormalExpression\">${manager_approval_action== 'REJECTED'}</bpmn:conditionExpression>\n \n </bpmn:sequenceFlow>\n \n <bpmn:sequenceFlow id=\"Flow_1ao7911\" sourceRef=\"workflow_started\" targetRef=\"ExclusiveGateway_Parallel\"/>\n \n <bpmn:serviceTask camunda:topic=\"workflow_reject\" camunda:type=\"external\" completionQuantity=\"1\" id=\"task_handle_rejection\" implementation=\"##WebService\" isForCompensation=\"false\" name=\"Handle rejection\" startQuantity=\"1\">\n \n <bpmn:extensionElements/>\n \n <bpmn:incoming>Flow_0f3pjdg</bpmn:incoming>\n \n <bpmn:outgoing>Flow_1ptng5y</bpmn:outgoing>\n \n </bpmn:serviceTask>\n \n <bpmn:subProcess completionQuantity=\"1\" id=\"Activity_11qtjs5\" isForCompensation=\"false\" startQuantity=\"1\" triggeredByEvent=\"true\">\n \n <bpmn:startEvent id=\"event_workflow_removed\" isInterrupting=\"true\" name=\"workflow remove\" parallelMultiple=\"false\">\n \n <bpmn:extensionElements/>\n \n <bpmn:outgoing>Flow_12u0auk</bpmn:outgoing>\n \n <bpmn:messageEventDefinition id=\"MessageEventDefinition_0bd7dfm\" messageRef=\"Message_0gv9njd\"/>\n \n </bpmn:startEvent>\n \n <bpmn:sequenceFlow id=\"Flow_12u0auk\" sourceRef=\"event_workflow_removed\" targetRef=\"task_workflow_removed\"/>\n \n <bpmn:serviceTask camunda:topic=\"workflow_removed\" camunda:type=\"external\" completionQuantity=\"1\" id=\"task_workflow_removed\" implementation=\"##WebService\" isForCompensation=\"false\" name=\"Workflow removed\" startQuantity=\"1\">\n \n <bpmn:incoming>Flow_12u0auk</bpmn:incoming>\n \n <bpmn:outgoing>Flow_0gg9fip</bpmn:outgoing>\n \n </bpmn:serviceTask>\n \n <bpmn:sequenceFlow id=\"Flow_0gg9fip\" sourceRef=\"task_workflow_removed\" targetRef=\"Event_00qwh3s\"/>\n \n <bpmn:endEvent id=\"Event_00qwh3s\" name=\"Workflow removed\">\n \n <bpmn:incoming>Flow_0gg9fip</bpmn:incoming>\n \n <bpmn:terminateEventDefinition id=\"TerminateEventDefinition_16rpsfm\"/>\n \n </bpmn:endEvent>\n \n </bpmn:subProcess>\n \n <bpmn:sequenceFlow id=\"Flow_0s2u0j9\" sourceRef=\"task_workflow_correction\" targetRef=\"Event_1xxkn6d\"/>\n \n <bpmn:endEvent id=\"Event_1xxkn6d\" name=\"Workflow rejected\">\n \n <bpmn:incoming>Flow_0s2u0j9</bpmn:incoming>\n \n <bpmn:terminateEventDefinition id=\"TerminateEventDefinition_1fpaw9a\"/>\n \n </bpmn:endEvent>\n \n <bpmn:sequenceFlow id=\"Flow_1ptng5y\" sourceRef=\"task_handle_rejection\" targetRef=\"task_workflow_correction\"/>\n \n <bpmn:serviceTask camunda:topic=\"workflow_correction\" camunda:type=\"external\" completionQuantity=\"1\" id=\"task_workflow_correction\" implementation=\"##WebService\" isForCompensation=\"false\" name=\"Start workflow for correction\" startQuantity=\"1\">\n \n <bpmn:incoming>Flow_1ptng5y</bpmn:incoming>\n \n <bpmn:outgoing>Flow_0s2u0j9</bpmn:outgoing>\n \n </bpmn:serviceTask>\n <userTask camunda:candidateGroups=\"ServicePerson\" id=\"ut_1717139207367_dQBg\" name=\"step 1\" xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\">\n <extensionElements>\n <camunda:taskListener event=\"create\" expression=\"${execution.setVariable('ut_1717139207367_dQBg_tag', 'WF_STEP')}\"/>\n </extensionElements>\n <incoming>sequenceFlow_2b402050-7576-44ac-9f5d-2731378a917d</incoming>\n <outgoing>sequenceFlow_77d95537-3632-47ee-b66e-fd9a802027f7</outgoing>\n </userTask>\n <sequenceFlow id=\"sequenceFlow_2b402050-7576-44ac-9f5d-2731378a917d\" sourceRef=\"ExclusiveGateway_Parallel\" targetRef=\"ut_1717139207367_dQBg\" xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\"/>\n <sequenceFlow id=\"sequenceFlow_77d95537-3632-47ee-b66e-fd9a802027f7\" sourceRef=\"ut_1717139207367_dQBg\" targetRef=\"ExclusiveGateway_Tasks\" xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\"/>\n <userTask camunda:candidateGroups=\"ServicePerson\" id=\"ut_1717139207367_MPYu\" name=\"step 2\" xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\">\n <extensionElements>\n <camunda:taskListener event=\"create\" expression=\"${execution.setVariable('ut_1717139207367_MPYu_tag', 'WF_STEP')}\"/>\n </extensionElements>\n <incoming>sequenceFlow_2647699e-b497-4623-8dd0-e0839ae1f53a</incoming>\n <outgoing>sequenceFlow_ed18631c-50d5-49a8-ae7d-63567a1d9cb4</outgoing>\n </userTask>\n <sequenceFlow id=\"sequenceFlow_2647699e-b497-4623-8dd0-e0839ae1f53a\" sourceRef=\"ExclusiveGateway_Parallel\" targetRef=\"ut_1717139207367_MPYu\" xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\"/>\n <sequenceFlow id=\"sequenceFlow_ed18631c-50d5-49a8-ae7d-63567a1d9cb4\" sourceRef=\"ut_1717139207367_MPYu\" targetRef=\"ExclusiveGateway_Tasks\" xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\"/>\n <userTask camunda:candidateGroups=\"ServicePerson\" id=\"ut_1717139207367_VAwH\" name=\"step 3\" xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\">\n <extensionElements>\n <camunda:taskListener event=\"create\" expression=\"${execution.setVariable('ut_1717139207367_VAwH_tag', 'WF_STEP')}\"/>\n </extensionElements>\n <incoming>sequenceFlow_7c584d61-dc43-473a-a44d-893a12c2cbc8</incoming>\n <outgoing>sequenceFlow_24c4560e-a41a-470b-8924-06b0a537f134</outgoing>\n </userTask>\n <sequenceFlow id=\"sequenceFlow_7c584d61-dc43-473a-a44d-893a12c2cbc8\" sourceRef=\"ExclusiveGateway_Parallel\" targetRef=\"ut_1717139207367_VAwH\" xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\"/>\n <sequenceFlow id=\"sequenceFlow_24c4560e-a41a-470b-8924-06b0a537f134\" sourceRef=\"ut_1717139207367_VAwH\" targetRef=\"ExclusiveGateway_Tasks\" xmlns=\"http://www.omg.org/spec/BPMN/20100524/MODEL\"/>\n \n </bpmn:process>\n \n <bpmn:message id=\"Message_0gv9njd\" name=\"msg_workflow_remove\"/>\n \n <bpmndi:BPMNDiagram id=\"BPMNDiagram_1\">\n \n <bpmndi:BPMNPlane bpmnElement=\"WF_KSGC1711006314_1717139207367\" id=\"BPMNPlane_1\">\n \n <bpmndi:BPMNShape bpmnElement=\"ut_manager_approval\" id=\"UserTask_0nw1taq_di\">\n \n <dc:Bounds height=\"80\" width=\"100\" x=\"1120\" y=\"360\"/>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNShape bpmnElement=\"ut_sign_off_workflow\" id=\"UserTask_1j65sgm_di\">\n \n <dc:Bounds height=\"80\" width=\"100\" x=\"730\" y=\"360\"/>\n \n <bpmndi:BPMNLabel/>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNShape bpmnElement=\"task_complete_workflow\" id=\"ServiceTask_0y29bi4_di\">\n \n <dc:Bounds height=\"80\" width=\"100\" x=\"1406\" y=\"360\"/>\n \n <bpmndi:BPMNLabel/>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNShape bpmnElement=\"EndEvent_09q1p3q\" id=\"EndEvent_0ena6or_di\">\n \n <dc:Bounds height=\"36\" width=\"36\" x=\"1547\" y=\"382\"/>\n \n <bpmndi:BPMNLabel>\n \n <dc:Bounds height=\"27\" width=\"52\" x=\"1542\" y=\"425\"/>\n \n </bpmndi:BPMNLabel>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNShape bpmnElement=\"task_sign_off\" id=\"ServiceTask_1f5rgxu_di\">\n \n <dc:Bounds height=\"80\" width=\"100\" x=\"930\" y=\"360\"/>\n \n <bpmndi:BPMNLabel/>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNShape bpmnElement=\"Gateway_07rmu70\" id=\"Gateway_07rmu70_di\" isMarkerVisible=\"true\">\n \n <dc:Bounds height=\"50\" width=\"50\" x=\"1265\" y=\"375\"/>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNShape bpmnElement=\"task_handle_rejection\" id=\"Activity_0d1osw4_di\">\n \n <dc:Bounds height=\"80\" width=\"100\" x=\"1390\" y=\"520\"/>\n \n <bpmndi:BPMNLabel/>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNShape bpmnElement=\"ExclusiveGateway_Parallel\" id=\"ParallelGateway_0dju2gp_di\">\n \n <dc:Bounds height=\"50\" width=\"50\" x=\"295\" y=\"375\"/>\n \n <bpmndi:BPMNLabel>\n \n <dc:Bounds height=\"14\" width=\"69\" x=\"497\" y=\"812\"/>\n \n </bpmndi:BPMNLabel>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNShape bpmnElement=\"workflow_started\" id=\"StartEvent_1o1lwap_di\">\n \n <dc:Bounds height=\"36\" width=\"36\" x=\"182\" y=\"382\"/>\n \n <bpmndi:BPMNLabel>\n \n <dc:Bounds height=\"14\" width=\"82\" x=\"161\" y=\"425\"/>\n \n </bpmndi:BPMNLabel>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNShape bpmnElement=\"ExclusiveGateway_Tasks\" id=\"InclusiveGateway_0ci0w1k_di\">\n \n <dc:Bounds height=\"50\" width=\"50\" x=\"605\" y=\"375\"/>\n \n <bpmndi:BPMNLabel>\n \n <dc:Bounds height=\"14\" width=\"42\" x=\"661\" y=\"382\"/>\n \n </bpmndi:BPMNLabel>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNShape bpmnElement=\"Activity_11qtjs5\" id=\"Activity_11qtjs5_di\" isExpanded=\"true\">\n \n <dc:Bounds height=\"200\" width=\"430\" x=\"680\" y=\"80\"/>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNShape bpmnElement=\"event_workflow_removed\" id=\"Event_082o37u_di\">\n \n <dc:Bounds height=\"36\" width=\"36\" x=\"730\" y=\"162\"/>\n \n <bpmndi:BPMNLabel>\n \n <dc:Bounds height=\"14\" width=\"83\" x=\"708\" y=\"205\"/>\n \n </bpmndi:BPMNLabel>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNShape bpmnElement=\"task_workflow_removed\" id=\"Activity_1uyshx4_di\">\n \n <dc:Bounds height=\"80\" width=\"100\" x=\"830\" y=\"140\"/>\n \n <bpmndi:BPMNLabel/>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNShape bpmnElement=\"Event_00qwh3s\" id=\"Event_0rks46l_di\">\n \n <dc:Bounds height=\"36\" width=\"36\" x=\"1012\" y=\"162\"/>\n \n <bpmndi:BPMNLabel>\n \n <dc:Bounds height=\"27\" width=\"46\" x=\"1007\" y=\"205\"/>\n \n </bpmndi:BPMNLabel>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNEdge bpmnElement=\"Flow_12u0auk\" id=\"Flow_12u0auk_di\">\n \n <di:waypoint x=\"766\" y=\"180\"/>\n \n <di:waypoint x=\"830\" y=\"180\"/>\n \n </bpmndi:BPMNEdge>\n \n <bpmndi:BPMNEdge bpmnElement=\"Flow_0gg9fip\" id=\"Flow_0gg9fip_di\">\n \n <di:waypoint x=\"930\" y=\"180\"/>\n \n <di:waypoint x=\"1012\" y=\"180\"/>\n \n </bpmndi:BPMNEdge>\n \n <bpmndi:BPMNShape bpmnElement=\"Event_1xxkn6d\" id=\"Event_08ifj92_di\">\n \n <dc:Bounds height=\"36\" width=\"36\" x=\"1742\" y=\"542\"/>\n \n <bpmndi:BPMNLabel>\n \n <dc:Bounds height=\"14\" width=\"87\" x=\"1716\" y=\"518\"/>\n \n </bpmndi:BPMNLabel>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNShape bpmnElement=\"task_workflow_correction\" id=\"Activity_18sibbd_di\">\n \n <dc:Bounds height=\"80\" width=\"100\" x=\"1560\" y=\"520\"/>\n \n <bpmndi:BPMNLabel/>\n \n </bpmndi:BPMNShape>\n \n <bpmndi:BPMNEdge bpmnElement=\"all_complete\" id=\"SequenceFlow_0yvx7af_di\">\n \n <di:waypoint x=\"655\" y=\"400\"/>\n \n <di:waypoint x=\"730\" y=\"400\"/>\n \n <bpmndi:BPMNLabel>\n \n <dc:Bounds height=\"14\" width=\"63\" x=\"878\" y=\"772\"/>\n \n </bpmndi:BPMNLabel>\n \n </bpmndi:BPMNEdge>\n \n <bpmndi:BPMNEdge bpmnElement=\"SequenceFlow_1rlrchr\" id=\"SequenceFlow_1rlrchr_di\">\n \n <di:waypoint x=\"1030\" y=\"400\"/>\n \n <di:waypoint x=\"1120\" y=\"400\"/>\n \n </bpmndi:BPMNEdge>\n \n <bpmndi:BPMNEdge bpmnElement=\"SequenceFlow_0cy5jhq\" id=\"SequenceFlow_0cy5jhq_di\">\n <di:waypoint x=\"1220.0\" y=\"400.0\"/>\n <di:waypoint x=\"1265.0\" y=\"400.0\"/>\n \n </bpmndi:BPMNEdge>\n \n <bpmndi:BPMNEdge bpmnElement=\"SequenceFlow_17vbx9y\" id=\"SequenceFlow_17vbx9y_di\">\n \n <di:waypoint x=\"830\" y=\"400\"/>\n \n <di:waypoint x=\"930\" y=\"400\"/>\n \n </bpmndi:BPMNEdge>\n \n <bpmndi:BPMNEdge bpmnElement=\"SequenceFlow_1uebnww\" id=\"SequenceFlow_1uebnww_di\">\n \n <di:waypoint x=\"1506\" y=\"400\"/>\n \n <di:waypoint x=\"1547\" y=\"400\"/>\n \n </bpmndi:BPMNEdge>\n \n <bpmndi:BPMNEdge bpmnElement=\"Flow_0w1mn6d\" id=\"Flow_0w1mn6d_di\">\n \n <di:waypoint x=\"1315\" y=\"400\"/>\n \n <di:waypoint x=\"1406\" y=\"400\"/>\n \n <bpmndi:BPMNLabel>\n \n <dc:Bounds height=\"14\" width=\"47\" x=\"1341\" y=\"382\"/>\n \n </bpmndi:BPMNLabel>\n \n </bpmndi:BPMNEdge>\n \n <bpmndi:BPMNEdge bpmnElement=\"Flow_0f3pjdg\" id=\"Flow_0f3pjdg_di\">\n \n <di:waypoint x=\"1290\" y=\"425\"/>\n \n <di:waypoint x=\"1290\" y=\"570\"/>\n \n <di:waypoint x=\"1390\" y=\"570\"/>\n \n <bpmndi:BPMNLabel>\n \n <dc:Bounds height=\"14\" width=\"44\" x=\"1298\" y=\"432\"/>\n \n </bpmndi:BPMNLabel>\n \n </bpmndi:BPMNEdge>\n \n <bpmndi:BPMNEdge bpmnElement=\"Flow_1ao7911\" id=\"Flow_1ao7911_di\">\n <di:waypoint x=\"218.0\" y=\"400.0\"/>\n <di:waypoint x=\"295.0\" y=\"400.0\"/>\n \n </bpmndi:BPMNEdge>\n \n <bpmndi:BPMNEdge bpmnElement=\"Flow_0s2u0j9\" id=\"Flow_0s2u0j9_di\">\n \n <di:waypoint x=\"1660\" y=\"560\"/>\n \n <di:waypoint x=\"1742\" y=\"560\"/>\n \n </bpmndi:BPMNEdge>\n \n <bpmndi:BPMNEdge bpmnElement=\"Flow_1ptng5y\" id=\"Flow_1ptng5y_di\">\n \n <di:waypoint x=\"1490\" y=\"560\"/>\n \n <di:waypoint x=\"1560\" y=\"560\"/>\n \n </bpmndi:BPMNEdge>\n <bpmndi:BPMNShape bpmnElement=\"ut_1717139207367_dQBg\" id=\"BPMNShape_901532f3-ebb0-4df5-861b-d64291c12928\">\n <dc:Bounds height=\"80.0\" width=\"100.0\" x=\"395.0\" y=\"360.0\"/>\n </bpmndi:BPMNShape>\n <bpmndi:BPMNEdge bpmnElement=\"sequenceFlow_2b402050-7576-44ac-9f5d-2731378a917d\" id=\"BPMNEdge_8f4c8d2a-8f3a-494c-8962-48cc15b728f8\">\n <di:waypoint x=\"345.0\" y=\"400.0\"/>\n <di:waypoint x=\"395.0\" y=\"400.0\"/>\n </bpmndi:BPMNEdge>\n <bpmndi:BPMNEdge bpmnElement=\"sequenceFlow_77d95537-3632-47ee-b66e-fd9a802027f7\" id=\"BPMNEdge_b3bf4a9b-940e-4995-b53c-dc29e5c18d75\">\n <di:waypoint x=\"495.0\" y=\"400.0\"/>\n <di:waypoint x=\"605.0\" y=\"400.0\"/>\n </bpmndi:BPMNEdge>\n <bpmndi:BPMNShape bpmnElement=\"ut_1717139207367_MPYu\" id=\"BPMNShape_83538e2f-c2dc-4155-8d84-b6ad1aa631f4\">\n <dc:Bounds height=\"80.0\" width=\"100.0\" x=\"395.0\" y=\"490.0\"/>\n </bpmndi:BPMNShape>\n <bpmndi:BPMNEdge bpmnElement=\"sequenceFlow_2647699e-b497-4623-8dd0-e0839ae1f53a\" id=\"BPMNEdge_e10aeadd-af8a-4a9f-bd2d-6a08c918ee5d\">\n <di:waypoint x=\"320.0\" y=\"425.0\"/>\n <di:waypoint x=\"320.0\" y=\"530.0\"/>\n <di:waypoint x=\"395.0\" y=\"530.0\"/>\n </bpmndi:BPMNEdge>\n <bpmndi:BPMNEdge bpmnElement=\"sequenceFlow_ed18631c-50d5-49a8-ae7d-63567a1d9cb4\" id=\"BPMNEdge_af6b60a9-0cd2-486b-93a7-8eb31e938c17\">\n <di:waypoint x=\"495.0\" y=\"530.0\"/>\n <di:waypoint x=\"630.0\" y=\"530.0\"/>\n <di:waypoint x=\"630.0\" y=\"425.0\"/>\n </bpmndi:BPMNEdge>\n <bpmndi:BPMNShape bpmnElement=\"ut_1717139207367_VAwH\" id=\"BPMNShape_823f0cfc-e0fc-4e97-b5d0-4245c4143318\">\n <dc:Bounds height=\"80.0\" width=\"100.0\" x=\"395.0\" y=\"620.0\"/>\n </bpmndi:BPMNShape>\n <bpmndi:BPMNEdge bpmnElement=\"sequenceFlow_7c584d61-dc43-473a-a44d-893a12c2cbc8\" id=\"BPMNEdge_763512f7-43fa-4b55-b532-c9f9267d382c\">\n <di:waypoint x=\"320.0\" y=\"425.0\"/>\n <di:waypoint x=\"320.0\" y=\"660.0\"/>\n <di:waypoint x=\"395.0\" y=\"660.0\"/>\n </bpmndi:BPMNEdge>\n <bpmndi:BPMNEdge bpmnElement=\"sequenceFlow_24c4560e-a41a-470b-8924-06b0a537f134\" id=\"BPMNEdge_90e88353-dd36-423b-8976-e79c252fcb2b\">\n <di:waypoint x=\"495.0\" y=\"660.0\"/>\n <di:waypoint x=\"630.0\" y=\"660.0\"/>\n <di:waypoint x=\"630.0\" y=\"425.0\"/>\n </bpmndi:BPMNEdge>\n \n </bpmndi:BPMNPlane>\n \n </bpmndi:BPMNDiagram>\n \n</bpmn:definitions>\n

nikku commented 1 month ago

@rajasuryakumar What problem do you see?

nikku commented 1 month ago

It opens just fine on demo.bpmn.io:

image

rajasuryakumar commented 1 month ago

@nikku please check below:

import React from "react";
import BpmnViewer from "bpmn-js";
import BpmnNavigatedViewer from "bpmn-js/dist/bpmn-navigated-viewer.development.js";
import "bpmn-js/dist/assets/diagram-js.css";
import "bpmn-js/dist/assets/bpmn-js.css";
import "bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css";
// css
import "./BPMN.scss";

class BpmnDiagram extends React.Component {
  currentXmlVersion = 0;

  constructor(props) {
    super(props);
    this.state = {};
  }

  componentDidMount() {
    console.log("BpmnDiagram mounted");
    this.bpmnViewer = new BpmnViewer({
      container: "#canvas",
    });
  }

  componentDidUpdate(prevProps, prevState) {
    console.log("BpmnDiagram updated", this.props.xmlData);
    if (this.props.xmlData !== prevProps.xmlData) {
      console.log("xmlData has changed");
      if (this.bpmnViewer) {
        this.bpmnViewer.destroy();
      }

      this.bpmnViewer = new BpmnViewer({
        container: "#canvas",
      });
      setTimeout(() => {
        this.initializeXML();
        if (this.props.updated) {
          this.props.updated();
        }
      });
    }
  }

  initializeXML = async () => {
    const { xmlData } = this.props;
    console.log("initializeXML called with XML DATA", xmlData);
    if (this.bpmnViewer && xmlData) {
      try {
        const res = await this.bpmnViewer.importXML(xmlData);
        console.log("BPMN Viewer Definitions:", this.bpmnViewer?.getDefinitions());
        const { warnings } = res;
        if (warnings.length) {
          console.error("could not import BPMN 2.0 diagram", warnings);
        }
        var container = document.getElementById("custom-bpmn-container");
        const viewport1 = container.children[0].children[0].children[1].children[1].children[0];
        if (viewport1) {
          container.setAttribute(
            "style",
            `height: ${viewport1.getBoundingClientRect().height}px; width: ${viewport1.getBoundingClientRect().width}px`
          );
        }
        if (!this.props.isWorkflow) {
          const { setBPMNworkflowId, workflowResource, ticketId, setBPMNactivityId, setMonitorScreenVisibility } = this.props;
          setBPMNworkflowId(workflowResource?.workflowId, ticketId);

          const eventBus = this.bpmnViewer.get("eventBus");
          const events = ["element.click"];
          events.forEach((event) => {
            eventBus.on(event, (e) => {
              if (event === "element.click") {
                setBPMNactivityId(e.element.id);
                setMonitorScreenVisibility(true);
              }
            });
          });
        }
      } catch (error) {
        console.error("could not import BPMN 2.0 diagram", error);
      }
    }
  };

  render() {
    const { overlay } = this.props;
    return (
      <div id="custom-bpmn-container" className="custom-bpmn-container">
        {overlay ? (
          <div
            style={{
              zIndex: 100,
              backgroundColor: "#aaa",
              border: "1px solid black",
              position: "absolute",
              left: overlay.x,
              top: overlay.y - 55,
            }}
          >
            {overlay.firstName}
            {overlay.lastName}
            <br />
            {overlay.email}
          </div>
        ) : null}
        <div id="canvas" className="custom-canvas"></div>
      </div>
    );
  }
}

export default BpmnDiagram;

In above code i'm getting xml data on "xmlData" props. getting blank page on screen

rajasuryakumar commented 1 month ago

@nikku please check attached image image

nikku commented 1 month ago

You have to fix the formatting errors in your diagram, replacing \n with actual newlines, and doing the same thing for \" :heavy_check_mark:

Please do not spam our repositories. One bug report is enough.

rajasuryakumar commented 1 month ago

@nikku bug was closed, That's why opened as a new bug~

rajasuryakumar commented 1 month ago

@nikku can you please help me on react example code for above xml viewer ?