[1102] Fix the node label positioning

Bug: #1102
Signed-off-by: Laurent Fasani <[email protected]>

CHANGELOG.adoc

@@ -57,6 +57,7 @@
 - [diagram] Fix an issue preventing the resizing of a node if the cursor had not moved after a previous resizing
 - https://github.com/eclipse-sirius/sirius-components/issues/1075[#1075] [compatibility] Use the proper icon feature for OperationAction
 - https://github.com/eclipse-sirius/sirius-components/issues/1104[#1104] [diagram] Fix the image base path during the SVG export
+- https://github.com/eclipse-sirius/sirius-components/issues/1104[#1102] [diagram] Fix the node label positioning (rectangle, list and list item)
 
 === Improvements
 

backend/sirius-components-collaborative-diagrams/src/main/java/org/eclipse/sirius/components/collaborative/diagrams/export/svg/DiagramElementExportService.java

@@ -121,9 +121,6 @@ private StringBuilder exportTextElement(String text, String type, LabelStyle lab
         textExport.append("style=\""); //$NON-NLS-1$
         textExport.append("fill: " + labelStyle.getColor() + "; "); //$NON-NLS-1$ //$NON-NLS-2$
         textExport.append(this.exportFont(labelStyle));
-        if (type.contains("center")) { //$NON-NLS-1$
-            textExport.append("text-anchor:middle"); //$NON-NLS-1$
-        }
         textExport.append("\">"); //$NON-NLS-1$
 
         String[] lines = text.split("\\n", -1); //$NON-NLS-1$

backend/sirius-components-diagrams-layout/src/main/java/org/eclipse/sirius/components/diagrams/layout/ELKLayoutedDiagramProvider.java

@@ -76,13 +76,7 @@ private Node getLayoutedNode(Node node, ElkConnectableShape elkConnectableShape,
         Size size = Size.of(elkConnectableShape.getWidth(), elkConnectableShape.getHeight());
         Position position = Position.at(elkConnectableShape.getX(), elkConnectableShape.getY());
 
-        double xOffSet = 0;
-        if (!node.isBorderNode()) {
-            // The label is positioned at the center of the node and the front-end will apply a "'text-anchor':
-            // 'middle'" property.
-            xOffSet = node.getLabel().getSize().getWidth() / 2;
-        }
-        Label label = this.getLayoutedLabel(node.getLabel(), id2ElkGraphElements, xOffSet, 0);
+        Label label = this.getLayoutedLabel(node.getLabel(), id2ElkGraphElements, 0, 0);
 
         List<Node> childNodes = this.getLayoutedNodes(node.getChildNodes(), id2ElkGraphElements);
         List<Node> borderNodes = this.getLayoutedNodes(node.getBorderNodes(), id2ElkGraphElements);

backend/sirius-components-diagrams-layout/src/main/java/org/eclipse/sirius/components/diagrams/layout/incremental/provider/NodeLabelPositionProvider.java

@@ -97,7 +97,7 @@ private double getHorizontalPosition(NodeLayoutData node, LabelLayoutData label,
                 double portOffset = Optional.ofNullable(this.layoutConfigurator.configureByType(node.getNodeType()).getProperty(CoreOptions.PORT_BORDER_OFFSET)).orElse(0.);
                 double offSetAccordingToBorderNodes = -portOffset / 2 * (shiftToEast - shiftToWest);
 
-                x = node.getSize().getWidth() / 2 + offSetAccordingToBorderNodes;
+                x = (node.getSize().getWidth() - label.getTextBounds().getSize().getWidth()) / 2 + offSetAccordingToBorderNodes;
                 break;
             case H_RIGHT:
                 if (outside) {

backend/sirius-components-diagrams-layout/src/test/java/org/eclipse/sirius/components/diagrams/layout/incremental/NodeLabelPositionProviderTests.java

@@ -14,7 +14,7 @@
 
 import static org.assertj.core.api.Assertions.assertThat;
 
-import java.util.ArrayList;
+import java.util.Collections;
 import java.util.List;
 import java.util.UUID;
 
@@ -62,8 +62,8 @@ public void testNodeImageLabelBoundsPosition() {
         NodeLabelPositionProvider labelBoundsProvider = new NodeLabelPositionProvider(new LayoutConfiguratorRegistry(List.of()).getDefaultLayoutConfigurator());
         LabelLayoutData labelLayoutData = this.createLabelLayoutData();
 
-        Position position = labelBoundsProvider.getPosition(nodeLayoutData, labelLayoutData, new ArrayList<>());
-        assertThat(position).extracting(Position::getX).isEqualTo(Double.valueOf(DEFAULT_NODE_SIZE.getWidth() / 2));
+        Position position = labelBoundsProvider.getPosition(nodeLayoutData, labelLayoutData, Collections.emptyList());
+        assertThat(position).extracting(Position::getX).isEqualTo(Double.valueOf(42.5390625));
         assertThat(position).extracting(Position::getY).isEqualTo(Double.valueOf(-23.3984375));
     }
 
@@ -73,8 +73,8 @@ public void testNodeRectangleLabelBoundsPosition() {
         NodeLayoutData nodeLayoutData = this.createNodeLayoutData(Position.at(0, 0), DEFAULT_NODE_SIZE, createDiagramLayoutData, NodeType.NODE_RECTANGLE);
         NodeLabelPositionProvider labelBoundsProvider = new NodeLabelPositionProvider(new LayoutConfiguratorRegistry(List.of()).getDefaultLayoutConfigurator());
         LabelLayoutData labelLayoutData = this.createLabelLayoutData();
-        Position position = labelBoundsProvider.getPosition(nodeLayoutData, labelLayoutData, new ArrayList<>());
-        assertThat(position).extracting(Position::getX).isEqualTo(Double.valueOf(DEFAULT_NODE_SIZE.getWidth() / 2));
+        Position position = labelBoundsProvider.getPosition(nodeLayoutData, labelLayoutData, Collections.emptyList());
+        assertThat(position).extracting(Position::getX).isEqualTo(Double.valueOf(42.5390625));
         assertThat(position).extracting(Position::getY).isEqualTo(Double.valueOf(5));
     }
 

frontend/src/diagram/sprotty/views/LabelView.tsx

@@ -75,11 +75,8 @@ export class LabelView extends SLabelView {
         styleObject['text-decoration'] += ' line-through';
       }
     }
-    if (label.type.includes('center')) {
-      styleObject['text-anchor'] = 'middle';
-    }
-    const iconVerticalOffset = -12;
 
+    const iconVerticalOffset = -12;
     const text = label.text;
 
     const vnode = (
@@ -90,6 +87,7 @@ export class LabelView extends SLabelView {
         </text>
       </g>
     );
+
     const subType = getSubType(label);
     if (subType) {
       // @ts-ignore