test(e2e): add suite for changing email

e2e/0004-user-settings.spec.ts

@@ -2,8 +2,10 @@ import { test, expect } from '@playwright/test';
 import { loginUser } from './fixtures/fixtures';
 import { clearDatabase } from './helpers/db';
 import { testUser } from './helpers/constants';
+import { setSettings } from './helpers/settings';
 
 test.beforeEach(async ({ page }) => {
+  await setSettings({});
   await clearDatabase();
   await loginUser(page);
 
@@ -31,3 +33,49 @@ test('user can change their password', async ({ page }) => {
 
   await expect(page.getByRole('heading', { name: 'Dashboard' })).toBeVisible();
 });
+
+test('user can change their email', async ({ page }) => {
+  // Change email
+  const newEmail = 'tester2@test.com';
+
+  await page.getByRole('tab', { name: 'Security' }).click();
+  await page.getByRole('button', { name: 'Change username' }).click();
+  await page.getByPlaceholder('New username').click();
+  await page.getByPlaceholder('New username').fill(newEmail);
+
+  // Wrong password
+  await page.getByPlaceholder('Password', { exact: true }).click();
+  await page.getByPlaceholder('Password', { exact: true }).fill('incorrect');
+
+  await page.getByRole('button', { name: 'Change username' }).click();
+
+  await expect(page.getByText('Invalid password')).toBeVisible();
+
+  // Wrong email
+  await page.getByPlaceholder('Password', { exact: true }).click();
+  await page.getByPlaceholder('Password', { exact: true }).fill(testUser.password);
+  await page.getByPlaceholder('New username').click();
+  await page.getByPlaceholder('New username').fill('incorrect');
+
+  await page.getByRole('button', { name: 'Change username' }).click();
+
+  await expect(page.getByText('Must be a valid email address')).toBeVisible();
+
+  // Correct email and password
+  await page.getByPlaceholder('New username').click();
+  await page.getByPlaceholder('New username').fill(newEmail);
+
+  await page.getByRole('button', { name: 'Change username' }).click();
+
+  await expect(page.getByText('Username changed successfully')).toBeVisible();
+
+  // Login with new email
+  await page.getByPlaceholder('you@example.com').click();
+  await page.getByPlaceholder('you@example.com').fill(newEmail);
+  await page.getByPlaceholder('Your password').click();
+  await page.getByPlaceholder('Your password').fill(testUser.password);
+
+  await page.getByRole('button', { name: 'Login' }).click();
+
+  await expect(page.getByRole('heading', { name: 'Dashboard' })).toBeVisible();
+});

e2e/0005-guest-dashboard.spec.ts

@@ -21,11 +21,13 @@ test('user can activate the guest dashboard and see it when logged out', async (
   await expect(page.getByText('No apps to display')).toBeVisible();
 });
 
-test('logged out users can see the apps on the guest dashboard', async ({ page, context }) => {
+test('logged out users can see the apps on the guest dashboard', async ({ browser }) => {
   await setSettings({ guestDashboard: true });
   await db.insert(appTable).values({ config: {}, isVisibleOnGuestDashboard: true, id: 'hello-world', exposed: true, domain: 'duckduckgo.com', status: 'running' });
   await db.insert(appTable).values({ config: {}, isVisibleOnGuestDashboard: false, id: 'actual-budget', exposed: false, status: 'running' });
 
+  const context = await browser.newContext();
+  const page = await context.newPage();
   await page.goto('/');
   await expect(page.getByText(/Hello World web server/)).toBeVisible();
   const locator = page.locator('text=Actual Budget');
@@ -36,6 +38,8 @@ test('logged out users can see the apps on the guest dashboard', async ({ page,
   await newPage.waitForLoadState();
   expect(newPage.url()).toBe('https://duckduckgo.com/');
   await newPage.close();
+
+  await context.close();
 });
 
 test('user can deactivate the guest dashboard and not see it when logged out', async ({ page }) => {

e2e/helpers/global-setup.ts

@@ -1,10 +1,12 @@
 import { clearDatabase } from './db';
+import { setSettings } from './settings';
 
 /**
  *
  */
 async function globalSetup() {
   await clearDatabase();
+  await setSettings({});
 }
 
 export default globalSetup;