🐛 (messagesPage): fix selection mapping to use row.id instead of row.index

✅ (tests): add end-to-end tests for basic prompting and general bugs

✅ (tests): add end-to-end test for deleting rows from table message
🔧 (tsconfig.json): update test file name for generalBugs to shard-0 spec

src/frontend/src/pages/SettingsPage/pages/messagesPage/index.tsx

@@ -66,9 +66,7 @@ export default function MessagesPage() {
           ]}
           overlayNoRowsTemplate="No data available"
           onSelectionChanged={(event: SelectionChangedEvent) => {
-            setSelectedRows(
-              event.api.getSelectedRows().map((row) => row.index),
-            );
+            setSelectedRows(event.api.getSelectedRows().map((row) => row.id));
           }}
           rowSelection="multiple"
           suppressRowClickSelection={true}

src/frontend/tests/end-to-end/Basic Prompting.spec.ts

@@ -1,5 +1,4 @@
 import { expect, test } from "@playwright/test";
-import path from "path";
 
 test("Basic Prompting (Hello, World)", async ({ page }) => {
   if (!process?.env?.OPENAI_API_KEY) {
@@ -67,10 +66,18 @@ test("Basic Prompting (Hello, World)", async ({ page }) => {
     .getByTestId("input-chat-playground")
     .last()
     .fill("Say hello as a pirate");
-  await page.getByTestId("icon-LucideSend").last().click();
-  await page.waitForTimeout(3000);
 
-  await page.getByText("Ahoy").last().isVisible();
+  await page.waitForSelector('[data-testid="icon-LucideSend"]', {
+    timeout: 100000,
+  });
+
+  await page.getByTestId("icon-LucideSend").last().click();
+
+  await page.waitForSelector("text=matey", {
+    timeout: 100000,
+  });
+
+  await page.getByText("matey").last().isVisible();
   await page.getByText("Default Session").last().click();
 
   await page.getByText("timestamp", { exact: true }).last().isVisible();

src/frontend/tests/end-to-end/generalBugs-shard-1.spec.ts

@@ -0,0 +1,89 @@
+import { expect, test } from "@playwright/test";
+import * as dotenv from "dotenv";
+import path from "path";
+
+test("should delete rows from table message", async ({ page }) => {
+  if (!process?.env?.OPENAI_API_KEY) {
+    //You must set the OPENAI_API_KEY on .env file to run this test
+    expect(false).toBe(true);
+  }
+
+  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: "Basic Prompting" }).click();
+
+  await page.waitForSelector('[title="fit view"]', {
+    timeout: 100000,
+  });
+
+  await page.getByTitle("fit view").click();
+  await page.getByTitle("zoom out").click();
+  await page.getByTitle("zoom out").click();
+  await page.getByTitle("zoom out").click();
+
+  await page
+    .getByTestId("popover-anchor-input-openai_api_key")
+    .fill(process.env.OPENAI_API_KEY ?? "");
+
+  await page.getByTestId("dropdown-model_name").click();
+  await page.getByTestId("gpt-4o-0-option").click();
+
+  await page.waitForTimeout(2000);
+
+  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.getByText("Playground", { exact: true }).click();
+  await page
+    .getByText("No input message provided.", { exact: true })
+    .last()
+    .isVisible();
+
+  await page.waitForSelector('[data-testid="input-chat-playground"]', {
+    timeout: 100000,
+  });
+
+  await page
+    .getByTestId("input-chat-playground")
+    .last()
+    .fill("Say hello as a pirate");
+  await page.getByTestId("icon-LucideSend").last().click();
+
+  await page.waitForSelector("text=matey", {
+    timeout: 100000,
+  });
+
+  await page.getByText("Close").last().click();
+  await page.getByTestId("user-profile-settings").last().click();
+  await page.getByText("Settings").last().click();
+  await page.getByText("Messages").last().click();
+
+  const label = "Press Space to toggle all rows selection (unchecked)";
+  await page.getByLabel(label).first().click();
+
+  await page.getByTestId("icon-Trash2").first().click();
+
+  await page.waitForSelector("text=No Data Available", { timeout: 30000 });
+  await page.getByText("No Data Available").isVisible();
+});

src/frontend/tsconfig.json

@@ -34,7 +34,7 @@
     "tests/end-to-end/floatComponent.spec.ts",
     "tests/end-to-end/flowPage.spec.ts",
     "tests/end-to-end/flowSettings.spec.ts",
-    "tests/end-to-end/generalBugs.spec.ts",
+    "tests/end-to-end/generalBugs-shard-0.spec.ts",
     "tests/end-to-end/globalVariables.spec.ts",
     "tests/end-to-end/group.spec.ts",
     "tests/end-to-end/folders.spec.ts",