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

Upgrade linter and formatter to Ultracite (#1224)

Browse source
This commit is contained in:
Hayden Bleasel 2025-09-20 12:47:10 -07:00 • committed by GitHub
parent b1d254283b
commit 0e320b391d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
177 changed files with 6951 additions and 8342 deletions
Download patch file Download diff file Expand all files Collapse all files

76
tests/pages/artifact.ts
View file

@ -1,58 +1,66 @@
import { expect, type Page } from '@playwright/test';
import { expect, type Page } from "@playwright/test";
export class ArtifactPage {
constructor(private page: Page) {}
private readonly page: Page;
public get artifact() {
return this.page.getByTestId('artifact');
constructor(page: Page) {
this.page = page;
}
public get sendButton() {
return this.artifact.getByTestId('send-button');
get artifact() {
return this.page.getByTestId("artifact");
}
public get stopButton() {
return this.page.getByTestId('stop-button');
get sendButton() {
return this.artifact.getByTestId("send-button");
}
public get multimodalInput() {
return this.page.getByTestId('multimodal-input');
get stopButton() {
return this.page.getByTestId("stop-button");
}
get multimodalInput() {
return this.page.getByTestId("multimodal-input");
}
async isGenerationComplete() {
const response = await this.page.waitForResponse((response) =>
response.url().includes('/api/chat'),
const response = await this.page.waitForResponse((currentResponse) =>
currentResponse.url().includes("/api/chat")
);
await response.finished();
}
async sendUserMessage(message: string) {
await this.artifact.getByTestId('multimodal-input').click();
await this.artifact.getByTestId('multimodal-input').fill(message);
await this.artifact.getByTestId('send-button').click();
await this.artifact.getByTestId("multimodal-input").click();
await this.artifact.getByTestId("multimodal-input").fill(message);
await this.artifact.getByTestId("send-button").click();
}
async getRecentAssistantMessage() {
const messageElements = await this.artifact
.getByTestId('message-assistant')
.getByTestId("message-assistant")
.all();
const lastMessageElement = messageElements[messageElements.length - 1];
const lastMessageElement = messageElements.at(-1);
if (!lastMessageElement) {
return null;
}
const content = await lastMessageElement
.getByTestId('message-content')
.getByTestId("message-content")
.innerText()
.catch(() => null);
const reasoningElement = await lastMessageElement
.getByTestId('message-reasoning')
.getByTestId("message-reasoning")
.isVisible()
.then(async (visible) =>
visible
? await lastMessageElement
.getByTestId('message-reasoning')
.getByTestId("message-reasoning")
.innerText()
: null,
: null
)
.catch(() => null);
@ -62,7 +70,7 @@ export class ArtifactPage {
reasoning: reasoningElement,
async toggleReasoningVisibility() {
await lastMessageElement
.getByTestId('message-reasoning-toggle')
.getByTestId("message-reasoning-toggle")
.click();
},
};
@ -70,19 +78,23 @@ export class ArtifactPage {
async getRecentUserMessage() {
const messageElements = await this.artifact
.getByTestId('message-user')
.getByTestId("message-user")
.all();
const lastMessageElement = messageElements[messageElements.length - 1];
const lastMessageElement = messageElements.at(-1);
if (!lastMessageElement) {
return null;
}
const content = await lastMessageElement.innerText();
const hasAttachments = await lastMessageElement
.getByTestId('message-attachments')
.getByTestId("message-attachments")
.isVisible()
.catch(() => false);
const attachments = hasAttachments
? await lastMessageElement.getByTestId('message-attachments').all()
? await lastMessageElement.getByTestId("message-attachments").all()
: [];
const page = this.artifact;
@ -92,17 +104,17 @@ export class ArtifactPage {
content,
attachments,
async edit(newMessage: string) {
await page.getByTestId('message-edit-button').click();
await page.getByTestId('message-editor').fill(newMessage);
await page.getByTestId('message-editor-send-button').click();
await page.getByTestId("message-edit-button").click();
await page.getByTestId("message-editor").fill(newMessage);
await page.getByTestId("message-editor-send-button").click();
await expect(
page.getByTestId('message-editor-send-button'),
page.getByTestId("message-editor-send-button")
).not.toBeVisible();
},
};
}
async closeArtifact() {
return this.page.getByTestId('artifact-close-button').click();
closeArtifact() {
return this.page.getByTestId("artifact-close-button").click();
}
}

56
tests/pages/auth.ts
View file

@ -1,65 +1,69 @@
import type { Page } from '@playwright/test';
import { expect } from '../fixtures';
import type { Page } from "@playwright/test";
import { expect } from "../fixtures";
export class AuthPage {
constructor(private page: Page) {}
private readonly page: Page;
constructor(page: Page) {
this.page = page;
}
async gotoLogin() {
await this.page.goto('/login');
await expect(this.page.getByRole('heading')).toContainText('Sign In');
await this.page.goto("/login");
await expect(this.page.getByRole("heading")).toContainText("Sign In");
}
async gotoRegister() {
await this.page.goto('/register');
await expect(this.page.getByRole('heading')).toContainText('Sign Up');
await this.page.goto("/register");
await expect(this.page.getByRole("heading")).toContainText("Sign Up");
}
async register(email: string, password: string) {
await this.gotoRegister();
await this.page.getByPlaceholder('user@acme.com').click();
await this.page.getByPlaceholder('user@acme.com').fill(email);
await this.page.getByLabel('Password').click();
await this.page.getByLabel('Password').fill(password);
await this.page.getByRole('button', { name: 'Sign Up' }).click();
await this.page.getByPlaceholder("user@acme.com").click();
await this.page.getByPlaceholder("user@acme.com").fill(email);
await this.page.getByLabel("Password").click();
await this.page.getByLabel("Password").fill(password);
await this.page.getByRole("button", { name: "Sign Up" }).click();
}
async login(email: string, password: string) {
await this.gotoLogin();
await this.page.getByPlaceholder('user@acme.com').click();
await this.page.getByPlaceholder('user@acme.com').fill(email);
await this.page.getByLabel('Password').click();
await this.page.getByLabel('Password').fill(password);
await this.page.getByRole('button', { name: 'Sign In' }).click();
await this.page.getByPlaceholder("user@acme.com").click();
await this.page.getByPlaceholder("user@acme.com").fill(email);
await this.page.getByLabel("Password").click();
await this.page.getByLabel("Password").fill(password);
await this.page.getByRole("button", { name: "Sign In" }).click();
}
async logout(email: string, password: string) {
await this.login(email, password);
await this.page.waitForURL('/');
await this.page.waitForURL("/");
await this.openSidebar();
const userNavButton = this.page.getByTestId('user-nav-button');
const userNavButton = this.page.getByTestId("user-nav-button");
await expect(userNavButton).toBeVisible();
await userNavButton.click();
const userNavMenu = this.page.getByTestId('user-nav-menu');
const userNavMenu = this.page.getByTestId("user-nav-menu");
await expect(userNavMenu).toBeVisible();
const authMenuItem = this.page.getByTestId('user-nav-item-auth');
await expect(authMenuItem).toContainText('Sign out');
const authMenuItem = this.page.getByTestId("user-nav-item-auth");
await expect(authMenuItem).toContainText("Sign out");
await authMenuItem.click();
const userEmail = this.page.getByTestId('user-email');
await expect(userEmail).toContainText('Guest');
const userEmail = this.page.getByTestId("user-email");
await expect(userEmail).toContainText("Guest");
}
async expectToastToContain(text: string) {
await expect(this.page.getByTestId('toast')).toContainText(text);
await expect(this.page.getByTestId("toast")).toContainText(text);
}
async openSidebar() {
const sidebarToggleButton = this.page.getByTestId('sidebar-toggle-button');
const sidebarToggleButton = this.page.getByTestId("sidebar-toggle-button");
await sidebarToggleButton.click();
}
}

149
tests/pages/chat.ts
View file

@ -1,36 +1,43 @@
import fs from 'node:fs';
import path from 'node:path';
import { chatModels } from '@/lib/ai/models';
import { expect, type Page } from '@playwright/test';
import fs from "node:fs";
import path from "node:path";
import { expect, type Page } from "@playwright/test";
import { chatModels } from "@/lib/ai/models";
const CHAT_ID_REGEX =
/^http:\/\/localhost:3000\/chat\/[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/;
export class ChatPage {
constructor(private page: Page) {}
private readonly page: Page;
public get sendButton() {
return this.page.getByTestId('send-button');
constructor(page: Page) {
this.page = page;
}
public get stopButton() {
return this.page.getByTestId('stop-button');
get sendButton() {
return this.page.getByTestId("send-button");
}
public get multimodalInput() {
return this.page.getByTestId('multimodal-input');
get stopButton() {
return this.page.getByTestId("stop-button");
}
public get scrollContainer() {
return this.page.locator('.overflow-y-scroll');
get multimodalInput() {
return this.page.getByTestId("multimodal-input");
}
public get scrollToBottomButton() {
return this.page.getByTestId('scroll-to-bottom-button');
get scrollContainer() {
return this.page.locator(".overflow-y-scroll");
}
get scrollToBottomButton() {
return this.page.getByTestId("scroll-to-bottom-button");
}
async createNewChat() {
await this.page.goto('/');
await this.page.goto("/");
}
public getCurrentURL(): string {
getCurrentURL(): string {
return this.page.url();
}
@ -41,30 +48,28 @@ export class ChatPage {
}
async isGenerationComplete() {
const response = await this.page.waitForResponse((response) =>
response.url().includes('/api/chat'),
const response = await this.page.waitForResponse((currentResponse) =>
currentResponse.url().includes("/api/chat")
);
await response.finished();
}
async isVoteComplete() {
const response = await this.page.waitForResponse((response) =>
response.url().includes('/api/vote'),
const response = await this.page.waitForResponse((currentResponse) =>
currentResponse.url().includes("/api/vote")
);
await response.finished();
}
async hasChatIdInUrl() {
await expect(this.page).toHaveURL(
/^http:\/\/localhost:3000\/chat\/[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/,
);
await expect(this.page).toHaveURL(CHAT_ID_REGEX);
}
async sendUserMessageFromSuggestion() {
await this.page
.getByRole('button', { name: 'What are the advantages of' })
.getByRole("button", { name: "What are the advantages of" })
.click();
}
@ -77,55 +82,53 @@ export class ChatPage {
}
async addImageAttachment() {
this.page.on('filechooser', async (fileChooser) => {
this.page.on("filechooser", async (fileChooser) => {
const filePath = path.join(
process.cwd(),
'public',
'images',
'mouth of the seine, monet.jpg',
"public",
"images",
"mouth of the seine, monet.jpg"
);
const imageBuffer = fs.readFileSync(filePath);
await fileChooser.setFiles({
name: 'mouth of the seine, monet.jpg',
mimeType: 'image/jpeg',
name: "mouth of the seine, monet.jpg",
mimeType: "image/jpeg",
buffer: imageBuffer,
});
});
await this.page.getByTestId('attachments-button').click();
await this.page.getByTestId("attachments-button").click();
}
public async getSelectedModel() {
const modelId = await this.page.getByTestId('model-selector').innerText();
async getSelectedModel() {
const modelId = await this.page.getByTestId("model-selector").innerText();
return modelId;
}
public async chooseModelFromSelector(chatModelId: string) {
async chooseModelFromSelector(chatModelId: string) {
const chatModel = chatModels.find(
(chatModel) => chatModel.id === chatModelId,
(currentChatModel) => currentChatModel.id === chatModelId
);
if (!chatModel) {
throw new Error(`Model with id ${chatModelId} not found`);
}
await this.page.getByTestId('model-selector').click();
await this.page.getByTestId("model-selector").click();
await this.page.getByTestId(`model-selector-item-${chatModelId}`).click();
expect(await this.getSelectedModel()).toBe(chatModel.name);
}
public async getSelectedVisibility() {
async getSelectedVisibility() {
const visibilityId = await this.page
.getByTestId('visibility-selector')
.getByTestId("visibility-selector")
.innerText();
return visibilityId;
}
public async chooseVisibilityFromSelector(
chatVisibility: 'public' | 'private',
) {
await this.page.getByTestId('visibility-selector').click();
async chooseVisibilityFromSelector(chatVisibility: "public" | "private") {
await this.page.getByTestId("visibility-selector").click();
await this.page
.getByTestId(`visibility-selector-item-${chatVisibility}`)
.click();
@ -134,24 +137,28 @@ export class ChatPage {
async getRecentAssistantMessage() {
const messageElements = await this.page
.getByTestId('message-assistant')
.getByTestId("message-assistant")
.all();
const lastMessageElement = messageElements[messageElements.length - 1];
const lastMessageElement = messageElements.at(-1);
if (!lastMessageElement) {
return null;
}
const content = await lastMessageElement
.getByTestId('message-content')
.getByTestId("message-content")
.innerText()
.catch(() => null);
const reasoningElement = await lastMessageElement
.getByTestId('message-reasoning')
.getByTestId("message-reasoning")
.isVisible()
.then(async (visible) =>
visible
? await lastMessageElement
.getByTestId('message-reasoning')
.getByTestId("message-reasoning")
.innerText()
: null,
: null
)
.catch(() => null);
@ -161,38 +168,38 @@ export class ChatPage {
reasoning: reasoningElement,
async toggleReasoningVisibility() {
await lastMessageElement
.getByTestId('message-reasoning-toggle')
.getByTestId("message-reasoning-toggle")
.click();
},
async upvote() {
await lastMessageElement.getByTestId('message-upvote').click();
await lastMessageElement.getByTestId("message-upvote").click();
},
async downvote() {
await lastMessageElement.getByTestId('message-downvote').click();
await lastMessageElement.getByTestId("message-downvote").click();
},
};
}
async getRecentUserMessage() {
const messageElements = await this.page.getByTestId('message-user').all();
const messageElements = await this.page.getByTestId("message-user").all();
const lastMessageElement = messageElements.at(-1);
if (!lastMessageElement) {
throw new Error('No user message found');
throw new Error("No user message found");
}
const content = await lastMessageElement
.getByTestId('message-content')
.getByTestId("message-content")
.innerText()
.catch(() => null);
const hasAttachments = await lastMessageElement
.getByTestId('message-attachments')
.getByTestId("message-attachments")
.isVisible()
.catch(() => false);
const attachments = hasAttachments
? await lastMessageElement.getByTestId('message-attachments').all()
? await lastMessageElement.getByTestId("message-attachments").all()
: [];
const page = this.page;
@ -202,45 +209,47 @@ export class ChatPage {
content,
attachments,
async edit(newMessage: string) {
await page.getByTestId('message-edit-button').click();
await page.getByTestId('message-editor').fill(newMessage);
await page.getByTestId('message-editor-send-button').click();
await page.getByTestId("message-edit-button").click();
await page.getByTestId("message-editor").fill(newMessage);
await page.getByTestId("message-editor-send-button").click();
await expect(
page.getByTestId('message-editor-send-button'),
page.getByTestId("message-editor-send-button")
).not.toBeVisible();
},
};
}
async expectToastToContain(text: string) {
await expect(this.page.getByTestId('toast')).toContainText(text);
await expect(this.page.getByTestId("toast")).toContainText(text);
}
async openSideBar() {
const sidebarToggleButton = this.page.getByTestId('sidebar-toggle-button');
const sidebarToggleButton = this.page.getByTestId("sidebar-toggle-button");
await sidebarToggleButton.click();
}
public async isScrolledToBottom(): Promise<boolean> {
isScrolledToBottom(): Promise<boolean> {
return this.scrollContainer.evaluate(
(el) => Math.abs(el.scrollHeight - el.scrollTop - el.clientHeight) < 1,
(el) => Math.abs(el.scrollHeight - el.scrollTop - el.clientHeight) < 1
);
}
public async waitForScrollToBottom(timeout = 5_000): Promise<void> {
async waitForScrollToBottom(timeout = 5000): Promise<void> {
const start = Date.now();
while (Date.now() - start < timeout) {
if (await this.isScrolledToBottom()) return;
if (await this.isScrolledToBottom()) {
return;
}
await this.page.waitForTimeout(100);
}
throw new Error(`Timed out waiting for scroll bottom after ${timeout}ms`);
}
public async sendMultipleMessages(
async sendMultipleMessages(
count: number,
makeMessage: (i: number) => string,
makeMessage: (i: number) => string
) {
for (let i = 0; i < count; i++) {
await this.sendUserMessage(makeMessage(i));
@ -248,7 +257,7 @@ export class ChatPage {
}
}
public async scrollToTop(): Promise<void> {
async scrollToTop(): Promise<void> {
await this.scrollContainer.evaluate((element) => {
element.scrollTop = 0;
});