Uncaught TypeError: Cannot read property 'x' of undefined in at DiagramEngine._this.calculateMatrixDimensions

In demo drag -and-drop(large application) example, If smart routing is enabled for DiagramWidget and user tried to drag and drop Node from side menu to workspacepanel area (diagram widget area/graph area), it throughs error in console as Uncaught TypeError: Cannot read property ‘x’ of undefined in at DiagramEngine._this.calculateMatrixDimensions

This occurs only if smart routing is enabled for DiagramWidget and there is no Node/Link/Port drawn on that DigramWidget, then drag and drop the Node from side panel and try to move around workspacel area.

Steps to reproduce:

1. Go to file: .demos/demo-drag-and-drop/Application.ts

2. From that file remove the code that create default nodes, links and ports i.e

    //3-A) create a default node
    var node1 = new SRD.DefaultNodeModel("Node 1", "rgb(0,192,255)");
    let port = node1.addOutPort("Out");
    node1.setPosition(100, 100);
   
    //3-B) create another default node
    var node2 = new SRD.DefaultNodeModel("Node 2", "rgb(192,255,0)");
    let port2 = node2.addInPort("In");
    node2.setPosition(400, 100);
   
    // link the ports
    let link1 = port.link(port2);
   
    this.activeModel.addAll(node1, node2, link1);
   

3. Go to file Go to file: .demos/demo-drag-and-drop/components/BodyWidget.tsx

4. From that file, add property to DiagramWidget to enable smart routing <DiagramWidget className="srd-demo-canvas" diagramEngine={this.props.app.getDiagramEngine()} smartRouting={true} />

5. Run the project. ie. npm run storybook.

6. On application, under Advance Techniques-> Large application, try to drag In Node from side panel inside DiagramWidget then move around that In Node within area. Look inside console of browser, you will found the same error.

[AnderLuiz]

Same behavior.

added engine.recalculatePortsVisually(); before this.forceUpdate(); on onDrop event. Worked for me with version 5.2.1

[AnderLuiz]

@frank-martinez-27 , before this line

this.props.app.getDiagramEngine().recalculatePortsVisually()