Mangalord/frontend/e2e/settings.spec.ts

import { test, expect, type Page } from '@playwright/test';

const userFixture = {
    id: 'u1',
    username: 'alice',
    created_at: '2026-01-01T00:00:00Z'
};

async function stubAuthenticated(page: Page) {
    await page.route('**/api/v1/auth/me', (route) =>
        route.fulfill({
            status: 200,
            contentType: 'application/json',
            body: JSON.stringify({ user: userFixture })
        })
    );
}

test('settings link shows for authed users and reaches the password form', async ({ page }) => {
    await stubAuthenticated(page);
    await page.route('**/api/v1/mangas?*', (route) =>
        route.fulfill({
            status: 200,
            contentType: 'application/json',
            body: JSON.stringify({ items: [], page: { limit: 50, offset: 0, total: 0 } })
        })
    );

    await page.goto('/');
    await expect(page.getByTestId('nav-settings')).toBeVisible();
    await page.getByTestId('nav-settings').click();
    await expect(page).toHaveURL(/\/settings$/);
    await expect(page.getByTestId('password-form')).toBeVisible();
});

test('changing password shows success and clears the form', async ({ page }) => {
    await stubAuthenticated(page);
    let patchCalls = 0;
    let patchBody: unknown = null;
    await page.route('**/api/v1/auth/me/password', async (route) => {
        patchCalls += 1;
        patchBody = JSON.parse(route.request().postData() ?? '{}');
        await route.fulfill({ status: 204 });
    });

    await page.goto('/settings');
    await page.getByTestId('current-password').fill('hunter2hunter2');
    await page.getByTestId('new-password').fill('freshpassfreshpass');
    await page.getByTestId('confirm-password').fill('freshpassfreshpass');
    await page.getByTestId('password-submit').click();

    await expect(page.getByTestId('password-success')).toContainText('Password updated');
    expect(patchCalls).toBe(1);
    expect(patchBody).toEqual({
        current_password: 'hunter2hunter2',
        new_password: 'freshpassfreshpass'
    });
    // Form should clear after success.
    await expect(page.getByTestId('current-password')).toHaveValue('');
});

test('wrong current password surfaces the 401 envelope inline', async ({ page }) => {
    await stubAuthenticated(page);
    await page.route('**/api/v1/auth/me/password', (route) =>
        route.fulfill({
            status: 401,
            contentType: 'application/json',
            body: JSON.stringify({
                error: { code: 'unauthenticated', message: 'unauthenticated' }
            })
        })
    );

    await page.goto('/settings');
    await page.getByTestId('current-password').fill('definitelyNotIt');
    await page.getByTestId('new-password').fill('freshpassfreshpass');
    await page.getByTestId('confirm-password').fill('freshpassfreshpass');
    await page.getByTestId('password-submit').click();

    await expect(page.getByTestId('password-error')).toBeVisible();
});

test('mismatched new + confirm disables the submit button', async ({ page }) => {
    await stubAuthenticated(page);

    await page.goto('/settings');
    await page.getByTestId('current-password').fill('hunter2hunter2');
    await page.getByTestId('new-password').fill('freshpassfreshpass');
    await page.getByTestId('confirm-password').fill('different');

    await expect(page.getByTestId('mismatch')).toBeVisible();
    await expect(page.getByTestId('password-submit')).toBeDisabled();
});

test('anonymous user sees a sign-in prompt on /settings', async ({ page }) => {
    await page.route('**/api/v1/auth/me', (route) =>
        route.fulfill({
            status: 401,
            contentType: 'application/json',
            body: JSON.stringify({
                error: { code: 'unauthenticated', message: 'unauthenticated' }
            })
        })
    );

    await page.goto('/settings');
    await expect(page.getByTestId('settings-signin')).toBeVisible();
    await expect(page.getByTestId('password-form')).toHaveCount(0);
});