/**
 * 指标页：系统指标展示、刷新、JSON 折叠
 */
import { test, expect } from '@playwright/test'

test.describe('指标页', () => {
  test.beforeEach(async ({ page }) => {
    await page.goto('/metrics')
    await page.waitForSelector('.metrics-view, .metrics-header', { timeout: 8_000 })
  })

  test('页面标题显示', async ({ page }) => {
    await expect(page.locator('h2, .metrics-header h2')).toContainText('指标')
  })

  test('路由器卡片存在', async ({ page }) => {
    await expect(page.locator('h3', { hasText: /路由器/ })).toBeVisible()
  })

  test('缓存卡片存在', async ({ page }) => {
    await expect(page.locator('h3', { hasText: /缓存/ })).toBeVisible()
  })

  test('协作管线卡片存在（v2 启用时）', async ({ page }) => {
    const v2card = page.locator('h3', { hasText: /协作管线|v2/ })
    const count = await v2card.count()
    // v2 可能显示或不存在（取决于后端初始化）
    expect(count).toBeGreaterThanOrEqual(0)
  })

  test('人工检验统计卡片存在', async ({ page }) => {
    const reviewCard = page.locator('h3', { hasText: /人工检验|审核/ })
    const count = await reviewCard.count()
    if (count > 0) {
      await expect(reviewCard.first()).toBeVisible()
    }
  })

  test('指标卡片网格布局', async ({ page }) => {
    const grid = page.locator('.card-grid, .metric-card')
    await expect(grid.first()).toBeVisible()
    const cards = page.locator('.metric-card')
    expect(await cards.count()).toBeGreaterThanOrEqual(2)
  })

  test('原始 JSON 折叠可展开', async ({ page }) => {
    const details = page.locator('.raw-json, details')
    await expect(details).toBeVisible()
    const summary = details.locator('summary')
    await expect(summary).toContainText(/原始|JSON/)
    await summary.click()
    await page.waitForTimeout(300)
    // JSON 内容应出现
    await expect(page.locator('.raw-json pre, details pre')).toBeVisible()
  })

  test('刷新按钮存在且点击有效', async ({ page }) => {
    const refresh = page.locator('.refresh, button', { hasText: /刷新/ })
    await expect(refresh).toBeVisible()
    await refresh.click()
    // 刷新后数据重新加载（指标应更新或不变）
    await page.waitForTimeout(500)
    await expect(page.locator('.metrics-view')).toBeVisible()
  })

  test('卡片中的 key-value 数据存在', async ({ page }) => {
    const kvLists = page.locator('.kv-list')
    const count = await kvLists.count()
    expect(count).toBeGreaterThanOrEqual(1)
  })

  test('指标页刷新后路由保持不变', async ({ page }) => {
    await page.goto('/metrics')
    await expect(page).toHaveURL(/\/metrics/)
    await page.reload()
    await expect(page).toHaveURL(/\/metrics/)
    // 刷新后：等待网络空闲（Vue 懒加载 chunk 完成）+ Vue 渲染完成
    await page.waitForLoadState('networkidle')
    await page.waitForSelector('.metrics-view', { timeout: 10_000 })
    await expect(page.locator('.metrics-view')).toBeVisible()
  })
})