/**
 * 视觉回归测试配置
 *
 * 定义需要视觉测试的页面、视口尺寸、主题以及快照存储路径。
 * 被 tests/visual 下的 spec 文件与 helpers 共享使用。
 */

/** 视口尺寸标识 */
export type ViewportSize = "desktop" | "tablet" | "mobile"

/** 主题标识 */
export type ThemeName = "light" | "dark"

/** 角色标识 */
export type UserRole = "admin" | "teacher" | "student"

/** 视口像素配置 */
export const VIEWPORTS: Record<ViewportSize, { width: number; height: number }> = {
  desktop: { width: 1920, height: 1080 },
  tablet: { width: 768, height: 1024 },
  mobile: { width: 375, height: 812 },
}

/** 主题列表 */
export const THEMES: ThemeName[] = ["light", "dark"]

/** 视口列表 */
export const VIEWPORT_LIST: ViewportSize[] = ["desktop", "tablet", "mobile"]

/** 快照基线存储目录(相对项目根) */
export const SNAPSHOT_BASE_DIR = "tests/visual/__screenshots__"

/** storageState 存储目录(相对项目根) */
export const STORAGE_STATE_DIR = "tests/visual/.auth"

/** 角色对应的登录后仪表盘路由 */
export const DASHBOARD_ROUTES: Record<UserRole, string> = {
  admin: "/admin/dashboard",
  teacher: "/teacher/dashboard",
  student: "/student/dashboard",
}

/** 视觉测试目标页面定义 */
export interface VisualPageTarget {
  /** 页面名称,用于快照命名 */
  name: string
  /** 相对 baseURL 的路径 */
  path: string
  /** 是否需要登录 */
  requiresAuth: boolean
  /** 登录角色(requiresAuth=true 时必填) */
  role?: UserRole
  /** 页面描述 */
  description: string
}

/** 需要进行视觉测试的页面清单 */
export const VISUAL_PAGES: VisualPageTarget[] = [
  {
    name: "homepage",
    path: "/login",
    requiresAuth: false,
    description: "登录页",
  },
  {
    name: "admin-dashboard",
    path: "/admin/dashboard",
    requiresAuth: true,
    role: "admin",
    description: "管理员仪表盘",
  },
  {
    name: "teacher-dashboard",
    path: "/teacher/dashboard",
    requiresAuth: true,
    role: "teacher",
    description: "教师仪表盘",
  },
  {
    name: "student-dashboard",
    path: "/student/dashboard",
    requiresAuth: true,
    role: "student",
    description: "学生仪表盘",
  },
]

/** toHaveScreenshot 的默认选项 */
export const SCREENSHOT_DEFAULT_OPTIONS = {
  maxDiffPixelRatio: 0.01,
  animations: "disabled" as const,
  caret: "hide" as const,
  scale: "css" as const,
}

/**
 * 生成快照文件名
 * @example homepage-desktop-light.png
 */
export function snapshotName(pageName: string, viewport: ViewportSize, theme: ThemeName): string {
  return `${pageName}-${viewport}-${theme}.png`
}