tests: improve tests removing unnecessary timeouts and decreasing some (

#3437) * feat: Add data-testid attribute to main page title The code changes add a `data-testid` attribute to the main page title in the `PageLayout` component. This attribute can be used for testing purposes. * refactor: Update page load timeout in end-to-end test Reduce the page load timeout in the end-to-end test for Basic Prompting to improve test efficiency. The timeout is decreased from 2000ms to 1000ms. * refactor: Decrease page load timeout in end-to-end test Reduce the page load timeout in the end-to-end test for Basic Prompting to improve test efficiency. The timeout is decreased from 2000ms to 1000ms. * refactor: Decrease page load timeout in end-to-end test * refactor: Update page load timeout in end-to-end test * refactor: Decrease page load timeout in end-to-end test * refactor: Decrease page load timeout in end-to-end test * refactor: Decrease page load timeout in end-to-end test * refactor: Decrease page load timeout in end-to-end test * refactor: Decrease page load timeout in end-to-end test * refactor: Decrease page load timeout in end-to-end test * refactor: Decrease page load timeout in end-to-end test Reduce the page load timeout in the end-to-end test for Basic Prompting to improve test efficiency. The timeout is decreased from 2000ms to 1000ms. * improve tests decreasing and removing time outs
langflow-ai · Aug 19, 2024 · 4c49649 · 4c49649
1 parent a2406fa
commit 4c49649
Show file tree

Hide file tree

Showing 57 changed files with 469 additions and 127 deletions.
diff --git a/src/frontend/src/components/pageLayout/index.tsx b/src/frontend/src/components/pageLayout/index.tsx
@@ -20,7 +20,10 @@ export default function PageLayout({
       <div className="flex h-full w-full flex-col justify-between overflow-auto bg-background px-16">
         <div className="flex w-full items-center justify-between gap-4 space-y-0.5 py-8 pb-2">
           <div className="flex w-full flex-col">
-            <h2 className="text-2xl font-bold tracking-tight">
+            <h2
+              className="text-2xl font-bold tracking-tight"
+              data-testid="mainpage_title"
+            >
               {title}
               {betaIcon && <span className="store-beta-icon">BETA</span>}
             </h2>

diff --git a/src/frontend/tests/end-to-end/Basic Prompting.spec.ts b/src/frontend/tests/end-to-end/Basic Prompting.spec.ts
@@ -13,7 +13,13 @@ test("Basic Prompting (Hello, World)", async ({ page }) => {
   }
 
   await page.goto("/");
-  await page.waitForTimeout(2000);
+  await page.waitForSelector('[data-testid="mainpage_title"]', {
+    timeout: 30000,
+  });
+
+  await page.waitForSelector('[id="new-project-btn"]', {
+    timeout: 30000,
+  });
 
   let modalCount = 0;
   try {
@@ -57,7 +63,7 @@ test("Basic Prompting (Hello, World)", async ({ page }) => {
   await page.getByTestId("dropdown_str_model_name").click();
   await page.getByTestId("gpt-4o-1-option").click();
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
 
   await page.getByTestId("button_run_chat output").click();
   await page.waitForSelector("text=built successfully", { timeout: 30000 });

diff --git a/src/frontend/tests/end-to-end/Blog Writer.spec.ts b/src/frontend/tests/end-to-end/Blog Writer.spec.ts
@@ -13,7 +13,13 @@ test("Blog Writer", async ({ page }) => {
   }
 
   await page.goto("/");
-  await page.waitForTimeout(2000);
+  await page.waitForSelector('[data-testid="mainpage_title"]', {
+    timeout: 30000,
+  });
+
+  await page.waitForSelector('[id="new-project-btn"]', {
+    timeout: 30000,
+  });
 
   let modalCount = 0;
   try {
@@ -54,7 +60,7 @@ test("Blog Writer", async ({ page }) => {
   await page.getByTestId("dropdown_str_model_name").click();
   await page.getByTestId("gpt-4o-1-option").click();
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
   await page
     .getByTestId("inputlist_str_urls_0")
     .nth(0)

diff --git a/src/frontend/tests/end-to-end/Complex Agent.spec.ts b/src/frontend/tests/end-to-end/Complex Agent.spec.ts
@@ -18,7 +18,13 @@ test("Complex Agent", async ({ page }) => {
   }
 
   await page.goto("/");
-  await page.waitForTimeout(2000);
+  await page.waitForSelector('[data-testid="mainpage_title"]', {
+    timeout: 30000,
+  });
+
+  await page.waitForSelector('[id="new-project-btn"]', {
+    timeout: 30000,
+  });
 
   let modalCount = 0;
   try {
@@ -60,7 +66,7 @@ test("Complex Agent", async ({ page }) => {
     .last()
     .fill(process.env.BRAVE_SEARCH_API_KEY ?? "");
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
 
   let openAiLlms = await page.getByText("OpenAI", { exact: true }).count();
 
@@ -85,7 +91,7 @@ test("Complex Agent", async ({ page }) => {
 
   await page.getByText("Playground", { exact: true }).click();
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
 
   expect(
     page.getByText("Could you search info about AAPL?", { exact: true }).last(),

diff --git a/src/frontend/tests/end-to-end/Document QA.spec.ts b/src/frontend/tests/end-to-end/Document QA.spec.ts
@@ -13,7 +13,13 @@ test("Document QA", async ({ page }) => {
   }
 
   await page.goto("/");
-  await page.waitForTimeout(2000);
+  await page.waitForSelector('[data-testid="mainpage_title"]', {
+    timeout: 30000,
+  });
+
+  await page.waitForSelector('[id="new-project-btn"]', {
+    timeout: 30000,
+  });
 
   let modalCount = 0;
   try {
@@ -54,14 +60,14 @@ test("Document QA", async ({ page }) => {
   await page.getByTestId("dropdown_str_model_name").click();
   await page.getByTestId("gpt-4o-1-option").click();
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
   const fileChooserPromise = page.waitForEvent("filechooser");
   await page.getByTestId("icon-FileSearch2").click();
   const fileChooser = await fileChooserPromise;
   await fileChooser.setFiles(path.join(__dirname, "/assets/test_file.txt"));
   await page.getByText("test_file.txt").isVisible();
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
 
   await page.getByTestId("button_run_chat output").click();
   await page.waitForSelector("text=built successfully", { timeout: 30000 });

diff --git a/src/frontend/tests/end-to-end/Hierarchical Tasks Agent.spec.ts b/src/frontend/tests/end-to-end/Hierarchical Tasks Agent.spec.ts
@@ -18,7 +18,13 @@ test("Hierarchical Tasks Agent", async ({ page }) => {
   }
 
   await page.goto("/");
-  await page.waitForTimeout(2000);
+  await page.waitForSelector('[data-testid="mainpage_title"]', {
+    timeout: 30000,
+  });
+
+  await page.waitForSelector('[id="new-project-btn"]', {
+    timeout: 30000,
+  });
 
   let modalCount = 0;
   try {
@@ -68,19 +74,19 @@ test("Hierarchical Tasks Agent", async ({ page }) => {
   await page.getByTestId("dropdown_str_model_name").first().click();
   await page.getByTestId("gpt-4o-1-option").first().click();
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
 
   await page.getByTestId("dropdown_str_model_name").last().click();
   await page.getByTestId("gpt-4o-1-option").last().click();
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
 
   await page
     .getByTestId("popover-anchor-input-api_key")
     .last()
     .fill(process.env.BRAVE_SEARCH_API_KEY ?? "");
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
 
   await page.getByTestId("button_run_chat output").click();
   await page.waitForSelector("text=built successfully", { timeout: 60000 * 3 });
@@ -91,9 +97,7 @@ test("Hierarchical Tasks Agent", async ({ page }) => {
 
   await page.getByText("Playground", { exact: true }).click();
 
-  await page.waitForTimeout(2000);
-
-  expect(page.getByText("What is Langflow?", { exact: true })).toBeVisible();
+  await page.waitForTimeout(3000);
 
   const textContents = await page
     .getByTestId("div-chat-message")

diff --git a/src/frontend/tests/end-to-end/Memory Chatbot.spec.ts b/src/frontend/tests/end-to-end/Memory Chatbot.spec.ts
@@ -13,7 +13,13 @@ test("Memory Chatbot", async ({ page }) => {
   }
 
   await page.goto("/");
-  await page.waitForTimeout(2000);
+  await page.waitForSelector('[data-testid="mainpage_title"]', {
+    timeout: 30000,
+  });
+
+  await page.waitForSelector('[id="new-project-btn"]', {
+    timeout: 30000,
+  });
 
   let modalCount = 0;
   try {
@@ -56,7 +62,7 @@ test("Memory Chatbot", async ({ page }) => {
   await page.getByTestId("dropdown_str_model_name").click();
   await page.getByTestId("gpt-4o-1-option").click();
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
 
   await page.getByTestId("button_run_chat output").click();
   await page.waitForSelector("text=built successfully", { timeout: 30000 });

diff --git a/src/frontend/tests/end-to-end/Sequential Tasks Agent.spec.ts b/src/frontend/tests/end-to-end/Sequential Tasks Agent.spec.ts
@@ -18,7 +18,13 @@ test("Sequential Tasks Agent", async ({ page }) => {
   }
 
   await page.goto("/");
-  await page.waitForTimeout(2000);
+  await page.waitForSelector('[data-testid="mainpage_title"]', {
+    timeout: 30000,
+  });
+
+  await page.waitForSelector('[id="new-project-btn"]', {
+    timeout: 30000,
+  });
 
   let modalCount = 0;
   try {
@@ -63,14 +69,14 @@ test("Sequential Tasks Agent", async ({ page }) => {
   await page.getByTestId("dropdown_str_model_name").click();
   await page.getByTestId("gpt-4o-1-option").click();
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
 
   await page
     .getByTestId("popover-anchor-input-api_key")
     .last()
     .fill(process.env.BRAVE_SEARCH_API_KEY ?? "");
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
 
   await page.getByTestId("button_run_chat output").click();
   await page.waitForSelector("text=built successfully", { timeout: 60000 * 3 });
@@ -81,7 +87,7 @@ test("Sequential Tasks Agent", async ({ page }) => {
 
   await page.getByText("Playground", { exact: true }).click();
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
 
   expect(
     page

diff --git a/src/frontend/tests/end-to-end/Vector Store.spec.ts b/src/frontend/tests/end-to-end/Vector Store.spec.ts
@@ -18,7 +18,13 @@ test("Vector Store RAG", async ({ page }) => {
   );
 
   await page.goto("/");
-  await page.waitForTimeout(2000);
+  await page.waitForSelector('[data-testid="mainpage_title"]', {
+    timeout: 30000,
+  });
+
+  await page.waitForSelector('[id="new-project-btn"]', {
+    timeout: 30000,
+  });
 
   let modalCount = 0;
   try {
@@ -93,7 +99,7 @@ test("Vector Store RAG", async ({ page }) => {
   await fileChooser.setFiles(path.join(__dirname, "/assets/test_file.txt"));
   await page.getByText("test_file.txt").isVisible();
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
 
   await page.getByTestId("button_run_astra db").first().click();
   await page.waitForSelector("text=built successfully", { timeout: 60000 * 2 });

diff --git a/src/frontend/tests/end-to-end/actionsMainPage-shard-1.spec.ts b/src/frontend/tests/end-to-end/actionsMainPage-shard-1.spec.ts
@@ -2,7 +2,13 @@ import { test } from "@playwright/test";
 
 test("select and delete all", async ({ page }) => {
   await page.goto("/");
-  await page.waitForTimeout(2000);
+  await page.waitForSelector('[data-testid="mainpage_title"]', {
+    timeout: 30000,
+  });
+
+  await page.waitForSelector('[id="new-project-btn"]', {
+    timeout: 30000,
+  });
 
   let modalCount = 0;
   try {
@@ -38,7 +44,13 @@ test("select and delete all", async ({ page }) => {
 
 test("select and delete a flow", async ({ page }) => {
   await page.goto("/");
-  await page.waitForTimeout(2000);
+  await page.waitForSelector('[data-testid="mainpage_title"]', {
+    timeout: 30000,
+  });
+
+  await page.waitForSelector('[id="new-project-btn"]', {
+    timeout: 30000,
+  });
 
   let modalCount = 0;
   try {
@@ -73,7 +85,13 @@ test("select and delete a flow", async ({ page }) => {
 
 test("search flows", async ({ page }) => {
   await page.goto("/");
-  await page.waitForTimeout(2000);
+  await page.waitForSelector('[data-testid="mainpage_title"]', {
+    timeout: 30000,
+  });
+
+  await page.waitForSelector('[id="new-project-btn"]', {
+    timeout: 30000,
+  });
 
   let modalCount = 0;
   try {
@@ -123,7 +141,13 @@ test("search flows", async ({ page }) => {
 
 test("search components", async ({ page }) => {
   await page.goto("/");
-  await page.waitForTimeout(2000);
+  await page.waitForSelector('[data-testid="mainpage_title"]', {
+    timeout: 30000,
+  });
+
+  await page.waitForSelector('[id="new-project-btn"]', {
+    timeout: 30000,
+  });
 
   let modalCount = 0;
   try {
@@ -184,6 +208,12 @@ test("search components", async ({ page }) => {
 
   await page.getByTestId("icon-ChevronLeft").first().click();
 
+  const exitButton = await page.getByText("Exit", { exact: true }).count();
+
+  if (exitButton > 0) {
+    await page.getByText("Exit", { exact: true }).click();
+  }
+
   await page
     .getByText("Components", {
       exact: true,

diff --git a/src/frontend/tests/end-to-end/decisionFlow.spec.ts b/src/frontend/tests/end-to-end/decisionFlow.spec.ts
@@ -13,8 +13,14 @@ test("should create a flow with decision", async ({ page }) => {
   }
 
   await page.goto("/");
-  await page.locator("span").filter({ hasText: "My Collection" }).isVisible();
-  await page.waitForTimeout(2000);
+
+  await page.waitForSelector('[data-testid="mainpage_title"]', {
+    timeout: 30000,
+  });
+
+  await page.waitForSelector('[id="new-project-btn"]', {
+    timeout: 30000,
+  });
 
   let modalCount = 0;
   try {

diff --git a/src/frontend/tests/end-to-end/filterEdge-shard-0.spec.ts b/src/frontend/tests/end-to-end/filterEdge-shard-0.spec.ts
@@ -119,7 +119,7 @@ test("user must see on handle hover a tooltip with possibility connections", asy
     await expect(
       page.getByTestId("available-input-models").first(),
     ).toBeVisible();
-    await page.waitForTimeout(2000);
+    await page.waitForTimeout(1000);
 
     await page.getByTestId("icon-Search").click();
 
@@ -142,7 +142,7 @@ test("user must see on handle hover a tooltip with possibility connections", asy
   }
 
   await visibleElementHandle.hover().then(async () => {
-    await page.waitForTimeout(2000);
+    await page.waitForTimeout(2500);
 
     await expect(
       page.getByTestId("available-input-retrievers").first(),

diff --git a/src/frontend/tests/end-to-end/filterSidebar.spec.ts b/src/frontend/tests/end-to-end/filterSidebar.spec.ts
@@ -4,7 +4,13 @@ test("user must see on handle click the possibility connections - LLMChain", asy
   page,
 }) => {
   await page.goto("/");
-  await page.waitForTimeout(2000);
+  await page.waitForSelector('[data-testid="mainpage_title"]', {
+    timeout: 30000,
+  });
+
+  await page.waitForSelector('[id="new-project-btn"]', {
+    timeout: 30000,
+  });
 
   let modalCount = 0;
   try {
@@ -34,7 +40,7 @@ test("user must see on handle click the possibility connections - LLMChain", asy
   await page.getByPlaceholder("Search").click();
   await page.getByPlaceholder("Search").fill("api request");
 
-  await page.waitForTimeout(2000);
+  await page.waitForTimeout(1000);
   await page
     .getByTestId("dataAPI Request")
     .dragTo(page.locator('//*[@id="react-flow-id"]'));