Fix timing issues

Fix timing issues when invoking the commandpalette
and deleting elements from the explorer

e2e-tests/src/page-objects/cm-explorer-view.ts

@@ -26,4 +26,13 @@ export class CMExplorerView extends TheiaExplorerView {
       }
       return undefined;
    }
+
+   /**
+    * Override the `deleteNode` method to wait for the file nodes to decrease after a node is deleted
+    */
+   override async deleteNode(path: string, confirm?: boolean | undefined, nodeSegmentLabel?: string | undefined): Promise<void> {
+      const fileStatElements = await this.visibleFileStatNodes();
+      await super.deleteNode(path, confirm, nodeSegmentLabel);
+      await this.waitForFileNodesToDecrease(fileStatElements.length);
+   }
 }

e2e-tests/src/page-objects/system-diagram/integrated-system-diagram-editor.ts

@@ -2,7 +2,7 @@
  * Copyright (c) 2024 CrossBreeze.
  ********************************************************************************/
 
-import { GLSPBaseCommandPalette, PModelElement, PModelElementConstructor } from '@eclipse-glsp/glsp-playwright';
+import { GLSPBaseCommandPalette, InteractablePosition, PModelElement, PModelElementConstructor } from '@eclipse-glsp/glsp-playwright';
 import { OSUtil, normalizeId, urlEncodePath } from '@theia/playwright';
 import { join } from 'path';
 import { CMCompositeEditor, hasViewError } from '../cm-composite-editor';
@@ -65,7 +65,37 @@ export class IntegratedSystemDiagramEditor extends IntegratedEditor {
    async selectEntityAndOpenProperties(entityLabel: string): Promise<EntityPropertiesView> {
       const entity = await this.diagram.graph.getNodeByLabel(entityLabel, Entity);
       await entity.select();
-      return this.app.openView(EntityPropertiesView);
+      const view = new EntityPropertiesView(this.app);
+      if (!(await view.isTabVisible())) {
+         await this.page.keyboard.press('Alt+Shift+P');
+      }
+      await view.activate();
+      return view;
+   }
+
+   /**
+    * Invoke the 'Show` tool at the given position.
+    * i.e. select the tool and click at the given position.
+    */
+   async invokeShowToolAtPosition(position: InteractablePosition): Promise<void> {
+      await this.enableTool('Show Entity');
+      // Wait for the insert-indicator to appear
+      await this.page.waitForSelector('.insert-indicator', { state: 'attached' });
+      await position.move();
+      // Wait for the insert-indicator to be moved to the correct position
+      await this.page.waitForFunction(
+         ({ expectedPosition, tolerance }) => {
+            const insertIndicator = document.querySelector('.insert-indicator');
+            const boundingBox = insertIndicator?.getBoundingClientRect();
+            if (!boundingBox) {
+               return false;
+            }
+            const { x, y } = boundingBox;
+            return Math.abs(x - expectedPosition.x) <= tolerance && Math.abs(y - expectedPosition.y) <= tolerance;
+         },
+         { expectedPosition: position.data, tolerance: 20 }
+      );
+      await position.click();
    }
 
    waitForModelUpdate(executor: () => Promise<void>, options?: WaitForModelUpdateOptions): Promise<void> {

e2e-tests/src/tests/diagram/system/add-edit-delete-attributes.spec.ts

@@ -84,15 +84,16 @@ test.describe.serial('Add/Edit/Delete attributes to/from an entity in a diagram'
       const form = await propertyView.form();
       await diagramEditor.waitForModelUpdate(async () => {
          await form.attributesSection.deleteAttribute('Renamed Attribute');
+         await form.waitForDirty();
       });
 
       // Verify that the attribute was deleted as expected from the properties view
-      await form.waitForDirty();
       const attribute = await form.attributesSection.findAttribute('Renamed Attribute');
       expect(attribute).toBeUndefined();
       await propertyView.saveAndClose();
 
       // Verify that the attribute was deleted as expected from the diagram
+      await diagramEditor.activate();
       const entity = await diagramEditor.getEntity(ENTITY_ID);
       const attributeNodes = await entity.children.attributes();
       expect(attributeNodes).toHaveLength(0);

e2e-tests/src/tests/diagram/system/add-edit-delete-entity.spec.ts

@@ -85,25 +85,27 @@ test.describe.serial('Add/Edit/Delete entity in a diagram ', () => {
          await diagramEditor.enableTool('Hide');
          await renamedEntity.click();
       });
+      await app.page.waitForTimeout(250);
 
       // Check if entity is actually just hidden, i.e. can be shown again
-      // await diagramEditor.diagram.globalCommandPalette.open();
-      // const entitySuggestions = await diagramEditor.diagram.globalCommandPalette.suggestions();
-      // expect(entitySuggestions).toContain(NEW_ENTITY_LABEL);
+      const position = (await diagramEditor.diagram.graph.bounds()).position('middle_center');
+      await diagramEditor.invokeShowToolAtPosition(position);
+      const entitySuggestions = await diagramEditor.diagram.globalCommandPalette.suggestions();
+      expect(entitySuggestions).toContain(NEW_ENTITY_LABEL);
 
       await diagramEditor.saveAndClose();
    });
 
    test('Delete new entity', async () => {
       const explorer = await app.openExplorerView();
       await explorer.deleteNode(NEW_ENTITY_PATH, true);
-
+      expect(await explorer.findTreeNode(NEW_ENTITY_PATH)).toBeUndefined();
       // Check if entity is actually deleted, i.e. can not be shown (using keyboard shortcut)
       const diagramEditor = await app.openCompositeEditor(SYSTEM_DIAGRAM_PATH, 'System Diagram');
-
-      // await diagramEditor.diagram.globalCommandPalette.open();
-      // const entitySuggestions = await diagramEditor.diagram.globalCommandPalette.suggestions();
-      // expect(entitySuggestions).not.toContain(NEW_ENTITY_LABEL);
+      const position = (await diagramEditor.diagram.graph.bounds()).position('middle_center');
+      await diagramEditor.invokeShowToolAtPosition(position);
+      const entitySuggestions = await diagramEditor.diagram.globalCommandPalette.suggestions();
+      expect(entitySuggestions).not.toContain(NEW_ENTITY_LABEL);
       await diagramEditor.close();
    });
 });

