Eclipse integration first approach

enable_cef_connection.sh

@@ -0,0 +1,23 @@
+#!/bin/bash
+
+root=$(pwd)
+
+path="$root/node_modules/playwright-core/lib/server/chromium/crBrowser.js"
+
+if [ -f "$path" ]; then
+    tmpfile=$(mktemp)
+
+    lineno=0
+    while IFS= read -r line; do
+        if [ "$lineno" -ge 300 ] && [ "$lineno" -le 307 ]; then
+            echo "// $line" >> "$tmpfile"
+        else
+            echo "$line" >> "$tmpfile"
+        fi
+        lineno=$((lineno + 1))
+    done < "$path"
+
+    mv "$tmpfile" "$path"
+else
+    echo "file does not exist."
+fi

package.json

@@ -6,11 +6,11 @@
   "author": "mattcastells <[email protected]>",
   "license": "MIT",
   "devDependencies": {
-    "@playwright/test": "^1.42.1",
+    "@playwright/test": "^1.44.1",
     "@types/node": "^20.11.30"
   },
   "scripts": {
+    "setup": "yarn install && chmod +x enable_cef_connection.sh && ./enable_cef_connection.sh",
     "test": "npx playwright test --project='chrome' --headed"
-
   }
 }

tests/eclipse_setup.ts

@@ -0,0 +1,37 @@
+import { expect } from '@playwright/test';
+import { chromium, Browser, Page } from 'playwright';
+
+export async function eclipse_setup(page?: Page): Promise<Page> {
+  let browser: Browser | undefined;
+
+  try {
+    console.log("Launching browser...");
+
+    const browser: Browser = await chromium.connectOverCDP('http://localhost:8888');
+
+    // Create a new browser context with a specific viewport size
+
+    // Create a new page within the context
+    const pages = browser.contexts()[0].pages();
+    console.log(pages);
+
+    // page = pages[0];
+    // await pages[0].goto('http://localhost:8888');
+    // Register the driver or perform additional actions here
+    // this.ctx.registerDriver(page, null);
+
+    return pages[0];
+  } catch (error) {
+    console.error('Error launching browser or creating a new page:', error);
+
+    if (browser) {
+
+      await browser.close();
+
+      console.log("Browser closed due to error");
+    }
+
+    throw error;
+  }
+}
+export default eclipse_setup;

tests/example.spec.ts

@@ -1,17 +1,61 @@
 import { test, expect, Keyboard } from '@playwright/test';
 import { setup_ide } from './ide_setup';
+import { exec } from 'child_process';
 
 test('Test example', async ({ page }) => {
   // IDE Setup
   test.setTimeout(60000)
-  const ide = process.env.IDE?.toLowerCase() ?? 'vscode'
-  console.log(ide);
 
-  await setup_ide(ide, page)
+  const ideToSetup = process.env.IDE?.toLowerCase() ?? 'eclipse'
 
-  // await page.frameLocator('iframe[class="webview ready"]').frameLocator('iframe[title="undefined"]').locator('#workflow-diagram_0').getByText('Push').click();
-  // Interact with the element inside the iframe
-  // await elementInsideIframe.click();
-  // await iframe.keyboard.press("Delete");
-  // await page.waitForTimeout(5000);
-});
+  console.log(ideToSetup);
+
+  const example = await setup_ide(ideToSetup, page)
+
+  let vscodeIframe;
+
+  let vscode = ideToSetup === 'vscode';
+
+  if (vscode) {
+    vscodeIframe = example.frameLocator('iframe[class="webview ready"]').frameLocator('iframe[title="undefined"]')
+  }
+
+  let elementXpath = '//*[contains(@class, "heading sprotty-label") and text()="KeepTp"]';
+
+  let svgElement = vscode ? await vscodeIframe.locator(elementXpath).first() : example.locator(elementXpath).first();
+
+  let textbox = vscode ? vscodeIframe.getByRole('textbox') : example.getByRole('textbox');
+
+  await svgElement?.click()
+
+  await svgElement?.dblclick()
+
+  await textbox.fill('Test');
+
+  await textbox.press('Enter');
+
+  await example.waitForTimeout(2000)
+
+  let modifiedXpath = '//*[contains(@class, "heading sprotty-label") and text()="Test"]';
+
+  expect(vscode ? vscodeIframe.locator(modifiedXpath).first() : example.locator(modifiedXpath).first()).toBeTruthy();
+
+  await example.waitForTimeout(2000)
+
+  if (ideToSetup === 'theia') {
+
+    await example.keyboard.press('Control+Z');
+
+    await example.waitForTimeout(2000)
+
+    exec("kill -9 `lsof -t -i:3000`")
+  } else if (vscode) {
+
+    exec("kill -9 `lsof -t -i:8000`")
+
+  } else if (ideToSetup === 'eclipse') {
+    await example.keyboard.press('Control+Z');
+    await example.waitForTimeout(2000)
+
+  }
+});

