Config issues when attempting to use react-d3-graph with GoldenLayout

[michaelbdavid]

Describe the bug When using react-d3-graph with Goldenlayout. So that I can have multiple instances of graph. I've noticed that it appears sharing the same config across multiple instances of Graph causes issues. I've seen instances where the graph completely does not show to little things like directed arrows not showing up or the graph does not layout. Please see: https://codesandbox.io/live/jq001cy as an example.

It seems like the first graph that is loaded is fine but every graph added after that has some type of funky behavior. I should also mention if you drag one of the broken tabs to another position the graph appears to correct itself. Think it has something to do with multiple instances within the same context.

To Reproduce Steps to reproduce the behavior:

1. Look at first tab it has directional arrows
2. Look at second tab arrows are missing 3.Look at third tab arrows are missing as well

Expected behavior All tabs would look and behave as the first tab.

Screenshots https://codesandbox.io/live/jq001cy

Environment:

• OS: [e.g. iOS]
• Browser chrome
• Version 84.0.4147.89 (Official Build) (64-bit)
• "d3": "5.5.0", "golden-layout": "1.5.9", "jquery": "3.4.1", "react": "16.12.0", "react-d3-graph": "2.6.0", "react-dom": "16.12.0", "react-router-dom": "5.1.2", "react-scripts": "3.0.1", "uuid": "8.3.2"

[danielcaldas]

Hi @michaelbdavid thanks for all the detail. Could you please double check on the posted codesandbox link, it seems to be broken. Thanks

[michaelbdavid]

Hey @danielcaldas sorry i linked the live session try: https://codesandbox.io/s/golden-layout-react-hooks-wp3xb

[danielcaldas]

From what I can see, only the directed feature gets affected. I will tag this as a bug nonetheless.