Second iteration of UI tests for datamapper

this part is enough to have non-regression tests for #747 when launched on Windows Signed-off-by: Aurélien Pupier <[email protected]>
KaotoIO · Dec 24, 2024 · c98210e · c98210e
1 parent a1ae844
commit c98210e
Show file tree

Hide file tree

Showing 3 changed files with 99 additions and 15 deletions.
diff --git a/it-tests/BasicFlow.test.ts b/it-tests/BasicFlow.test.ts
@@ -1,4 +1,4 @@
-import { By, EditorView, until, VSBrowser, WebDriver, WebView, logging } from 'vscode-extension-tester';
+import { By, EditorView, until, VSBrowser, WebDriver, WebView, logging, InputBox } from 'vscode-extension-tester';
 import { assert } from 'chai';
 import * as path from 'path';
 import { checkEmptyCanvasLoaded, checkTopologyLoaded, openAndSwitchToKaotoFrame } from './Util';
@@ -114,7 +114,7 @@ describe('Kaoto basic development flow', function () {
   });
 
 
-  it('Open empty file, add a datamapper step and save', async function () {
+  it.only('Open empty file, add a datamapper step and save', async function () {
     let { kaotoWebview, kaotoEditor } = await openAndSwitchToKaotoFrame(
       workspaceFolder,
       'for_datamapper_test.camel.yaml',
@@ -127,6 +127,21 @@ describe('Kaoto basic development flow', function () {
     await addDatamapperStep(driver);
     await checkStepWithTestIdOrNodeLabelPresent(driver, 'custom-node__kaoto-datamapper', 'kaoto-datamapper');
 
+    await openDataMapperEditor(driver);
+
+    await addXsdForSource(driver, kaotoWebview);
+
+// TODO: Add a target xsd
+// TODO: Map an element
+
+    await (await driver.findElement(By.css('a[data-testid="design-tab"]'))).click();
+
+    const files = fs.readdirSync(workspaceFolder);
+    const xslFiles = files.filter(file => file.endsWith('.xsl'));
+    assert.isTrue(xslFiles.length === 1, `Expected one xsl file created, found ${xslFiles.length}`);
+
+    await deleteDataMapperStep(driver, workspaceFolder);
+
     await kaotoWebview.switchBack();
     assert.isTrue(
       await kaotoEditor.isDirty(),
@@ -139,16 +154,6 @@ describe('Kaoto basic development flow', function () {
 
     const editorView = new EditorView();
     await editorView.closeAllEditors();
-
-    ({ kaotoWebview, kaotoEditor } = await openAndSwitchToKaotoFrame(
-      workspaceFolder,
-      'for_datamapper_test.camel.yaml',
-      driver,
-      true
-    ));
-    globalKaotoWebView = kaotoWebview;
-    await checkStepWithTestIdOrNodeLabelPresent(driver, 'custom-node__kaoto-datamapper', 'kaoto-datamapper');
-    await kaotoWebview.switchBack();
   });
 
   it('Open Camel file and check Kaoto UI is loading', async function () {
@@ -188,6 +193,54 @@ describe('Kaoto basic development flow', function () {
 
 });
 
+async function addXsdForSource(driver: WebDriver, kaotoWebview: WebView) {
+  await driver.wait(
+    until.elementLocated(By.css('button[data-testid="attach-schema-sourceBody-Body-button"]')),
+    5000, 'Cannot find the button to attach the schema');
+  await (await driver.findElement(By.css('button[data-testid="attach-schema-sourceBody-Body-button"]'))).click();
+
+  await kaotoWebview.switchBack();
+  const xsdInputbox = await InputBox.create(10000);
+  await xsdInputbox.setText('shiporder.xsd');
+  await xsdInputbox.confirm();
+
+  //TODO: check content is loaded
+  await kaotoWebview.switchToFrame();
+  await driver.wait(
+    until.elementLocated(By.xpath('//div[starts-with(@data-testid, "node-source-field-shiporder-")]'))
+    , 5000
+    , 'Root of the imported xsd is not displayed in the UI');
+}
+
+async function openDataMapperEditor(driver: WebDriver) {
+  const kaotoNode = await driver.findElement(By.css('g[data-testid^="custom-node__kaoto-datamapper"],g[data-testid="custom-node__route.from.steps.0.kaoto-datamapper"]'));
+  await kaotoNode.click();
+  await driver.wait(
+    until.elementLocated(By.css('button[title="Click to launch the Kaoto DataMapper editor"]')),
+    5000, 'Cannot find the button to open the datamapper');
+  await (await driver.findElement(By.css('button[title="Click to launch the Kaoto DataMapper editor"]'))).click();
+}
+
+async function deleteDataMapperStep(driver: WebDriver, workspaceFolder: string) {
+  await checkStepWithTestIdOrNodeLabelPresent(driver, 'custom-node__kaoto-datamapper', 'kaoto-datamapper');
+  const kaotoNodeConfigured = await driver.findElement(By.css('g[data-testid^="custom-node__kaoto-datamapper"],g[data-testid="custom-node__route.from.steps.0.kaoto-datamapper"]'));
+  await kaotoNodeConfigured.click();
+  await driver.wait(
+    until.elementLocated(By.css('button[data-testid="step-toolbar-button-delete"]'))
+  );
+  await (await driver.findElement(By.css('button[data-testid="step-toolbar-button-delete"]'))).click();
+  await driver.wait(
+    until.elementLocated(By.css('button[data-testid="action-confirmation-modal-btn-del-step-and-file"]'))
+  );
+  await (await driver.findElement(By.css('button[data-testid="action-confirmation-modal-btn-del-step-and-file"]'))).click();
+
+  await waitUntil(() => {
+    const filesAfterDeletion = fs.readdirSync(workspaceFolder);
+    const xslFilesAfterDeletion = filesAfterDeletion.filter(file => file.endsWith('.xsl'));
+    return xslFilesAfterDeletion.length === 0;
+  });
+}
+
 async function createNewRoute(driver: WebDriver) {
   await (await driver.findElement(By.xpath("//button[@data-testid='dsl-list-btn']"))).click();
 }
@@ -234,9 +287,6 @@ async function addDatamapperStep(driver: WebDriver) {
   ));
 
   await (await driver.findElement(By.xpath("//div[@data-testid='tile-kaoto-datamapper']"))).click();
-
-  const kaotoNode = await driver.findElement(By.css('g[data-testid^="custom-node__kaoto-datamapper"],g[data-testid="custom-node__route.from.steps.0.kaoto-datamapper"]'));
-  await kaotoNode.click();
 }
 
 /**

diff --git a/test Fixture with speci@l chars/.kaoto b/test Fixture with speci@l chars/.kaoto
@@ -0,0 +1 @@
+{}
diff --git a/test Fixture with speci@l chars/shiporder.xsd b/test Fixture with speci@l chars/shiporder.xsd
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema">
+
+    <xs:element name="shiporder">
+        <xs:complexType>
+            <xs:sequence>
+                <xs:element name="orderperson" type="xs:string" />
+                <xs:element name="shipto">
+                    <xs:complexType>
+                        <xs:sequence>
+                            <xs:element name="name" type="xs:string" />
+                            <xs:element name="address" type="xs:string" />
+                            <xs:element name="city" type="xs:string" />
+                            <xs:element name="country" type="xs:string" />
+                        </xs:sequence>
+                    </xs:complexType>
+                </xs:element>
+                <xs:element name="item" maxOccurs="unbounded">
+                    <xs:complexType>
+                        <xs:sequence>
+                            <xs:element name="title" type="xs:string" />
+                            <xs:element name="note" type="xs:string" minOccurs="0" />
+                            <xs:element name="quantity" type="xs:positiveInteger" />
+                            <xs:element name="price" type="xs:decimal" />
+                        </xs:sequence>
+                    </xs:complexType>
+                </xs:element>
+            </xs:sequence>
+            <xs:attribute name="orderid" type="xs:string" use="required" />
+        </xs:complexType>
+    </xs:element>
+
+</xs:schema>