dmitry.galkin/chatbot-template
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

test: add playwright e2e tests for chat, auth, model selector, and api (#1355)

Browse source
This commit is contained in:
josh 2025-12-15 14:43:39 +00:00 • committed by GitHub
parent b1da86062e
commit 5f9e231788
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
10 changed files with 260 additions and 416 deletions
Download patch file Download diff file Expand all files Collapse all files

64
tests/e2e/model-selector.test.ts
View file

@ -1,41 +1,69 @@
import { expect, test } from "@playwright/test";
import { ChatPage } from "../pages/chat";
const MODEL_BUTTON_REGEX = /Gemini|Claude|GPT|Grok/i;
test.describe("Model Selector", () => {
let chatPage: ChatPage;
test.beforeEach(async ({ page }) => {
chatPage = new ChatPage(page);
await chatPage.createNewChat();
await page.goto("/");
});
test("displays default model on load", async ({ page }) => {
const modelButton = page.locator("button").filter({ hasText: /Gemini|Claude|GPT/i }).first();
test("displays a model button", async ({ page }) => {
// Look for any button with model-related content
const modelButton = page.locator("button").filter({ hasText: MODEL_BUTTON_REGEX }).first();
await expect(modelButton).toBeVisible();
});
test("opens model selector on click", async ({ page }) => {
const modelButton = page.locator("button").filter({ hasText: /Gemini|Claude|GPT/i }).first();
test("opens model selector popover on click", async ({ page }) => {
const modelButton = page.locator("button").filter({ hasText: MODEL_BUTTON_REGEX }).first();
await modelButton.click();
// Search input should be visible in the popover
await expect(page.getByPlaceholder("Search models...")).toBeVisible();
});
test("can search for models", async ({ page }) => {
const modelButton = page.locator("button").filter({ hasText: /Gemini|Claude|GPT/i }).first();
const modelButton = page.locator("button").filter({ hasText: MODEL_BUTTON_REGEX }).first();
await modelButton.click();
await page.getByPlaceholder("Search models...").fill("Claude");
await expect(page.getByText("Claude", { exact: false })).toBeVisible();
const searchInput = page.getByPlaceholder("Search models...");
await searchInput.fill("Claude");
// Should show at least one Claude model
await expect(page.getByText("Claude Haiku").first()).toBeVisible();
});
test("can close model selector by clicking outside", async ({ page }) => {
const modelButton = page.locator("button").filter({ hasText: MODEL_BUTTON_REGEX }).first();
await modelButton.click();
await expect(page.getByPlaceholder("Search models...")).toBeVisible();
// Click outside to close
await page.keyboard.press("Escape");
await expect(page.getByPlaceholder("Search models...")).not.toBeVisible();
});
test("shows model provider groups", async ({ page }) => {
const modelButton = page.locator("button").filter({ hasText: MODEL_BUTTON_REGEX }).first();
await modelButton.click();
// Should show provider group headers
await expect(page.getByText("Anthropic")).toBeVisible();
await expect(page.getByText("Google")).toBeVisible();
});
test("can select a different model", async ({ page }) => {
const modelButton = page.locator("button").filter({ hasText: /Gemini|Claude|GPT/i }).first();
const modelButton = page.locator("button").filter({ hasText: MODEL_BUTTON_REGEX }).first();
await modelButton.click();
const modelOption = page.getByRole("option").first();
const modelName = await modelOption.innerText();
await modelOption.click();
// Select a specific model
await page.getByText("Claude Haiku").first().click();
await expect(page.locator("button").filter({ hasText: modelName.split("\n")[0] })).toBeVisible();
// Popover should close
await expect(page.getByPlaceholder("Search models...")).not.toBeVisible();
// Model button should now show the selected model
await expect(page.locator("button").filter({ hasText: "Claude Haiku" }).first()).toBeVisible();
});
});