feat: More username change tests

playwright.config.ts

@@ -4,8 +4,8 @@ export default defineConfig({
   testDir: 'tests',
   projects: [
     {
-      name: 'signup',
+      name: 'setup',
-      testMatch: /signup\.setup\.ts/,
+      testMatch: /setup\.ts/,
       use: { ...devices['Desktop Chrome'] },
     },
 
@@ -13,9 +13,9 @@ export default defineConfig({
     // since they need user accounts to run
 
     {
-      name: 'main',
+      name: 'test',
       use: { ...devices['Desktop Chrome'] },
-      dependencies: ['signup'],
+      dependencies: ['setup'],
       testMatch: /(.+\.)?(test|spec)\.[jt]s/,
     },
   ],

src/routes/signup/+page.server.ts

@@ -61,6 +61,6 @@ export const actions = {
       return setError(form, 'verify', errorMessage.charAt(0).toUpperCase() + errorMessage.slice(1));
     }
 
-    return message(form, 'Successfuly signed in.');
+    return message(form, 'Successfuly signed up.');
   },
 } satisfies Actions;

tests/setup.ts

@@ -0,0 +1,10 @@
+import { test } from '@playwright/test';
+import { signup, dupeSignup } from './utils';
+
+test('Create playwright user', async ({ page }) => {
+  await signup(page);
+});
+
+test('Create duplicate-detector user', async ({ page }) => {
+  await dupeSignup(page);
+});

tests/signout.spec.ts

@@ -1,39 +1,39 @@
-import { test, expect, type Page, type Locator } from '@playwright/test';
+// import { test, expect, type Page, type Locator } from '@playwright/test';
-import { login } from './utils';
+// import { login } from './utils';
 
-test.describe('Sign Out Button', () => {
+// test.describe('Sign Out Button', () => {
-  let page: Page;
+//   let page: Page;
-  let button: Locator;
+//   let button: Locator;
 
-  test.beforeEach(async ({ browser }) => {
+//   test.beforeEach(async ({ browser }) => {
-    page = await browser.newPage();
+//     page = await browser.newPage();
 
-    // Login and navigate
+//     // Login and navigate
-    await login(page);
+//     await login(page);
-    await page.goto('/account', { timeout: 30000, waitUntil: 'domcontentloaded' });
+//     await page.goto('/account', { timeout: 30000, waitUntil: 'domcontentloaded' });
-    // Initialize locators
+//     // Initialize locators
-    button = page.getByRole('button', { name: 'Sign Out' });
+//     button = page.getByRole('button', { name: 'Sign Out' });
-  });
+//   });
 
-  test('sign out button signs user out', async ({ request }) => {
+//   test('sign out button signs user out', async ({ request }) => {
-    // Get cookies from the browser context
+//     // Get cookies from the browser context
-    const cookies = await page.context().cookies();
+//     const cookies = await page.context().cookies();
-    const cookieHeader = cookies.map((cookie) => `${cookie.name}=${cookie.value}`).join('; ');
+//     const cookieHeader = cookies.map((cookie) => `${cookie.name}=${cookie.value}`).join('; ');
 
-    const initalfetch = await request.get('/api/checkauth', {
+//     const initalfetch = await request.get('/api/checkauth', {
-      headers: {
+//       headers: {
-        Cookie: cookieHeader,
+//         Cookie: cookieHeader,
-      },
+//       },
-    });
+//     });
-    expect(initalfetch.status()).toEqual(200);
+//     expect(initalfetch.status()).toEqual(200);
 
-    await button.click();
+//     await button.click();
 
-    const finalfetch = await request.get('/api/checkauth', {
+//     const finalfetch = await request.get('/api/checkauth', {
-      headers: {
+//       headers: {
-        Cookie: cookieHeader,
+//         Cookie: cookieHeader,
-      },
+//       },
-    });
+//     });
-    expect(finalfetch.status()).toEqual(401);
+//     expect(finalfetch.status()).toEqual(401);
-  });
+//   });
-});
+// });

tests/signup.setup.ts

@@ -1,6 +0,0 @@
-import { test } from '@playwright/test';
-import { signup } from './utils';
-
-test('Signup', async ({ page }) => {
-  await signup(page);
-});

tests/updatePassword.spec.ts

@@ -26,7 +26,7 @@ test.describe('Password Update Form', () => {
     submitButton = page.getByRole('button', { name: 'Update Password' });
   });
 
-  // Test passwords can't be the same
+  // Test that passwords can't be the same
   test('show not allow same password', async () => {
     await currentPasswordInput.fill(currentPassword);
     await newPasswordInput.fill(currentPassword);

tests/updateUsername.spec.ts

@@ -1,6 +1,11 @@
 import { test, expect, type Page, type Locator } from '@playwright/test';
 import { login } from './utils';
 
+async function expectError(message: string, page: Page) {
+  const errorMessageLocator = page.locator(`.text-sm.text-red-500:has-text("${message}")`);
+  await expect(errorMessageLocator).toBeVisible();
+}
+
 test.describe('Username Update Form', () => {
   let page: Page;
   let usernameInput: Locator;
@@ -23,7 +28,6 @@ test.describe('Username Update Form', () => {
 
   // Test that the username will change
   test('should successfully update the username', async () => {
-    await page.waitForLoadState('domcontentloaded');
     await usernameInput.fill(newUsername);
     await submitButton.click();
 
@@ -38,16 +42,34 @@ test.describe('Username Update Form', () => {
 
   // Test invalidator
   test('should show validation error for invalid username', async () => {
-    await page.waitForLoadState('domcontentloaded');
     await usernameInput.fill('a');
     await submitButton.click();
 
     // Check for error message
-    const errorMessageLocator = page.locator('span.text-sm.text-red-500:has-text("Username must be at least 3 characters.")');
+    await expectError('Username must be at least 3 characters.', page);
-    await expect(errorMessageLocator).toBeVisible();
 
     // Ensure the username wasn't updated
     const currentUsername: string = (await currentUsernameElement.textContent()) || '';
     expect(currentUsername).not.toBe('a');
   });
+
+  // Test that new and old username can't be the same
+  test('should not allow same username', async () => {
+    const currentUsername = await currentUsernameElement.textContent();
+    expect(currentUsername).toBeTruthy();
+
+    await usernameInput.fill(currentUsername!);
+    await submitButton.click();
+
+    // Check for error message
+    await expectError('New username cannot be the same as old username.', page);
+  });
+
+  // Test non-duplicate usernames
+  test('should not allow duplicate usernames', async () => {
+    await usernameInput.fill('existing_user');
+    await submitButton.click();
+
+    await expectError('Username taken.', page);
+  });
 });

tests/utils.ts

@@ -8,12 +8,20 @@ export async function login(page: Page): Promise<void> {
   await page.click('button[type="submit"]');
 }
 
-export async function signup(page: Page): Promise<void> {
+async function signupTemplate(page: Page, email: string, username: string): Promise<void> {
   await page.goto('/signup');
   await page.waitForLoadState('domcontentloaded');
-  await page.fill('#username', 'playwrightuser');
+  await page.fill('#username', username);
-  await page.fill('#email', 'playwright@playwright.com');
+  await page.fill('#email', email);
   await page.fill('#password', 'Password1234!');
   await page.fill('#verify', 'Password1234!');
   await page.click('button[type="submit"]');
 }
+
+export async function dupeSignup(page: Page): Promise<void> {
+  await signupTemplate(page, 'playwright2@playwright.com', 'existing_user');
+}
+
+export async function signup(page: Page): Promise<void> {
+  await signupTemplate(page, 'playwright@playwright.com', 'playwrightuser');
+}