[releng] Bump to @xyflow/react 12.10.1

CHANGELOG.adoc

@@ -24,6 +24,7 @@
 
 === Dependency update
 
+- [releng] Switch to https://github.com/xyflow/xyflow/releases/tag/@xyflow/react@12.10.1[xyflow 12.10.1]
 
 
 

integration-tests-playwright/playwright/e2e/diagrams/edge-on-edge.spec.ts

@@ -60,7 +60,8 @@ test.describe('edge on edge', () => {
     await page.getByTestId('creationhandle-right').hover();
     await page.mouse.down();
     const playwrightNode2a = new PlaywrightNode(page, 'Entity2a');
-    await playwrightNode2a.nodeLocator.hover();
+    await playwrightNode2a.nodeLocator.hover({ position: { x: 10, y: 10 } });
+    await playwrightNode2a.nodeLocator.hover({ position: { x: 50, y: 50 } });
     await page.mouse.up();
     await page.getByTestId('connectorContextualMenu-E1toE2A').click();
     await expect(edges).toHaveCount(1);
@@ -70,7 +71,8 @@ test.describe('edge on edge', () => {
     await page.getByTestId('creationhandle-bottom').hover();
     await page.mouse.down();
     const playwrightNode2b = new PlaywrightNode(page, 'Entity2b');
-    await playwrightNode2b.nodeLocator.hover();
+    await playwrightNode2b.nodeLocator.hover({ position: { x: 10, y: 10 } });
+    await playwrightNode2b.nodeLocator.hover({ position: { x: 50, y: 50 } });
     await page.mouse.up();
     await expect(edges).toHaveCount(2);
     //Create node to edge

integration-tests-playwright/playwright/e2e/diagrams/edge-reconnection.spec.ts

@@ -11,7 +11,7 @@
  *     Obeo - initial API and implementation
  *******************************************************************************/
 
-import { test, expect } from '@playwright/test';
+import { expect, test } from '@playwright/test';
 import { PlaywrightDetails } from '../../helpers/PlaywrightDetails';
 import { PlaywrightEdge } from '../../helpers/PlaywrightEdge';
 import { PlaywrightExplorer } from '../../helpers/PlaywrightExplorer';
@@ -53,7 +53,8 @@ test.describe('edge - reconnection', () => {
     const sourceReconnectHandle = page.locator(`.react-flow__edgeupdater-source`).first();
     await sourceReconnectHandle.hover();
     await page.mouse.down();
-    await page.mouse.move(newSourceNodeXYPosition.x + newSourceNodeXYPosition.width / 2, newSourceNodeXYPosition.y);
+    await page.mouse.move(newSourceNodeXYPosition.x + newSourceNodeXYPosition.width / 2, newSourceNodeXYPosition.y / 2);
+    await page.mouse.move(newSourceNodeXYPosition.x + newSourceNodeXYPosition.width / 2, newSourceNodeXYPosition.y + 5);
     await page.mouse.up();
 
     await page.waitForFunction(() => !!document.querySelector('[data-testid="DataSource2-toggle"]'));

integration-tests-playwright/playwright/e2e/diagrams/edge.spec.ts

@@ -40,6 +40,9 @@ test.describe('edge', () => {
 
   test('when a bend point is moved, then the edge path is changed', async ({ page }) => {
     const playwrightEdge = new PlaywrightEdge(page);
+    const playwrightNode = new PlaywrightNode(page, 'CompositeProcessor1');
+    await playwrightNode.click();
+    await playwrightNode.move({ x: 200, y: 50 });
 
     await playwrightEdge.click();
     await playwrightEdge.isSelected();
@@ -50,7 +53,7 @@ test.describe('edge', () => {
     const box = (await lastBendingPoint.boundingBox())!;
     await lastBendingPoint.hover();
     await page.mouse.down();
-    await page.mouse.move(box.x - 40, box.y + 40, { steps: 2 });
+    await page.mouse.move(box.x - 40, box.y + 80, { steps: 2 });
     await page.mouse.up();
 
     const edgePathAfter = playwrightEdge.getEdgePath();
@@ -63,7 +66,7 @@ test.describe('edge', () => {
   }) => {
     const playwrightNode = new PlaywrightNode(page, 'CompositeProcessor1');
     await playwrightNode.click();
-    await playwrightNode.move({ x: 200, y: 50 });
+    await playwrightNode.move({ x: 200, y: 150 });
 
     const playwrightEdge = new PlaywrightEdge(page);
 
@@ -144,7 +147,7 @@ test.describe('edge', () => {
     const dataSource = new PlaywrightNode(page, 'DataSource1');
     const edge = new PlaywrightEdge(page);
     await compositeProcessor.click();
-    await compositeProcessor.move({ x: 150, y: 50 });
+    await compositeProcessor.move({ x: 150, y: 150 });
 
     await expect(edge.edgeLocator).toBeAttached();
 
@@ -392,7 +395,7 @@ test.describe('edge', () => {
 
     const playwrightEdge = new PlaywrightEdge(page);
 
-    await playwrightEdge.edgeLocator.locator('path').first().click({ button: 'right' });
+    await playwrightEdge.edgeLocator.locator('.react-flow__edge-interaction').first().click({ button: 'right' });
     await page.getByTestId('toolSection-Appearance').click();
     await page.locator('[data-testid="toolSection-Appearance-Edge Type"]').click();
     await page.waitForSelector('.MuiMenu-paper');

integration-tests-playwright/playwright/e2e/diagrams/list.spec.ts

@@ -11,10 +11,10 @@
  *     Obeo - initial API and implementation
  *******************************************************************************/
 import { expect, test } from '@playwright/test';
+import { PlaywrightDetails } from '../../helpers/PlaywrightDetails';
 import { PlaywrightExplorer } from '../../helpers/PlaywrightExplorer';
 import { PlaywrightNode } from '../../helpers/PlaywrightNode';
 import { PlaywrightProject } from '../../helpers/PlaywrightProject';
-import { PlaywrightDetails } from '../../helpers/PlaywrightDetails';
 
 test.describe('diagram - list', () => {
   let projectId;
@@ -123,6 +123,7 @@ test.describe('diagram - list', () => {
     page,
   }) => {
     const parentNode = new PlaywrightNode(page, 'Test with a very large name that can be wrap', 'List');
+
     const firstChildNode = new PlaywrightNode(page, 'List 1', 'List');
     await parentNode.click();
     const firstChildXYPositionBefore = await firstChildNode.getDOMXYPosition();
@@ -132,11 +133,12 @@ test.describe('diagram - list', () => {
     const box = (await resizeAnchor.boundingBox())!;
     await resizeAnchor.hover();
     await page.mouse.down();
-    await page.mouse.move(box.x + 100, box.y, { steps: 8 });
+    await page.mouse.move(box.x + 200, box.y, { steps: 8 });
 
     await page.waitForFunction(
       ({ previousY }) => {
         const child = document.querySelector(`[data-testid="List - List 1"]`);
+
         if (!child) {
           return false;
         }