From 64ba236142525b7813649ecb04ab0e6f8379ec7b Mon Sep 17 00:00:00 2001 From: cristhianzl Date: Thu, 15 Aug 2024 11:56:33 -0300 Subject: [PATCH 1/2] =?UTF-8?q?=E2=9C=A8=20(freeze.spec.ts):=20Add=20end-t?= =?UTF-8?q?o-end=20test=20for=20freezing=20a=20component=20to=20ensure=20t?= =?UTF-8?q?he=20functionality=20works=20as=20expected.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/tests/end-to-end/freeze.spec.ts | 322 +++++++++++++++++++ 1 file changed, 322 insertions(+) create mode 100644 src/frontend/tests/end-to-end/freeze.spec.ts diff --git a/src/frontend/tests/end-to-end/freeze.spec.ts b/src/frontend/tests/end-to-end/freeze.spec.ts new file mode 100644 index 000000000000..f420d51ce1ff --- /dev/null +++ b/src/frontend/tests/end-to-end/freeze.spec.ts @@ -0,0 +1,322 @@ +import { expect, test } from "@playwright/test"; +import * as dotenv from "dotenv"; +import path from "path"; + +test("user must be able to freeze a component", async ({ page }) => { + await page.goto("/"); + await page.waitForTimeout(2000); + + let modalCount = 0; + try { + const modalTitleElement = await page?.getByTestId("modal-title"); + if (modalTitleElement) { + modalCount = await modalTitleElement.count(); + } + } catch (error) { + modalCount = 0; + } + + while (modalCount === 0) { + await page.getByText("New Project", { exact: true }).click(); + await page.waitForTimeout(5000); + modalCount = await page.getByTestId("modal-title")?.count(); + } + + await page.getByRole("heading", { name: "Blank Flow" }).click(); + + //first component + + await page.getByTestId("extended-disclosure").click(); + await page.getByPlaceholder("Search").click(); + await page.getByPlaceholder("Search").fill("text input"); + await page.waitForTimeout(1000); + + await page + .getByTestId("inputsText Input") + .dragTo(page.locator('//*[@id="react-flow-id"]')); + + await page.getByTitle("zoom out").click(); + await page + .locator('//*[@id="react-flow-id"]') + .hover() + .then(async () => { + await page.mouse.down(); + await page.mouse.move(-800, 300); + }); + + await page.mouse.up(); + + //second component + + await page.getByTestId("extended-disclosure").click(); + await page.getByPlaceholder("Search").click(); + await page.getByPlaceholder("Search").fill("url"); + await page.waitForTimeout(1000); + + await page + .getByTestId("dataURL") + .dragTo(page.locator('//*[@id="react-flow-id"]')); + + await page.getByTitle("zoom out").click(); + await page + .locator('//*[@id="react-flow-id"]') + .hover() + .then(async () => { + await page.mouse.down(); + await page.mouse.move(-800, 300); + }); + + await page.mouse.up(); + + //third component + + await page.getByTestId("extended-disclosure").click(); + await page.getByPlaceholder("Search").click(); + await page.getByPlaceholder("Search").fill("split text"); + await page.waitForTimeout(1000); + + await page + .getByTestId("helpersSplit Text") + .dragTo(page.locator('//*[@id="react-flow-id"]')); + + await page.getByTitle("zoom out").click(); + await page + .locator('//*[@id="react-flow-id"]') + .hover() + .then(async () => { + await page.mouse.down(); + await page.mouse.move(-800, 300); + }); + + await page.mouse.up(); + + //fourth component + + await page.getByTestId("extended-disclosure").click(); + await page.getByPlaceholder("Search").click(); + await page.getByPlaceholder("Search").fill("parse data"); + await page.waitForTimeout(1000); + + await page + .getByTestId("helpersParse Data") + .dragTo(page.locator('//*[@id="react-flow-id"]')); + + await page.getByTitle("zoom out").click(); + await page + .locator('//*[@id="react-flow-id"]') + .hover() + .then(async () => { + await page.mouse.down(); + await page.mouse.move(-800, 300); + }); + + await page.mouse.up(); + + //fifth component + + await page.getByTestId("extended-disclosure").click(); + await page.getByPlaceholder("Search").click(); + await page.getByPlaceholder("Search").fill("chat output"); + await page.waitForTimeout(1000); + + await page + .getByTestId("outputsChat Output") + .dragTo(page.locator('//*[@id="react-flow-id"]')); + + await page.getByTitle("zoom out").click(); + await page + .locator('//*[@id="react-flow-id"]') + .hover() + .then(async () => { + await page.mouse.down(); + await page.mouse.move(-800, 300); + }); + + await page.mouse.up(); + + let outdatedComponents = await page.getByTestId("icon-AlertTriangle").count(); + + while (outdatedComponents > 0) { + await page.getByTestId("icon-AlertTriangle").first().click(); + await page.waitForTimeout(1000); + outdatedComponents = await page.getByTestId("icon-AlertTriangle").count(); + } + + await page.getByTitle("fit view").click(); + + //connection 1 + const urlOutput = await page + .getByTestId("handle-url-shownode-data-right") + .nth(0); + await urlOutput.hover(); + await page.mouse.down(); + const splitTextInputData = await page.getByTestId( + "handle-splittext-shownode-data inputs-left", + ); + await splitTextInputData.hover(); + await page.mouse.up(); + + //connection 2 + const textOutput = await page + .getByTestId("handle-textinput-shownode-text-right") + .nth(0); + await textOutput.hover(); + await page.mouse.down(); + const splitTextInput = await page.getByTestId( + "handle-splittext-shownode-separator-left", + ); + await splitTextInput.hover(); + await page.mouse.up(); + + await page.getByTitle("fit view").click(); + + //connection 3 + const splitTextOutput = await page + .getByTestId("handle-splittext-shownode-chunks-right") + .nth(0); + await splitTextOutput.hover(); + await page.mouse.down(); + const parseDataInput = await page.getByTestId( + "handle-parsedata-shownode-data-left", + ); + await parseDataInput.hover(); + await page.mouse.up(); + + //connection 4 + const parseDataOutput = await page + .getByTestId("handle-parsedata-shownode-text-right") + .nth(0); + await parseDataOutput.hover(); + await page.mouse.down(); + const chatOutputInput = await page.getByTestId( + "handle-chatoutput-shownode-text-left", + ); + await chatOutputInput.hover(); + await page.mouse.up(); + + await page.getByTitle("fit view").click(); + + await page + .getByTestId("popover-anchor-input-input_value") + .first() + .fill("lorem ipsum"); + + await page + .getByTestId("inputlist_str_urls_0") + .fill("https://www.lipsum.com/"); + + await page.getByTestId("button_run_chat output").click(); + + await page.waitForSelector("text=built successfully", { timeout: 30000 }); + + await page.getByText("built successfully").last().click({ + timeout: 15000, + }); + + await page.getByTestId("output-inspection-message").first().click(); + + await page.getByRole("gridcell").first().click(); + + const firstRunWithoutFreezing = await page + .getByPlaceholder("Empty") + .textContent(); + + await page.getByText("Close").last().click(); + await page.getByText("Close").last().click(); + + await page.getByTestId("popover-anchor-input-input_value").first().fill(","); + + await page.getByTestId("button_run_chat output").click(); + + await page.waitForSelector("text=built successfully", { timeout: 30000 }); + + await page.getByText("built successfully").last().click({ + timeout: 15000, + }); + + await page.getByTestId("output-inspection-message").first().click(); + + await page.getByRole("gridcell").first().click(); + + const secondRunWithoutFreezing = await page + .getByPlaceholder("Empty") + .textContent(); + + await page.getByText("Close").last().click(); + await page.getByText("Close").last().click(); + + await page.getByText("Split Text", { exact: true }).click(); + + await page.waitForTimeout(1000); + + await page.getByTestId("more-options-modal").click(); + + await page.waitForTimeout(1000); + + await page.getByTestId("icon-Snowflake").click(); + + await page.waitForTimeout(1000); + + await page.keyboard.press("Escape"); + + await page.locator('//*[@id="react-flow-id"]').click(); + + await page.getByTestId("int_int_chunk_size").fill("4000"); + await page.getByTestId("int_int_chunk_overlap").fill("800"); + + await page.waitForTimeout(1000); + + await page.getByTestId("button_run_chat output").click(); + + await page.waitForSelector("text=built successfully", { timeout: 30000 }); + + await page.getByText("built successfully").last().click({ + timeout: 15000, + }); + + await page.getByTestId("output-inspection-message").first().click(); + + await page.getByRole("gridcell").first().click(); + + const firstTextFreezed = await page.getByPlaceholder("Empty").textContent(); + + await page.getByText("Close").last().click(); + await page.getByText("Close").last().click(); + + await page.getByText("Split Text", { exact: true }).click(); + + await page.waitForTimeout(1000); + + await page.getByTestId("more-options-modal").click(); + + await page.waitForTimeout(1000); + + await page.getByTestId("icon-Snowflake").last().click(); + + await page.waitForTimeout(1000); + + await page.keyboard.press("Escape"); + + await page.locator('//*[@id="react-flow-id"]').click(); + + await page.getByTestId("button_run_chat output").click(); + + await page.waitForSelector("text=built successfully", { timeout: 30000 }); + + await page.getByText("built successfully").last().click({ + timeout: 15000, + }); + + await page.getByTestId("output-inspection-message").first().click(); + + await page.getByRole("gridcell").first().click(); + + const thirdTextWithoutFreezing = await page + .getByPlaceholder("Empty") + .textContent(); + + expect(secondRunWithoutFreezing).toBe(firstTextFreezed); + + expect(firstRunWithoutFreezing).not.toBe(firstTextFreezed); + expect(thirdTextWithoutFreezing).not.toBe(firstTextFreezed); +}); From ddd5960ed2faa73fec61040edbd2d66438026758 Mon Sep 17 00:00:00 2001 From: cristhianzl Date: Mon, 19 Aug 2024 11:06:35 -0300 Subject: [PATCH 2/2] =?UTF-8?q?=F0=9F=93=9D=20(freeze.spec.ts):=20add=20de?= =?UTF-8?q?lays=20before=20certain=20actions=20to=20improve=20stability=20?= =?UTF-8?q?and=20reliability=20of=20end-to-end=20tests=20=F0=9F=93=9D=20(f?= =?UTF-8?q?reeze.spec.ts):=20update=20test=20to=20fill=20input=20with=20"l?= =?UTF-8?q?orem=20ipsum"=20instead=20of=20specific=20numbers=20for=20bette?= =?UTF-8?q?r=20test=20coverage?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/frontend/tests/end-to-end/freeze.spec.ts | 16 ++++++++++++++-- 1 file changed, 14 insertions(+), 2 deletions(-) diff --git a/src/frontend/tests/end-to-end/freeze.spec.ts b/src/frontend/tests/end-to-end/freeze.spec.ts index f420d51ce1ff..0b116ce390ec 100644 --- a/src/frontend/tests/end-to-end/freeze.spec.ts +++ b/src/frontend/tests/end-to-end/freeze.spec.ts @@ -213,6 +213,8 @@ test("user must be able to freeze a component", async ({ page }) => { timeout: 15000, }); + await page.waitForTimeout(2000); + await page.getByTestId("output-inspection-message").first().click(); await page.getByRole("gridcell").first().click(); @@ -234,6 +236,8 @@ test("user must be able to freeze a component", async ({ page }) => { timeout: 15000, }); + await page.waitForTimeout(2000); + await page.getByTestId("output-inspection-message").first().click(); await page.getByRole("gridcell").first().click(); @@ -261,8 +265,10 @@ test("user must be able to freeze a component", async ({ page }) => { await page.locator('//*[@id="react-flow-id"]').click(); - await page.getByTestId("int_int_chunk_size").fill("4000"); - await page.getByTestId("int_int_chunk_overlap").fill("800"); + await page + .getByTestId("popover-anchor-input-input_value") + .first() + .fill("lorem ipsum"); await page.waitForTimeout(1000); @@ -274,6 +280,8 @@ test("user must be able to freeze a component", async ({ page }) => { timeout: 15000, }); + await page.waitForTimeout(2000); + await page.getByTestId("output-inspection-message").first().click(); await page.getByRole("gridcell").first().click(); @@ -307,6 +315,8 @@ test("user must be able to freeze a component", async ({ page }) => { timeout: 15000, }); + await page.waitForTimeout(2000); + await page.getByTestId("output-inspection-message").first().click(); await page.getByRole("gridcell").first().click(); @@ -317,6 +327,8 @@ test("user must be able to freeze a component", async ({ page }) => { expect(secondRunWithoutFreezing).toBe(firstTextFreezed); + expect(firstRunWithoutFreezing).not.toBe(firstTextFreezed); + expect(firstRunWithoutFreezing).not.toBe(secondRunWithoutFreezing); expect(firstRunWithoutFreezing).not.toBe(firstTextFreezed); expect(thirdTextWithoutFreezing).not.toBe(firstTextFreezed); });