yWorks/yfiles-for-html-demos

The React demo issue removing/resetting graph

hammerhg opened this issue · 2 comments

hammerhg commented

Describe the bug
When the demo at https://github.com/yWorks/yfiles-for-html-demos/tree/master/demos/toolkit/react is run the demo allows to add Nodes to the graph, but whenever you try to reset the graph using the reset button or remove any node one gets following error message:

Unhandled Rejection (ArgumentError): Affected parameter edge: Edge not in this graph!

ReactGraphComponent.updateGraph
src/components/ReactGraphComponent.jsx:196

193 | // update the graph based on the given graph data
194 | this.graphBuilder.setData(this.nodesSource, this.props.graphData.nodesSource)
195 | this.graphBuilder.setData(this.edgesSource, this.props.graphData.edgesSource)
->196 | this.graphBuilder.updateGraph()
197 | ^
198 | // apply a layout to re-arrange the new elements
199 | const layoutExecutor = new LayoutExecutor(this.graphComponent, new HierarchicLayout())

To Reproduce
Steps to reproduce the behavior:

  1. Run the project with > npm start wait for the Demo to start in the browser
  2. Click on 'Remove Node' button
  3. See the error

OR

  1. Run the project with > npm start wait for the Demo to start in the browser
  2. Click on 'Add Node' button
  3. Click on 'Reset' button (left top)
  4. See the error

Expected behavior
Remove the node and refresh the graph.

Browser (please complete the following information):
Full User Agent String
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.105 Safari/537.36

Additional context
Further debugging shows, that for some reason
this.graphBuilder.setData(this.nodesSource, this.props.graphData.nodesSource) this.graphBuilder.setData(this.edgesSource, this.props.graphData.edgesSource)

setData method internally compares the nodes and edges given in the props and cannot identify the node to be removed.

yGuy commented

Thank you very much for the report. We are/were aware of this problem and have implemented a fix, already. In fact the fix for this will be in version 2.3.0.2 of yFiles for HTML which will be released later this week. The demos should be updated shortly, probably later today. A workaround in the meantime is to call updateGraph() twice, after each call to setData() - the bug happens when there are two changes in different data sources at the same time.

hammerhg commented

Thanks for quick response