Empty edge.sections array on layout

[jbeard4]

Please consider the following reduced example.

Given the following JSON:

{
  "id": "root",
  "labels": [
    {
      "text": "root"
    }
  ],
  "edges": [
    {
      "id": "a1:0",
      "sources": [
        "a1"
      ],
      "targets": [
        "A"
      ],
      "labels": [
        {
          "text": "e"
        }
      ]
    },
    {
      "id": "$generated_A_initial_0:0",
      "sources": [
        "$generated_A_initial_0"
      ],
      "targets": [
        "a1"
      ],
      "labels": []
    },
    {
      "id": "$generated_root_initial_0:0",
      "sources": [
        "$generated_root_initial_0"
      ],
      "targets": [
        "A"
      ],
      "labels": []
    }
  ],
  "children": [
    {
      "id": "A",
      "labels": [
        {
          "text": "A"
        }
      ],
      "edges": [],
      "children": [
        {
          "id": "a1",
          "labels": [
            {
              "text": "a1"
            }
          ],
          "edges": []
        },
        {
          "id": "a2",
          "labels": [
            {
              "text": "a2"
            }
          ],
          "edges": []
        },
        {
          "id": "$generated_A_initial_0",
          "labels": [],
          "edges": []
        }
      ]
    },
    {
      "id": "$generated_root_initial_0",
      "labels": [],
      "edges": []
    }
  ]
}

Calling elk.layout generates the following graph:

{
  "id": "root",
  "labels": [
    {
      "text": "root",
      "x": 0,
      "y": 0,
      "width": 0,
      "height": 0
    }
  ],
  "edges": [
    {
      "id": "a1:0",
      "sources": [
        "a1"
      ],
      "targets": [
        "A"
      ],
      "labels": [
        {
          "text": "e",
          "width": 2.046875,
          "height": 4.484375,
          "x": 0,
          "y": 0
        }
      ],
      "sections": []
    },
    {
      "id": "$generated_A_initial_0:0",
      "sources": [
        "$generated_A_initial_0"
      ],
      "targets": [
        "a1"
      ],
      "labels": [],
      "sections": [
        {
          "id": "$generated_A_initial_0:0_s0",
          "startPoint": {
            "x": 16,
            "y": 38.2265625
          },
          "endPoint": {
            "x": 36,
            "y": 38.2265625
          }
        }
      ]
    },
    {
      "id": "$generated_root_initial_0:0",
      "sources": [
        "$generated_root_initial_0"
      ],
      "targets": [
        "A"
      ],
      "labels": [],
      "sections": [
        {
          "id": "$generated_root_initial_0:0_s0",
          "startPoint": {
            "x": 16,
            "y": 39.484375
          },
          "endPoint": {
            "x": 36,
            "y": 39.484375
          }
        }
      ]
    }
  ],
  "children": [
    {
      "id": "A",
      "labels": [
        {
          "text": "A",
          "x": 0,
          "y": 0,
          "width": 0,
          "height": 0
        }
      ],
      "edges": [],
      "children": [
        {
          "id": "a1",
          "labels": [
            {
              "text": "a1",
              "x": 0,
              "y": 0,
              "width": 0,
              "height": 0
            }
          ],
          "edges": [],
          "x": 36,
          "y": 33.484375,
          "width": 9.015625,
          "height": 9.484375,
          "$H": 376
        },
        {
          "id": "a2",
          "labels": [
            {
              "text": "a2",
              "x": 0,
              "y": 0,
              "width": 0,
              "height": 0
            }
          ],
          "edges": [],
          "x": 12,
          "y": 12,
          "width": 9.015625,
          "height": 9.484375,
          "$H": 379
        },
        {
          "id": "$generated_A_initial_0",
          "labels": [],
          "edges": [],
          "x": 12,
          "y": 36.2265625,
          "width": 4,
          "height": 4,
          "$H": 382
        }
      ],
      "x": 36,
      "y": 12,
      "width": 57.015625,
      "height": 54.96875,
      "$H": 373
    },
    {
      "id": "$generated_root_initial_0",
      "labels": [],
      "edges": [],
      "x": 12,
      "y": 37.484375,
      "width": 4,
      "height": 4,
      "$H": 384
    }
  ],
  "width": 105.015625,
  "height": 78.96875,
  "$H": 370,
  "x": 0,
  "y": 0
}

Expected behavior: the edge with id "a1:0" should have populated array sections. Actual behavior: the edge with id "a1:0" has empty array sections.

Note that this bug does not occur when using primitive edge format, as described here:https://www.eclipse.org/elk/documentation/tooldevelopers/graphdatastructure/jsonformat.html

In that case, the graph is layed out as follows:

Thank you for your help looking into this.

[uruuru]

Edit: it's not correct what I said before. I'll look into it :).

[uruuru]

Maybe my first comment was partly correct after all: Setting layoutOptions: { "hierarchyHandling": "INCLUDE_CHILDREN" } should give you proper sections for the edge. Note that in klayjs that value of hierarchyHandling was default, which is not the case anymore.

I'm still a bit puzzled by the fact that you say it works with simple edges. The layout of the drawing you included, is it created with elkjs+simple edges? I presume the small triangles are ports in your full model.

[uruuru]

Should be fixed by ELK commit ff1fb01 to be included in 0.4.0.