e2e-tests/src/tests/diagram/system/add-existing-entity.spec.ts

@@ -24,8 +24,7 @@ test.describe.serial('Add existing entity to a diagram', () => {
       // Create new entity
       await diagram.graph.waitForCreationOfType(Entity, async () => {
          const position = (await diagram.graph.bounds()).position('middle_center');
-         await diagramEditor.enableTool('Show Entity');
-         await position.click();
+         await diagramEditor.invokeShowToolAtPosition(position);
          await diagram.globalCommandPalette.search(CUSTOMER_ID, { confirm: true });
       });
 

e2e-tests/src/tests/form/add-edit-delete-entity.spec.ts

@@ -81,9 +81,7 @@ test.describe('Add/Edit/Delete entity from explorer', () => {
       expect(await explorer.existsFileNode(NEW_ENTITY2_PATH)).toBeTruthy();
 
       // Delete node
-      const fileStatElements = await explorer.visibleFileStatNodes();
       await explorer.deleteNode(NEW_ENTITY2_PATH);
-      await explorer.waitForFileNodesToDecrease(fileStatElements.length);
       expect(await explorer.findTreeNode(NEW_ENTITY2_PATH)).toBeUndefined();
    });
 });

e2e-tests/src/tests/form/add-edit-delete-relationship.spec.ts

@@ -71,9 +71,7 @@ test.describe('Add/Edit/Delete relationship from explorer', () => {
 
    test('Delete relationship via context menu', async () => {
       const explorer = await app.openExplorerView();
-      const fileStatElements = await explorer.visibleFileStatNodes();
       await explorer.deleteNode(NEW_RELATIONSHIP_PATH);
-      await explorer.waitForFileNodesToDecrease(fileStatElements.length);
       expect(await explorer.findTreeNode(NEW_RELATIONSHIP_PATH)).toBeUndefined();
    });
 });