test: Enhance test stability (#4566)

* 🐛 (genericIconComponent/index.tsx): fix optional chaining for split and map functions to prevent errors
🐛 (actionsMainPage-shard-1.spec.ts): remove redundant zoom_out click
🐛 (auto-login-off.spec.ts): reduce wait time from 2000ms to 1000ms
🐛 (freeze-path.spec.ts): change click target from "openai" to "OpenAI" for consistency
🐛 (freeze.spec.ts): change click target from "Split Text" to "Split Text" for consistency
🐛 (Dynamic Agent.spec.ts): skip test execution
🐛 (Hierarchical Agent.spec.ts): skip test execution
🐛 (Sequential Task Agent.spec.ts): skip test execution
🐛 (Simple Agent.spec.ts): skip test execution
🐛 (decisionFlow.spec.ts): change search input from "conditional router" to "if else"
🐛 (similarity.spec.ts): change search input from "openai" to "openai embedding"
🐛 (fileUploadComponent.spec.ts): enable test for file upload functionality

📝 (deleteComponents.spec.ts): Remove commented out code and enable test for deleting a component
📝 (deleteFlows.spec.ts): Enable test for deleting a flow
📝 (starter-projects.spec.ts): Enable test for interacting with starter projects
📝 (store-shard-3.spec.ts): Enable tests for ordering visualization and filtering by type
📝 (generalBugs-shard-13.spec.ts): Enable test for sharing a component on the store

* ⬆️ (typescript_test.yml): update matrix configuration to run tests on multiple shards for better parallelization
🔧 (typescript_test.yml): enable playwright test execution with shard index and total for parallel test execution

* 🐛 (genericIconComponent/index.tsx): fix optional chaining for split and map functions to prevent errors
🐛 (actionsMainPage-shard-1.spec.ts): remove redundant zoom_out click
🐛 (auto-login-off.spec.ts): reduce wait time from 2000ms to 1000ms
🐛 (freeze-path.spec.ts): change click target from "openai" to "OpenAI" for consistency
🐛 (freeze.spec.ts): change click target from "Split Text" to "Split Text" for consistency
🐛 (Dynamic Agent.spec.ts): skip test execution
🐛 (Hierarchical Agent.spec.ts): skip test execution
🐛 (Sequential Task Agent.spec.ts): skip test execution
🐛 (Simple Agent.spec.ts): skip test execution
🐛 (decisionFlow.spec.ts): change search input from "conditional router" to "if else"
🐛 (similarity.spec.ts): change search input from "openai" to "openai embedding"
🐛 (fileUploadComponent.spec.ts): enable test for file upload functionality

📝 (deleteComponents.spec.ts): Remove commented out code and enable test for deleting a component
📝 (deleteFlows.spec.ts): Enable test for deleting a flow
📝 (starter-projects.spec.ts): Enable test for interacting with starter projects
📝 (store-shard-3.spec.ts): Enable tests for ordering visualization and filtering by type
📝 (generalBugs-shard-13.spec.ts): Enable test for sharing a component on the store

* ⬆️ (typescript_test.yml): update matrix configuration to run tests on multiple shards for better parallelization
🔧 (typescript_test.yml): enable playwright test execution with shard index and total for parallel test execution

* 🐛 (Travel Planning Agent.spec.ts): Fix issue with setting API keys for OpenAI models and Search API
🐛 (Travel Planning Agent.spec.ts): Fix issue with clicking the wrong button for running chat output
🐛 (Travel Planning Agent.spec.ts): Fix issue with checking rate limit and skipping test logic
🐛 (Travel Planning Agent.spec.ts): Fix issue with checking output text for lowercase city names
🐛 (Vector Store.spec.ts): Fix issue with clicking the wrong button for creating a new flow
🐛 (Vector Store.spec.ts): Fix issue with filling the wrong input field for collection name in Vector Store RAG test

* 🔧 (generalBugs-shard-4.spec.ts): skip test case temporarily due to functionality not working with uplift designs

* Update test to use 'message history' instead of 'chat memory' in sidebar search input

* Update test selectors and expected values in dropdownComponent.spec.ts

* 📝 (Simple Agent.spec.ts): Remove unnecessary test.skip and commented out code
📝 (dropdownComponent.spec.ts): Update dropdown selection to match new text
📝 (starter-projects.spec.ts): Remove unused template IDs
📝 (store-shard-1.spec.ts): Update test.skip to test.skip for consistency
📝 (generalBugs-shard-10.spec.ts): Refactor test cases for promptText and newPromptText
📝 (generalBugs-shard-6.spec.ts): Add delay before interacting with elements to ensure stability

* Refactor tests to use `ControlOrMeta` for cross-platform keyboard shortcuts

* ✅ (Simple Agent.spec.ts): update timeout value for waitForSelector to improve test reliability and prevent false negatives

* Handle undefined stars in GithubStarComponent to prevent errors

* Add waitForSelector to ensure sidebar search input is visible before interaction in chatInputOutput test

* ✅ (Simple Agent.spec.ts): update timeout value to 5 minutes for "built successfully" message to allow for longer build times
✨ (Simple Agent.spec.ts): add additional test cases to check for the presence of "apple" in chat messages and ensure the total length of chat messages is greater than 100 characters

* 🐛 (Simple Agent.spec.ts): reduce timeout for "built successfully" text to improve test efficiency

* ✅ (auto-login-off.spec.ts): add delay before checking visibility of elements to ensure proper rendering and improve test reliability

* Fix indentation in TypeScript test workflow file

* Update test IDs and expected values in dropdownComponent.spec.ts

* 📝 (playground.spec.ts): remove redundant code related to zooming out and dragging elements in the playground test
📝 (deleteComponents.spec.ts): update selectors for clicking buttons and elements in the deleteComponents test
📝 (deleteFlows.spec.ts): update selectors for clicking buttons and elements in the deleteFlows test
📝 (starter-projects.spec.ts): update selectors for starter projects in the extended features test to match changes in the application's UI.

* ✅ (playground.spec.ts): remove skip from the test case to enable it to run during testing.

* Refactor timeout in playground test for better stability

---------

Co-authored-by: Gabriel Luiz Freitas Almeida <gabriel@langflow.org>
Co-authored-by: anovazzi1 <otavio2204@gmail.com>

src/frontend/tests/core/unit/chatInputOutput.spec.ts

@@ -32,6 +32,9 @@ test("chat_io_teste", async ({ page }) => {
   });
 
   await page.getByTestId("blank-flow").click();
+  await page.waitForSelector('[data-testid="sidebar-search-input"]', {
+    state: "visible",
+  });
   await page.getByTestId("sidebar-search-input").click();
   await page.getByTestId("sidebar-search-input").fill("chat output");
   await page.waitForTimeout(1000);

src/frontend/tests/core/unit/dropdownComponent.spec.ts

@@ -51,11 +51,11 @@ test("dropDownComponent", async ({ page }) => {
   await page.getByTestId("dropdown_str_model_id").click();
 
   await page
-    .getByTestId("anthropic.claude-3-haiku-20240307-v1:0-10-option")
+    .getByTestId(/anthropic\.claude-3-haiku-20240307-v1:0.*option/)
     .click();
 
   let value = await page
-    .getByTestId("anthropic.claude-3-haiku-20240307-v1:0-10-option")
+    .getByTestId(/anthropic\.claude-3-haiku-20240307-v1:0.*option/)
     .first()
     .innerText();
   if (value !== "anthropic.claude-3-haiku-20240307-v1:0") {
@@ -128,7 +128,7 @@ test("dropDownComponent", async ({ page }) => {
   value = await page
     .getByTestId("value-dropdown-dropdown_str_edit_model_id")
     .innerText();
-  if (value !== "cohere.embed-multilingual-v3") {
+  if (value !== "cohere.command-r-plus-v1:0") {
     expect(false).toBeTruthy();
   }
 
@@ -137,7 +137,7 @@ test("dropDownComponent", async ({ page }) => {
   value = await page
     .getByTestId("value-dropdown-dropdown_str_model_id")
     .innerText();
-  if (value !== "cohere.embed-multilingual-v3") {
+  if (value !== "cohere.command-r-plus-v1:0") {
     expect(false).toBeTruthy();
   }
   await page.getByTestId("code-button-modal").click();

src/frontend/tests/core/unit/fileUploadComponent.spec.ts

@@ -1,7 +1,7 @@
 import { expect, test } from "@playwright/test";
 import path from "path";
 
-test.skip("should be able to upload a file", async ({ page }) => {
+test("should be able to upload a file", async ({ page }) => {
   await page.goto("/");
   await page.waitForSelector('[data-testid="mainpage_title"]', {
     timeout: 30000,

src/frontend/tests/core/unit/linkComponent.spec.ts

@@ -30,11 +30,6 @@ test("user should interact with link component", async ({ context, page }) => {
 
   const getUA = await page.evaluate(() => navigator.userAgent);
   const userAgentInfo = uaParser(getUA);
-  let control = "Control";
-
-  if (userAgentInfo.os.name.includes("Mac")) {
-    control = "Meta";
-  }
 
   await page.waitForSelector('[data-testid="blank-flow"]', {
     timeout: 30000,
@@ -81,7 +76,7 @@ test("user should interact with link component", async ({ context, page }) => {
     ],
   });
 
-  await page.locator("textarea").last().press(`${control}+a`);
+  await page.locator("textarea").last().press(`ControlOrMeta+a`);
   await page.keyboard.press("Backspace");
   await page.locator("textarea").last().fill(cleanCode);
   await page.locator('//*[@id="checkAndSaveBtn"]').click();

src/frontend/tests/core/unit/sliderComponent.spec.ts

@@ -30,11 +30,6 @@ test("user should be able to use slider input", async ({ page }) => {
 
   const getUA = await page.evaluate(() => navigator.userAgent);
   const userAgentInfo = uaParser(getUA);
-  let control = "Control";
-
-  if (userAgentInfo.os.name.includes("Mac")) {
-    control = "Meta";
-  }
 
   await page.waitForSelector('[data-testid="blank-flow"]', {
     timeout: 30000,
@@ -71,7 +66,7 @@ test("user should be able to use slider input", async ({ page }) => {
     "value=0.2, range_spec=RangeSpec(min=3, max=30, step=1), min_label='test', max_label='test2', min_label_icon='pencil-ruler', max_label_icon='palette', slider_buttons=False, slider_buttons_options=[], slider_input=False,",
   );
 
-  await page.locator("textarea").last().press(`${control}+a`);
+  await page.locator("textarea").last().press(`ControlOrMeta+a`);
   await page.keyboard.press("Backspace");
   await page.locator("textarea").last().fill(cleanCode);
   await page.locator('//*[@id="checkAndSaveBtn"]').click();

src/frontend/tests/core/unit/tableInputComponent.spec.ts

@@ -30,11 +30,6 @@ test("user must be able to interact with table input component", async ({
 
   const getUA = await page.evaluate(() => navigator.userAgent);
   const userAgentInfo = uaParser(getUA);
-  let control = "Control";
-
-  if (userAgentInfo.os.name.includes("Mac")) {
-    control = "Meta";
-  }
 
   while (modalCount === 0) {
     await page.getByText("New Flow", { exact: true }).click();
@@ -101,7 +96,7 @@ class CustomComponent(Component):
         return data
   `;
 
-  await page.locator("textarea").press(`${control}+a`);
+  await page.locator("textarea").press(`ControlOrMeta+a`);
   await page.locator("textarea").fill(customCodeWithError);
 
   await page.getByText("Check & Save").last().click();