I have a BPMN flow, and I reconnect using javascript code given below. When I expand any subprocess and the again collapse it, the flow lines gets disturbed, they are not the same as they were before expanding. Can someone help me prevent this?
static async collapseElementHandler() {
ModelerService.getModeler().get("canvas").resized();
const modeling = ModelerService.getModeler().get("modeling");
const elementRegistry = ModelerService.getModeler().get("elementRegistry");
const element = elementRegistry.getAll().find((el) => el.type === EL_TYPE.SUB_PROCESS && !el.collapsed);
if (element) {
DiagramService.reConnectElement(element);
// render the diagram again so that hideen element can render on again
// that got hidden during expand click
const diagramXML = await DiagramService.getCurrentDiagramXml();
DiagramService.renderDiagramCanvas(diagramXML);
}
}
and in reConnectElement:
static reConnectElement(el) {
const sourceConnection = el.incoming[0];
const source = sourceConnection?.source;
// for starting node there can be no source
if (source && FlowLayoutService.allowReConnect(sourceConnection)) {
FlowLayoutService.updateConnectionPoints(sourceConnection);
}
}
static updateConnectionPoints(connection) {
const modeling = ModelerService.getModeler().get('modeling');
modeling.updateWaypoints(connection, [
FlowLayoutService._getMid(connection.source),
FlowLayoutService._getMid(connection.target)
]);
modeling.layoutConnection(connection, {
connectionStart: FlowLayoutService._getMid(connection.source),
connectionEnd: FlowLayoutService._getMid(connection.target)
});
}