From 2fba3427fce5e407b49c786444cf228f32e0e4bb Mon Sep 17 00:00:00 2001 From: anovazzi1 Date: Wed, 18 Oct 2023 16:27:35 -0300 Subject: [PATCH] sorting fields to keep the same order always and fixed group component tests' --- .../src/CustomNodes/GenericNode/index.tsx | 1 + .../tests/end-to-end/groupNode.spec.ts | 100 ------------------ src/frontend/tests/onlyFront/group.spec.ts | 50 +-------- .../inputComponent.spec.ts | 10 ++ 4 files changed, 16 insertions(+), 145 deletions(-) delete mode 100644 src/frontend/tests/end-to-end/groupNode.spec.ts rename src/frontend/tests/{end-to-end => onlyFront}/inputComponent.spec.ts (94%) diff --git a/src/frontend/src/CustomNodes/GenericNode/index.tsx b/src/frontend/src/CustomNodes/GenericNode/index.tsx index 13d9813b8..a58f7a92c 100644 --- a/src/frontend/src/CustomNodes/GenericNode/index.tsx +++ b/src/frontend/src/CustomNodes/GenericNode/index.tsx @@ -422,6 +422,7 @@ export default function GenericNode({ <> {Object.keys(data.node!.template) .filter((templateField) => templateField.charAt(0) !== "_") + .sort() .map((templateField: string, idx) => (
{data.node!.template[templateField].show && diff --git a/src/frontend/tests/end-to-end/groupNode.spec.ts b/src/frontend/tests/end-to-end/groupNode.spec.ts deleted file mode 100644 index 40be3d190..000000000 --- a/src/frontend/tests/end-to-end/groupNode.spec.ts +++ /dev/null @@ -1,100 +0,0 @@ -import { expect, test } from "@playwright/test"; - -test.describe("Group component tests", () => { - test("group test", async ({ page }) => { - await page.goto("http://localhost:3000/"); - await page.getByRole("button", { name: "Community Examples" }).click(); - await page - .locator( - "div:nth-child(7) > div:nth-child(2) > .card-component-footer-arrangement > .inline-flex" - ) - .click(); - await page - .locator( - "//html/body/div/div/div[2]/div/main/div/div/div/div[1]/div[1]/div[1]/div/div[2]/div[1]/div/div[1]/div" - ) - .click({ - modifiers: ["Control"], - }); - await page - .locator( - "//html/body/div/div/div[2]/div/main/div/div/div/div[1]/div[1]/div[1]/div/div[2]/div[2]/div/div[1]/div" - ) - .click({ - modifiers: ["Control"], - }); - await page - .locator( - "//html/body/div/div/div[2]/div/main/div/div/div/div[1]/div[1]/div[1]/div/div[2]/div[3]/div/div[1]/div" - ) - .click({ - modifiers: ["Control"], - }); - await page.getByRole("button", { name: "Group" }).click(); - expect( - await page - .locator( - "//html/body/div/div/div[2]/div/main/div/div/div/div[1]/div[1]/div[1]/div/div[2]/div/div" - ) - .isVisible() - ).toBeTruthy(); - await page.getByPlaceholder("Type something...").first().click(); - await page.getByPlaceholder("Type something...").first().fill("test"); - await page.locator(".side-bar-buttons-arrangement").click(); - expect( - await page - .locator( - "//html/body/div/div/div[2]/div/main/div/div/div/div[1]/div[1]/div/div/div[2]/div/div/div[1]/div/div[1]/div/div" - ) - .textContent() - ).toBe("test"); - await page - .locator( - "//html/body/div/div/div[2]/div/main/div/div/div/div[1]/div[1]/div[1]/div/div[2]/div/div" - ) - .locator('input[type="text"]') - .click(); - await page - .locator( - "//html/body/div/div/div[2]/div/main/div/div/div/div[1]/div[1]/div[1]/div/div[2]/div/div" - ) - .locator('input[type="text"]') - .fill("fieldValue"); - await page.locator(".side-bar-buttons-arrangement").click(); - await page - .locator( - "//html/body/div/div/div[2]/div/main/div/div/div/div[1]/div[1]/div[1]/div/div[2]/div/div/div[1]/div" - ) - .click(); - - await page - .locator( - "//html/body/div/div/div[2]/div/main/div/div/div/div[1]/div[1]/div[2]/div/span/button[3]/div/div" - ) - .click(); - await page.getByLabel("Edit").click(); - await page - .getByRole("button", { name: "zero-shot-react-description" }) - .click(); - await page.getByText("openai-functions").click(); - await page.getByRole("button", { name: "Save Changes" }).click(); - await page - .locator( - "//html/body/div/div/div[2]/div/main/div/div/div/div[1]/div[1]/div[2]/div/span/button[3]/div/div" - ) - .click(); - await page.getByLabel("Ungroup").click(); - await expect( - page.locator( - "//html/body/div/div/div[2]/div/main/div/div/div/div[1]/div[1]/div/div/div[2]/div[3]/div/div[2]/div[4]/div/div[2]/div/input" - ) - ).toHaveValue("fieldValue"); - expect( - await page - .locator( - "//html/body/div/div/div[2]/div/main/div/div/div/div[1]/div[1]/div/div/div[2]/div[2]/div/div[2]/div[5]/div/div[2]/div/button/span[1]" - ) - .textContent() - ).toBe("openai-functions"); - }); -}); diff --git a/src/frontend/tests/onlyFront/group.spec.ts b/src/frontend/tests/onlyFront/group.spec.ts index ef102192a..6a6854332 100644 --- a/src/frontend/tests/onlyFront/group.spec.ts +++ b/src/frontend/tests/onlyFront/group.spec.ts @@ -1,50 +1,9 @@ import { expect, test } from "@playwright/test"; import { readFileSync } from "fs"; -test.describe("drag and drop test", () => { +test.describe("group node test", () => { /// - test("drop collection", async ({ page }) => { - await page.routeFromHAR("harFiles/langflow.har", { - url: "**/api/v1/**", - update: false, - }); - await page.route("**/api/v1/flows/", async (route) => { - const json = { - id: "e9ac1bdc-429b-475d-ac03-d26f9a2a3210", - }; - await route.fulfill({ json, status: 201 }); - }); - await page.goto("http:localhost:3000/"); - await page.locator("span").filter({ hasText: "My Collection" }).isVisible(); - // Read your file into a buffer. - const jsonContent = readFileSync( - "tests/onlyFront/assets/collection.json", - "utf-8" - ); - - // Create the DataTransfer and File - const dataTransfer = await page.evaluateHandle((data) => { - const dt = new DataTransfer(); - // Convert the buffer to a hex array - const file = new File([data], "collection.json", { - type: "application/json", - }); - dt.items.add(file); - return dt; - }, jsonContent); - - // Now dispatch - await page.dispatchEvent('//*[@id="root"]/div/div[2]/div[2]', "drop", { - dataTransfer, - }); - expect( - await page - .locator(".main-page-flows-display") - .evaluate((el) => el.children) - ).toBeTruthy(); - }); - - test("drop flow", async ({ page }) => { + test("group and ungroup updating values", async ({ page }) => { await page.routeFromHAR("harFiles/langflow.har", { url: "**/api/v1/**", update: false, @@ -160,10 +119,11 @@ test.describe("drag and drop test", () => { ) .click(); await page.getByLabel("Ungroup").click(); - await expect(page.locator("#input-0")).toHaveValue("fieldValue"); + await expect(page.locator('//*[@id="input-2"]')).toHaveValue("fieldValue"); expect( await page - .locator('//*[@id="headlessui-listbox-button-:r4a:"]/span[1]') + .getByTestId(/.*rf__node-AgentInitializer.*/) + .getByRole("button", { name: "openai-functions" }) .textContent() ).toBe("openai-functions"); }); diff --git a/src/frontend/tests/end-to-end/inputComponent.spec.ts b/src/frontend/tests/onlyFront/inputComponent.spec.ts similarity index 94% rename from src/frontend/tests/end-to-end/inputComponent.spec.ts rename to src/frontend/tests/onlyFront/inputComponent.spec.ts index d84b2b36e..4ff7a0193 100644 --- a/src/frontend/tests/end-to-end/inputComponent.spec.ts +++ b/src/frontend/tests/onlyFront/inputComponent.spec.ts @@ -1,6 +1,16 @@ import { expect, test } from "@playwright/test"; test("InputComponent", async ({ page }) => { + await page.routeFromHAR("harFiles/langflow.har", { + url: "**/api/v1/**", + update: false, + }); + await page.route("**/api/v1/flows/", async (route) => { + const json = { + id: "e9ac1bdc-429b-475d-ac03-d26f9a2a3210", + }; + await route.fulfill({ json, status: 201 }); + }); await page.goto("http://localhost:3000/"); await page.waitForTimeout(2000);