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

feat: support guest session (#919)

Browse source
This commit is contained in:
Jeremy 2025-04-25 23:40:15 -07:00 • committed by GitHub
parent 24cb2ce19b
commit 9279135355
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
34 changed files with 741 additions and 288 deletions
Download patch file Download diff file Expand all files Collapse all files

10
tests/e2e/artifacts.test.ts
View file

@ -1,8 +1,8 @@
import { expect, test } from '@playwright/test';
import { expect, test } from '../fixtures';
import { ChatPage } from '../pages/chat';
import { ArtifactPage } from '../pages/artifact';
test.describe('artifacts activity', () => {
test.describe('Artifacts activity', () => {
let chatPage: ChatPage;
let artifactPage: ArtifactPage;
@ -13,7 +13,7 @@ test.describe('artifacts activity', () => {
await chatPage.createNewChat();
});
test('create a text artifact', async () => {
test('Create a text artifact', async () => {
await chatPage.createNewChat();
await chatPage.sendUserMessage(
@ -31,7 +31,7 @@ test.describe('artifacts activity', () => {
await chatPage.hasChatIdInUrl();
});
test('toggle artifact visibility', async () => {
test('Toggle artifact visibility', async () => {
await chatPage.createNewChat();
await chatPage.sendUserMessage(
@ -50,7 +50,7 @@ test.describe('artifacts activity', () => {
await chatPage.isElementNotVisible('artifact');
});
test('send follow up message after generation', async () => {
test('Send follow up message after generation', async () => {
await chatPage.createNewChat();
await chatPage.sendUserMessage(

24
tests/e2e/auth.setup.ts
View file

@ -1,24 +0,0 @@
import path from 'node:path';
import { generateId } from 'ai';
import { getUnixTime } from 'date-fns';
import { expect, test as setup } from '@playwright/test';
const authFile = path.join(__dirname, '../../playwright/.auth/session.json');
setup('authenticate', async ({ page }) => {
const testEmail = `test-${getUnixTime(new Date())}@playwright.com`;
const testPassword = generateId(16);
await page.goto('http://localhost:3000/register');
await page.getByPlaceholder('user@acme.com').click();
await page.getByPlaceholder('user@acme.com').fill(testEmail);
await page.getByLabel('Password').click();
await page.getByLabel('Password').fill(testPassword);
await page.getByRole('button', { name: 'Sign Up' }).click();
await expect(page.getByTestId('toast')).toContainText(
'Account created successfully!',
);
await page.context().storageState({ path: authFile });
});

77
tests/e2e/auth.test.ts
View file

@ -1,77 +0,0 @@
import { generateId } from 'ai';
import { getUnixTime } from 'date-fns';
import { test, expect, type Page } from '@playwright/test';
test.use({ storageState: { cookies: [], origins: [] } });
const testEmail = `test-${getUnixTime(new Date())}@playwright.com`;
const testPassword = generateId(16);
class AuthPage {
constructor(private page: Page) {}
async gotoLogin() {
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');
}
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();
}
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();
}
async expectToastToContain(text: string) {
await expect(this.page.getByTestId('toast')).toContainText(text);
}
}
test.describe
.serial('authentication', () => {
let authPage: AuthPage;
test.beforeEach(async ({ page }) => {
authPage = new AuthPage(page);
});
test('redirect to login page when unauthenticated', async ({ page }) => {
await page.goto('/');
await expect(page.getByRole('heading')).toContainText('Sign In');
});
test('register a test account', async ({ page }) => {
await authPage.register(testEmail, testPassword);
await expect(page).toHaveURL('/');
await authPage.expectToastToContain('Account created successfully!');
});
test('register test account with existing email', async () => {
await authPage.register(testEmail, testPassword);
await authPage.expectToastToContain('Account already exists!');
});
test('log into account', async ({ page }) => {
await authPage.login(testEmail, testPassword);
await page.waitForURL('/');
await expect(page).toHaveURL('/');
await expect(page.getByPlaceholder('Send a message...')).toBeVisible();
});
});

28
tests/e2e/chat.test.ts
View file

@ -1,7 +1,7 @@
import { ChatPage } from '../pages/chat';
import { test, expect } from '@playwright/test';
import { test, expect } from '../fixtures';
test.describe('chat activity', () => {
test.describe('Chat activity', () => {
let chatPage: ChatPage;
test.beforeEach(async ({ page }) => {
@ -9,7 +9,7 @@ test.describe('chat activity', () => {
await chatPage.createNewChat();
});
test('send a user message and receive response', async () => {
test('Send a user message and receive response', async () => {
await chatPage.sendUserMessage('Why is grass green?');
await chatPage.isGenerationComplete();
@ -17,7 +17,7 @@ test.describe('chat activity', () => {
expect(assistantMessage.content).toContain("It's just green duh!");
});
test('redirect to /chat/:id after submitting message', async () => {
test('Redirect to /chat/:id after submitting message', async () => {
await chatPage.sendUserMessage('Why is grass green?');
await chatPage.isGenerationComplete();
@ -26,7 +26,7 @@ test.describe('chat activity', () => {
await chatPage.hasChatIdInUrl();
});
test('send a user message from suggestion', async () => {
test('Send a user message from suggestion', async () => {
await chatPage.sendUserMessageFromSuggestion();
await chatPage.isGenerationComplete();
@ -36,7 +36,7 @@ test.describe('chat activity', () => {
);
});
test('toggle between send/stop button based on activity', async () => {
test('Toggle between send/stop button based on activity', async () => {
await expect(chatPage.sendButton).toBeVisible();
await expect(chatPage.sendButton).toBeDisabled();
@ -51,14 +51,14 @@ test.describe('chat activity', () => {
await expect(chatPage.sendButton).toBeVisible();
});
test('stop generation during submission', async () => {
test('Stop generation during submission', async () => {
await chatPage.sendUserMessage('Why is grass green?');
await expect(chatPage.stopButton).toBeVisible();
await chatPage.stopButton.click();
await expect(chatPage.sendButton).toBeVisible();
});
test('edit user message and resubmit', async () => {
test('Edit user message and resubmit', async () => {
await chatPage.sendUserMessage('Why is grass green?');
await chatPage.isGenerationComplete();
@ -74,13 +74,13 @@ test.describe('chat activity', () => {
expect(updatedAssistantMessage.content).toContain("It's just blue duh!");
});
test('hide suggested actions after sending message', async () => {
test('Hide suggested actions after sending message', async () => {
await chatPage.isElementVisible('suggested-actions');
await chatPage.sendUserMessageFromSuggestion();
await chatPage.isElementNotVisible('suggested-actions');
});
test('upload file and send image attachment with message', async () => {
test('Upload file and send image attachment with message', async () => {
await chatPage.addImageAttachment();
await chatPage.isElementVisible('attachments-preview');
@ -98,7 +98,7 @@ test.describe('chat activity', () => {
expect(assistantMessage.content).toBe('This painting is by Monet!');
});
test('call weather tool', async () => {
test('Call weather tool', async () => {
await chatPage.sendUserMessage("What's the weather in sf?");
await chatPage.isGenerationComplete();
@ -109,7 +109,7 @@ test.describe('chat activity', () => {
);
});
test('upvote message', async () => {
test('Upvote message', async () => {
await chatPage.sendUserMessage('Why is the sky blue?');
await chatPage.isGenerationComplete();
@ -118,7 +118,7 @@ test.describe('chat activity', () => {
await chatPage.isVoteComplete();
});
test('downvote message', async () => {
test('Downvote message', async () => {
await chatPage.sendUserMessage('Why is the sky blue?');
await chatPage.isGenerationComplete();
@ -127,7 +127,7 @@ test.describe('chat activity', () => {
await chatPage.isVoteComplete();
});
test('update vote', async () => {
test('Update vote', async () => {
await chatPage.sendUserMessage('Why is the sky blue?');
await chatPage.isGenerationComplete();

20
tests/e2e/reasoning.setup.ts
View file

@ -1,20 +0,0 @@
import path from 'node:path';
import { expect, test as setup } from '@playwright/test';
import { ChatPage } from '../pages/chat';
const reasoningFile = path.join(
__dirname,
'../../playwright/.reasoning/session.json',
);
setup('switch to reasoning model', async ({ page }) => {
const chatPage = new ChatPage(page);
await chatPage.createNewChat();
await chatPage.chooseModelFromSelector('chat-model-reasoning');
await expect(chatPage.getSelectedModel()).resolves.toEqual('Reasoning model');
await page.waitForTimeout(1000);
await page.context().storageState({ path: reasoningFile });
});

12
tests/e2e/reasoning.test.ts
View file

@ -1,15 +1,15 @@
import { ChatPage } from '../pages/chat';
import { test, expect } from '@playwright/test';
import { test, expect } from '../fixtures';
test.describe('chat activity with reasoning', () => {
let chatPage: ChatPage;
test.beforeEach(async ({ page }) => {
chatPage = new ChatPage(page);
test.beforeEach(async ({ curieContext }) => {
chatPage = new ChatPage(curieContext.page);
await chatPage.createNewChat();
});
test('send user message and generate response with reasoning', async () => {
test('Curie can send message and generate response with reasoning', async () => {
await chatPage.sendUserMessage('Why is the sky blue?');
await chatPage.isGenerationComplete();
@ -21,7 +21,7 @@ test.describe('chat activity with reasoning', () => {
);
});
test('toggle reasoning visibility', async () => {
test('Curie can toggle reasoning visibility', async () => {
await chatPage.sendUserMessage('Why is the sky blue?');
await chatPage.isGenerationComplete();
@ -37,7 +37,7 @@ test.describe('chat activity with reasoning', () => {
await expect(reasoningElement).toBeVisible();
});
test('edit message and resubmit', async () => {
test('Curie can edit message and resubmit', async () => {
await chatPage.sendUserMessage('Why is the sky blue?');
await chatPage.isGenerationComplete();

207
tests/e2e/session.test.ts Normal file
View file

@ -0,0 +1,207 @@
import { expect, test } from '../fixtures';
import { AuthPage } from '../pages/auth';
import { generateRandomTestUser } from '../helpers';
import { ChatPage } from '../pages/chat';
test.describe
.serial('Guest Session', () => {
test('Authenticate as guest user when a new session is loaded', async ({
page,
}) => {
const response = await page.goto('/');
if (!response) {
throw new Error('Failed to load page');
}
let request = response.request();
const chain = [];
while (request) {
chain.unshift(request.url());
request = request.redirectedFrom();
}
expect(chain).toEqual([
'http://localhost:3000/',
'http://localhost:3000/api/auth/guest?redirectUrl=http%3A%2F%2Flocalhost%3A3000%2F',
'http://localhost:3000/',
]);
});
test('Log out is not available for guest users', async ({ page }) => {
await page.goto('/');
const sidebarToggleButton = page.getByTestId('sidebar-toggle-button');
await sidebarToggleButton.click();
const userNavButton = page.getByTestId('user-nav-button');
await expect(userNavButton).toBeVisible();
await userNavButton.click();
const userNavMenu = page.getByTestId('user-nav-menu');
await expect(userNavMenu).toBeVisible();
const authMenuItem = page.getByTestId('user-nav-item-auth');
await expect(authMenuItem).toContainText('Login to your account');
});
test('Do not authenticate as guest user when an existing non-guest session is active', async ({
adaContext,
}) => {
const response = await adaContext.page.goto('/');
if (!response) {
throw new Error('Failed to load page');
}
let request = response.request();
const chain = [];
while (request) {
chain.unshift(request.url());
request = request.redirectedFrom();
}
expect(chain).toEqual(['http://localhost:3000/']);
});
test('Allow navigating to /login as guest user', async ({ page }) => {
await page.goto('/login');
await page.waitForURL('/login');
await expect(page).toHaveURL('/login');
});
test('Allow navigating to /register as guest user', async ({ page }) => {
await page.goto('/register');
await page.waitForURL('/register');
await expect(page).toHaveURL('/register');
});
test('Do not show email in user menu for guest user', async ({ page }) => {
await page.goto('/');
const sidebarToggleButton = page.getByTestId('sidebar-toggle-button');
await sidebarToggleButton.click();
const userEmail = page.getByTestId('user-email');
await expect(userEmail).toContainText('Guest');
});
});
test.describe
.serial('Login and Registration', () => {
let authPage: AuthPage;
const testUser = generateRandomTestUser();
test.beforeEach(async ({ page }) => {
authPage = new AuthPage(page);
});
test('Register new account', async () => {
await authPage.register(testUser.email, testUser.password);
await authPage.expectToastToContain('Account created successfully!');
});
test('Register new account with existing email', async () => {
await authPage.register(testUser.email, testUser.password);
await authPage.expectToastToContain('Account already exists!');
});
test('Log into account that exists', async ({ page }) => {
await authPage.login(testUser.email, testUser.password);
await page.waitForURL('/');
await expect(page.getByPlaceholder('Send a message...')).toBeVisible();
});
test('Display user email in user menu', async ({ page }) => {
await authPage.login(testUser.email, testUser.password);
await page.waitForURL('/');
await expect(page.getByPlaceholder('Send a message...')).toBeVisible();
const userEmail = await page.getByTestId('user-email');
await expect(userEmail).toHaveText(testUser.email);
});
test('Log out as non-guest user', async () => {
await authPage.logout(testUser.email, testUser.password);
});
test('Do not force create a guest session if non-guest session already exists', async ({
page,
}) => {
await authPage.login(testUser.email, testUser.password);
await page.waitForURL('/');
const userEmail = await page.getByTestId('user-email');
await expect(userEmail).toHaveText(testUser.email);
await page.goto('/api/auth/guest');
await page.waitForURL('/');
const updatedUserEmail = await page.getByTestId('user-email');
await expect(updatedUserEmail).toHaveText(testUser.email);
});
test('Log out is available for non-guest users', async ({ page }) => {
await authPage.login(testUser.email, testUser.password);
await page.waitForURL('/');
authPage.openSidebar();
const userNavButton = page.getByTestId('user-nav-button');
await expect(userNavButton).toBeVisible();
await userNavButton.click();
const userNavMenu = page.getByTestId('user-nav-menu');
await expect(userNavMenu).toBeVisible();
const authMenuItem = page.getByTestId('user-nav-item-auth');
await expect(authMenuItem).toContainText('Sign out');
});
test('Do not navigate to /register for non-guest users', async ({
page,
}) => {
await authPage.login(testUser.email, testUser.password);
await page.waitForURL('/');
await page.goto('/register');
await expect(page).toHaveURL('/');
});
test('Do not navigate to /login for non-guest users', async ({ page }) => {
await authPage.login(testUser.email, testUser.password);
await page.waitForURL('/');
await page.goto('/login');
await expect(page).toHaveURL('/');
});
});
test.describe('Entitlements', () => {
let chatPage: ChatPage;
test.beforeEach(async ({ page }) => {
chatPage = new ChatPage(page);
});
test('Guest user cannot send more than 20 messages/day', async () => {
await chatPage.createNewChat();
for (let i = 0; i <= 20; i++) {
await chatPage.sendUserMessage('Why is the sky blue?');
await chatPage.isGenerationComplete();
}
await chatPage.sendUserMessage('Why is the sky blue?');
await chatPage.expectToastToContain(
'You have exceeded your maximum number of messages for the day! Please try again later.',
);
});
});

27
tests/fixtures.ts
View file

@ -1,34 +1,51 @@
import { expect as baseExpect, test as baseTest } from '@playwright/test';
import { createAuthenticatedContext, type UserContext } from './auth-helper';
import { createAuthenticatedContext, type UserContext } from './helpers';
import { getUnixTime } from 'date-fns';
interface Fixtures {
adaContext: UserContext;
babbageContext: UserContext;
curieContext: UserContext;
}
export const test = baseTest.extend<any, Fixtures>({
adaContext: [
async ({ browser }, use) => {
async ({ browser }, use, workerInfo) => {
const ada = await createAuthenticatedContext({
browser,
name: 'ada',
name: `ada-${workerInfo.workerIndex}-${getUnixTime(new Date())}`,
});
await use(ada);
await ada.context.close();
},
{ scope: 'worker' },
],
babbageContext: [
async ({ browser }, use) => {
async ({ browser }, use, workerInfo) => {
const babbage = await createAuthenticatedContext({
browser,
name: 'babbage',
name: `babbage-${workerInfo.workerIndex}-${getUnixTime(new Date())}`,
});
await use(babbage);
await babbage.context.close();
},
{ scope: 'worker' },
],
curieContext: [
async ({ browser }, use, workerInfo) => {
const curie = await createAuthenticatedContext({
browser,
name: `curie-${workerInfo.workerIndex}-${getUnixTime(new Date())}`,
chatModel: 'chat-model-reasoning',
});
await use(curie);
await curie.context.close();
},
{ scope: 'worker' },
],
});
export const expect = baseExpect;

29
tests/auth-helper.ts → tests/helpers.ts
View file

@ -8,6 +8,7 @@ import {
type Page,
} from '@playwright/test';
import { generateId } from 'ai';
import { ChatPage } from './pages/chat';
import { getUnixTime } from 'date-fns';
export type UserContext = {
@ -19,22 +20,24 @@ export type UserContext = {
export async function createAuthenticatedContext({
browser,
name,
chatModel = 'chat-model',
}: {
browser: Browser;
name: string;
chatModel?: 'chat-model' | 'chat-model-reasoning';
}): Promise<UserContext> {
const authDir = path.join(__dirname, '../playwright/.auth');
const directory = path.join(__dirname, '../playwright/.sessions');
if (!fs.existsSync(authDir)) {
fs.mkdirSync(authDir, { recursive: true });
if (!fs.existsSync(directory)) {
fs.mkdirSync(directory, { recursive: true });
}
const storageFile = path.join(authDir, `${name}.json`);
const storageFile = path.join(directory, `${name}.json`);
const context = await browser.newContext();
const page = await context.newPage();
const email = `test-${name}-${getUnixTime(new Date())}@playwright.com`;
const email = `test-${name}@playwright.com`;
const password = generateId(16);
await page.goto('http://localhost:3000/register');
@ -48,6 +51,12 @@ export async function createAuthenticatedContext({
'Account created successfully!',
);
const chatPage = new ChatPage(page);
await chatPage.createNewChat();
await chatPage.chooseModelFromSelector('chat-model-reasoning');
await expect(chatPage.getSelectedModel()).resolves.toEqual('Reasoning model');
await page.waitForTimeout(1000);
await context.storageState({ path: storageFile });
await page.close();
@ -60,3 +69,13 @@ export async function createAuthenticatedContext({
request: newContext.request,
};
}
export function generateRandomTestUser() {
const email = `test-${getUnixTime(new Date())}@playwright.com`;
const password = generateId(16);
return {
email,
password,
};
}

65
tests/pages/auth.ts Normal file
View file

@ -0,0 +1,65 @@
import type { Page } from '@playwright/test';
import { expect } from '../fixtures';
export class AuthPage {
constructor(private page: Page) {}
async gotoLogin() {
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');
}
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();
}
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();
}
async logout(email: string, password: string) {
await this.login(email, password);
await this.page.waitForURL('/');
await this.openSidebar();
const userNavButton = this.page.getByTestId('user-nav-button');
await expect(userNavButton).toBeVisible();
await userNavButton.click();
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');
await authMenuItem.click();
const userEmail = this.page.getByTestId('user-email');
await expect(userEmail).toContainText('Guest');
}
async expectToastToContain(text: string) {
await expect(this.page.getByTestId('toast')).toContainText(text);
}
async openSidebar() {
const sidebarToggleButton = this.page.getByTestId('sidebar-toggle-button');
await sidebarToggleButton.click();
}
}

15
tests/pages/chat.ts
View file

@ -1,7 +1,7 @@
import fs from 'fs';
import path from 'path';
import fs from 'node:fs';
import path from 'node:path';
import { chatModels } from '@/lib/ai/models';
import { expect, Page } from '@playwright/test';
import { expect, type Page } from '@playwright/test';
export class ChatPage {
constructor(private page: Page) {}
@ -179,4 +179,13 @@ export class ChatPage {
},
};
}
async expectToastToContain(text: string) {
await expect(this.page.getByTestId('toast')).toContainText(text);
}
async openSideBar() {
const sidebarToggleButton = this.page.getByTestId('sidebar-toggle-button');
await sidebarToggleButton.click();
}
}

10
tests/routes/chat.test.ts
View file

@ -21,7 +21,7 @@ test.describe
test('Ada can invoke chat generation', async ({ adaContext }) => {
const chatId = generateUUID();
const response = await adaContext.request.post('api/chat', {
const response = await adaContext.request.post('/api/chat', {
data: {
id: chatId,
messages: TEST_PROMPTS.SKY.MESSAGES,
@ -44,7 +44,7 @@ test.describe
}) => {
const [chatId] = chatIdsCreatedByAda;
const response = await babbageContext.request.post('api/chat', {
const response = await babbageContext.request.post('/api/chat', {
data: {
id: chatId,
messages: TEST_PROMPTS.GRASS.MESSAGES,
@ -61,7 +61,7 @@ test.describe
const [chatId] = chatIdsCreatedByAda;
const response = await babbageContext.request.delete(
`api/chat?id=${chatId}`,
`/api/chat?id=${chatId}`,
);
expect(response.status()).toBe(403);
@ -72,7 +72,9 @@ test.describe
test('Ada can delete her own chat', async ({ adaContext }) => {
const [chatId] = chatIdsCreatedByAda;
const response = await adaContext.request.delete(`api/chat?id=${chatId}`);
const response = await adaContext.request.delete(
`/api/chat?id=${chatId}`,
);
expect(response.status()).toBe(200);
const deletedChat = await response.json();