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

// These E2E tests run against the SvelteKit dev server, which proxies /api
// to the backend. Playwright starts vite via `webServer` (see
// playwright.config.ts) unless E2E_BASE_URL points at a different deployment.
//
// Routes are mocked at the page level so the journeys are deterministic and
// don't require a live backend.

const emptyPage = { items: [], page: { limit: 50, offset: 0, total: null } };

async function mockAnonymous(page: Page) {
    await page.route('**/api/v1/auth/me', async (route) => {
        await route.fulfill({
            status: 401,
            contentType: 'application/json',
            body: JSON.stringify({ error: { code: 'unauthenticated', message: 'unauthenticated' } })
        });
    });
}

test('home page renders the Mangalord heading and search input', async ({ page }) => {
    await mockAnonymous(page);
    await page.route('**/api/v1/mangas*', async (route) => {
        await route.fulfill({
            status: 200,
            contentType: 'application/json',
            body: JSON.stringify(emptyPage)
        });
    });

    await page.goto('/');
    await expect(page.getByRole('link', { name: 'Mangalord' })).toBeVisible();
    await expect(page.getByTestId('search-input')).toBeVisible();
    await expect(page.getByTestId('empty')).toContainText('No mangas yet');
});

test('search updates the manga list', async ({ page }) => {
    await mockAnonymous(page);
    let lastSearch: string | null = null;
    await page.route('**/api/v1/mangas*', async (route) => {
        const url = new URL(route.request().url());
        lastSearch = url.searchParams.get('search');
        const items =
            lastSearch === 'berserk'
                ? [
                      {
                          id: 'b1',
                          title: 'Berserk',
                          author: 'Kentaro Miura',
                          description: null,
                          cover_image_path: null,
                          created_at: '2026-01-01T00:00:00Z',
                          updated_at: '2026-01-01T00:00:00Z'
                      }
                  ]
                : [];
        await route.fulfill({
            status: 200,
            contentType: 'application/json',
            body: JSON.stringify({ items, page: { limit: 50, offset: 0, total: null } })
        });
    });

    await page.goto('/');
    await page.getByTestId('search-input').fill('berserk');
    await page.getByRole('button', { name: 'Search' }).click();

    await expect(page.getByTestId('manga-list')).toContainText('Berserk');
    expect(lastSearch).toBe('berserk');
});