tests/ide_setup.ts

@@ -1,23 +1,25 @@
 import { Page } from '@playwright/test';
 import vscode_setup from './vscode_setup'; // Import setup function for Visual Studio Code
 import theia_setup from './theia_setup';
-import eclipse_setup from './eclipse_setup ';
+import eclipse_setup from './eclipse_setup';
 // import eclipse_setup from './eclipse_setup'; // Import setup function for Eclipse
 // import theia_setup from './theia_setup'; // Import setup function for Theia
 
 // Function to setup the IDE environment based on the provided IDE name
 export async function setup_ide(ide: string, page: Page) {
     // Check which IDE is provided and call the respective setup function
+    let connectToPage : Page
     if (ide === 'vscode') {
-        await vscode_setup(page); // Setup for Visual Studio Code
+        connectToPage = await vscode_setup(page); // Setup for Visual Studio Code
     } else if (ide === 'theia') {
-        await theia_setup(page); // Setup for Theia
+        connectToPage = await theia_setup(page); // Setup for Theia
     } else if (ide === 'eclipse') {
-        await eclipse_setup(page); // Setup for Eclipse
+        connectToPage = await eclipse_setup(page); // Setup for Eclipse
     } else {
         // If the IDE name is not recognized or blank, set up all IDEs
-        await vscode_setup(page); // Setup for Visual Studio Code
+        connectToPage = await vscode_setup(page); // Setup for Visual Studio Code
         // theia_setup(page); // Setup for Theia
         // eclipse_setup(page); // Setup for Eclipse
     }
+    return connectToPage;
 }

tests/theia_setup.ts

@@ -4,7 +4,7 @@ import { exec } from 'child_process';
 const path = `${__dirname.split('tests')[0]}glsp-theia-integration`
 
 async function theia_setup(page: Page) { 
-    return new Promise<void>((resolve, reject) => {
+    return new Promise<Page>((resolve, reject) => {
         try {
             const result = exec(`"cd" ${path} && "yarn" start`);
 
@@ -16,14 +16,7 @@ async function theia_setup(page: Page) {
                     await page.click('li#shell-tab-explorer-view-container');
                     await page.dblclick('//div[contains(text(), "example1.wf")]');
                     await page.waitForTimeout(3000)                    
-                    await page.waitForSelector('g#workflow-diagram_0_task0');
-                    const pushbtn = page.locator(`[id=workflow-diagram_0_task0][data-svg-metadata-parent-id]`);
-                    await pushbtn.click()
-                    await page.keyboard.down("Delete");
-                    await page.waitForTimeout(5000)
-                    await page.keyboard.press('Control+Z');
-                    await page.waitForTimeout(5000)
-                    resolve(); // Resolve the promise when 'Web UI' is available
+                    resolve(page); // Resolve the promise when 'Web UI' is available
 
                 }
             });

tests/vscode_setup.ts

@@ -4,9 +4,9 @@ import { exec } from 'child_process';
 const path = __dirname.split('tests')[0];
 
 async function vscode_setup(page: Page) { 
-    return new Promise<void>((resolve, reject) => {
+    return new Promise<Page>((resolve, reject) => {
         try {
-            const result = exec('"sh" /snap/code/155/usr/share/code/bin/code --no-sandbox serve-web');
+            const result = exec('"sh" /snap/code/current/usr/share/code/bin/code --no-sandbox serve-web');
 
             result.stdout?.on('data', async (data) => {  
                 if (data.includes('Web UI available at')) {
@@ -31,18 +31,18 @@ async function vscode_setup(page: Page) {
                     await page.waitForTimeout(3000);
                     await page.click('a.install');
 
-                    await page.waitForTimeout(5000);
+                    await page.waitForTimeout(10000);
 
                     await page.click('a[aria-label="Explorer (Ctrl+Shift+E)"]');
 
                     await page.click('div[aria-label="example"]');
                     await page.click('div[aria-label="workspace"]');
                     await page.click('div[aria-label="example1.wf"]');
                     await page.waitForTimeout(20000);
-                    await page.frameLocator('iframe[class="webview ready"]').frameLocator('iframe[title="undefined"]').locator('#workflow-diagram_0').getByText('Push').click();
-                    await page.keyboard.press("Delete");
-                    await page.waitForTimeout(10000)
-                    resolve(); // Resolve the promise when 'Web UI' is available
+                    // await page.frameLocator('iframe[class="webview ready"]').frameLocator('iframe[title="undefined"]').locator('#workflow-diagram_0').getByText('Push').click();
+                    // await page.keyboard.press("Delete");
+                    // await page.waitForTimeout(10000)
+                    resolve(page); // Resolve the promise when 'Web UI' is available
                 }
             });