Mangalord/frontend/e2e/profile.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 })
        })
    );
    // Profile overview hits these for the count cards — return zeros
    // unless a test overrides.
    await page.route('**/api/v1/me/bookmarks?*', (route) =>
        route.fulfill({
            status: 200,
            contentType: 'application/json',
            body: JSON.stringify({ items: [], page: { limit: 1, offset: 0, total: 0 } })
        })
    );
    await page.route('**/api/v1/me/collections?*', (route) =>
        route.fulfill({
            status: 200,
            contentType: 'application/json',
            body: JSON.stringify({ items: [], page: { limit: 1, offset: 0, total: 0 } })
        })
    );
}

test('Profile link in nav for authed users; landing shows counts', 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-profile')).toBeVisible();
    await page.getByTestId('nav-profile').click();
    await expect(page).toHaveURL(/\/profile$/);
    await expect(page.getByTestId('overview-bookmarks')).toBeVisible();
    await expect(page.getByTestId('overview-collections')).toBeVisible();
});

test('Account tab reaches the password form', async ({ page }) => {
    await stubAuthenticated(page);
    await page.goto('/profile');
    await page.getByTestId('tab-account').click();
    await expect(page).toHaveURL(/\/profile\/account$/);
    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('/profile/account');
    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'
    });
    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('/profile/account');
    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('/profile/account');
    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 profile sign-in prompt', 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('/profile');
    await expect(page.getByTestId('profile-signin')).toBeVisible();
    await expect(page.getByTestId('password-form')).toHaveCount(0);
});

test('/settings 308-redirects to /profile/preferences', async ({ page }) => {
    await stubAuthenticated(page);
    await page.goto('/settings');
    await expect(page).toHaveURL(/\/profile\/preferences$/);
    // The theme radio is visually hidden (decorated label wraps it), so
    // assert presence rather than CSS visibility.
    await expect(page.getByTestId('theme-radio-system')).toBeAttached();
});