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

test.describe('Welcome page', () => {
  test.beforeEach(async ({ page }) => {
    await page.route('**/api/review/feed**', (route) =>
      route.fulfill({
        status: 200,
        contentType: 'application/json',
        body: JSON.stringify({ code: 200, data: [] }),
      }),
    );

    await page.goto('/login');
    await page.evaluate(() => localStorage.setItem('isLoggedIn', 'true'));
    await page.goto('/welcome');
    await page.waitForSelector('.welcome-page', { timeout: 10_000 });
  });

  test('shows welcome banner and quick action cards', async ({ page }) => {
    await expect(page.locator('.page-title')).toContainText('欢迎回来');
    await expect(page.locator('.page-subtitle')).toBeVisible();
    await expect(page.locator('.quick-card')).toHaveCount(2);
  });

  test('clicking start study navigates to /study', async ({ page }) => {
    await page.getByRole('button', { name: '开始学习' }).click();
    await expect(page).toHaveURL(/\/study/);
  });

  test('clicking start review navigates to /review', async ({ page }) => {
    await page.getByRole('button', { name: '开始复习' }).click();
    await expect(page).toHaveURL(/\/review/);
  });

  test('wheel scrolls review ticker manually while hovering', async ({ page }) => {
    const items = Array.from({ length: 10 }, (_, i) => ({
      id: i + 1,
      sessionNum: `S${i + 1}`,
      taskNum: `T${i + 1}`,
      taskName: `任务 ${i + 1}`,
      sourceType: 'FRAGMENT',
      content: `第 ${i + 1} 条学习残片内容，用来撑起首页滚动区域。`,
      createdTime: `2026-08-01 10:00:${String(i).padStart(2, '0')}`,
    }));

    await page.route('**/api/review/feed**', (route) =>
      route.fulfill({
        status: 200,
        contentType: 'application/json',
        body: JSON.stringify({ code: 200, data: items }),
      }),
    );
    await page.goto('/welcome');

    const track = page.locator('.review-scroll-track');
    const content = page.locator('.review-scroll-content');
    await expect(track).toBeVisible();
    await track.hover();

    const readTime = () =>
      content.evaluate((el) => {
        const anim = el.getAnimations()[0];
        return anim && typeof anim.currentTime === 'number' ? anim.currentTime : -1;
      });

    const before = await readTime();
    await page.mouse.wheel(0, 200);
    await expect.poll(readTime).toBeGreaterThan(before);

    await page.mouse.move(10, 10);
    const after = await readTime();
    await expect.poll(readTime).toBeGreaterThan(after);
  });
});