// ErrorBookStatsCard 组件单测
// 依据：02-architecture-design.md §15 组件设计
// 覆盖：5 项统计网格 / 掌握率进度条 / 边框高亮

import { describe, it, expect } from "vitest";
import { render, screen } from "@testing-library/react";
import { ErrorBookStatsCard } from "./ErrorBookStatsCard";
import type { ErrorBookStats } from "@/types";

function makeStats(overrides: Partial<ErrorBookStats> = {}): ErrorBookStats {
  return {
    childId: "student-001",
    totalCount: 128,
    newCount: 23,
    learningCount: 45,
    masteredCount: 60,
    dueReviewCount: 18,
    masteredRate: 0.469,
    ...overrides,
  };
}

describe("ErrorBookStatsCard 统计网格", () => {
  it("渲染 5 项统计标签", () => {
    render(<ErrorBookStatsCard stats={makeStats()} />);
    expect(screen.getByText("错题总数")).toBeInTheDocument();
    expect(screen.getByText("新增")).toBeInTheDocument();
    expect(screen.getByText("学习中")).toBeInTheDocument();
    expect(screen.getByText("已掌握")).toBeInTheDocument();
    expect(screen.getByText("待复习")).toBeInTheDocument();
  });

  it("渲染各项数值", () => {
    render(<ErrorBookStatsCard stats={makeStats()} />);
    expect(screen.getByText("128")).toBeInTheDocument();
    expect(screen.getByText("23")).toBeInTheDocument();
    expect(screen.getByText("45")).toBeInTheDocument();
    expect(screen.getByText("60")).toBeInTheDocument();
    expect(screen.getByText("18")).toBeInTheDocument();
  });

  it("渲染统计 region（aria-label）", () => {
    render(<ErrorBookStatsCard stats={makeStats()} />);
    expect(screen.getByLabelText("错题本统计")).toBeInTheDocument();
  });
});

describe("ErrorBookStatsCard 掌握率进度条", () => {
  it("渲染掌握率标题与百分比", () => {
    render(<ErrorBookStatsCard stats={makeStats()} />);
    expect(screen.getByText("掌握率")).toBeInTheDocument();
    // 0.469 → 46.9%
    expect(screen.getByText(/46\.9%/)).toBeInTheDocument();
  });

  it("渲染 progressbar 角色", () => {
    render(<ErrorBookStatsCard stats={makeStats()} />);
    const bar = screen.getByRole("progressbar", { name: "错题掌握率" });
    expect(bar).toHaveAttribute("aria-valuenow", "47");
    expect(bar).toHaveAttribute("aria-valuemin", "0");
    expect(bar).toHaveAttribute("aria-valuemax", "100");
  });

  it("masteredRate=0 时进度条为 0%", () => {
    render(<ErrorBookStatsCard stats={makeStats({ masteredRate: 0 })} />);
    const bar = screen.getByRole("progressbar", { name: "错题掌握率" });
    expect(bar).toHaveAttribute("aria-valuenow", "0");
  });

  it("masteredRate=1 时进度条为 100%", () => {
    render(<ErrorBookStatsCard stats={makeStats({ masteredRate: 1 })} />);
    const bar = screen.getByRole("progressbar", { name: "错题掌握率" });
    expect(bar).toHaveAttribute("aria-valuenow", "100");
  });
});

describe("ErrorBookStatsCard 边框高亮", () => {
  it("待复习 > 0 时待复习卡片高亮（border-warning）", () => {
    const { container } = render(
      <ErrorBookStatsCard stats={makeStats({ dueReviewCount: 5 })} />,
    );
    const warningCards = container.querySelectorAll(".border-warning");
    expect(warningCards.length).toBeGreaterThan(0);
  });

  it("已掌握 > 0 时已掌握卡片高亮（border-success）", () => {
    const { container } = render(
      <ErrorBookStatsCard stats={makeStats({ masteredCount: 10 })} />,
    );
    const successCards = container.querySelectorAll(".border-success");
    expect(successCards.length).toBeGreaterThan(0);
  });

  it("错题总数卡片高亮（border-accent）", () => {
    const { container } = render(
      <ErrorBookStatsCard stats={makeStats()} />,
    );
    const accentCards = container.querySelectorAll(".border-accent");
    expect(accentCards.length).toBeGreaterThan(0);
  });
});
