import { TEST_CONFIG, ROUTES } from './config'

/**
 * 文件管理 E2E 测试（Playwright MCP 交互式）
 *
 * Tests the file management module:
 * 1. Super admin login
 * 2. Navigate to file management page
 * 3. Verify page initial state (upload area, filters, empty table)
 * 4. Upload file via "选择文件" button
 * 5. Edit file metadata (rename, change category)
 * 6. Preview file (shows details + download link)
 * 7. Delete file with confirmation dialog
 * 8. Verify file list is empty after delete
 *
 * Prerequisites:
 * - Backend running at localhost:8888 (with file storage configured)
 * - Frontend running at localhost:5173
 * - Admin user seeded (admin / admin123)
 *
 * How to run (via Playwright MCP):
 * 1. Navigate to login page
 * 2. Login as admin / admin123
 * 3. Navigate to /files
 * 4. Execute each test step in order
 *
 * Bug fixes verified:
 * - "选择文件" button was unresponsive due to hidden input using display:none
 *   Fix: Changed to absolute positioning with opacity:0, added type="button"
 * - Login page did not show error for wrong password
 *   Fix: AuthContext.login() now throws when response.success is false
 */

export const fileManagementE2ETests = {
  name: '文件管理 E2E 测试',
  totalSteps: 8,

  /**
   * Step 1: Super admin login
   * Action: Navigate to /login, enter admin/admin123, submit
   * Verify: Redirected to authenticated page, sidebar shows admin
   */
  step1_login: {
    action: 'Navigate to /login, fill admin/admin123, click login button',
    verify: 'Redirected to authenticated page, sidebar shows admin with super_admin role',
    status: 'PASS' as const,
    detail: 'Logged in as admin, sidebar shows "admin" with role "super_admin"',
  },

  /**
   * Step 2: Navigate to file management page
   * Action: Click "文件管理" in sidebar
   * Verify: URL = /files, file management page loaded
   */
  step2_navigateToFiles: {
    action: 'Click "文件管理" link in sidebar',
    verify: 'URL is /files, page title shows "文件管理"',
    status: 'PASS' as const,
    detail: 'Navigated to /files, page heading "文件管理" and subtitle "上传与管理系统文件" visible',
  },

  /**
   * Step 3: Verify page initial state
   * Action: Snapshot the file management page
   * Verify: Upload area, filters, table with correct columns, empty state
   */
  step3_verifyInitialState: {
    action: 'Capture page snapshot',
    verify: 'Upload area with drag-drop zone, category selector, "公开" checkbox, "选择文件" button, search input, category/type filters, table columns: 文件名/分类/大小/类型/状态/上传时间/操作, empty table shows "暂无文件"',
    status: 'PASS' as const,
    detail: 'All UI elements present: upload zone, category combobox (默认/头像/文档/媒体), 公开 checkbox, 选择文件 button, search textbox, category filter (全部分类/默认/头像/文档/媒体), type filter (全部类型/图片/视频/PDF), table with 7 columns, "暂无文件" shown in empty state',
  },

  /**
   * Step 4: Upload file via "选择文件" button
   * Action: Click "选择文件", select test-upload.txt via file chooser
   * Verify: File appears in table with correct metadata
   *
   * Bug fix verified: Only 1 file chooser opens (was 4 before fix)
   * Fix: input changed from className="hidden" to absolute positioning with opacity:0
   *       Button added type="button" to prevent form submission
   */
  step4_uploadFile: {
    action: 'Click "选择文件" button, select test-upload.txt file',
    verify: 'File chooser opens (exactly 1), file uploaded, appears in table',
    status: 'PASS' as const,
    detail: 'Clicked "选择文件" → 1 file chooser opened (bug fixed). Uploaded test-upload.txt (44 B). Table shows: 文件列表 (1), row: test-upload.txt | default | 44 B | plain | 私有 | 2026/2/14',
  },

  /**
   * Step 5: Edit file metadata
   * Action: Click "编辑" button, change name and category, save
   * Verify: Modal opens with file info, changes saved, table updated
   */
  step5_editFile: {
    action: 'Click "编辑" button → change filename to "test-upload-edited.txt", category to "文档" → click "保存"',
    verify: 'Edit modal opens with current file info, changes saved, table row updated',
    status: 'PASS' as const,
    detail: 'Edit modal: title "编辑文件信息", textbox "文件名"=test-upload.txt, combobox "分类"=默认, checkbox "公开文件". Changed name to "test-upload-edited.txt", category to "文档". After save: table shows test-upload-edited.txt | document | 44 B | plain | 私有',
  },

  /**
   * Step 6: Preview file
   * Action: Click "预览" button on the file row
   * Verify: Preview modal shows file details and download link
   */
  step6_previewFile: {
    action: 'Click "预览" button on test-upload-edited.txt row',
    verify: 'Preview modal shows file icon, name, size, type, download link, and metadata grid',
    status: 'PASS' as const,
    detail: 'Preview modal: title "test-upload-edited.txt", file icon, name, "44 B · text/plain", "下载文件" link with token URL, metadata grid: 大小=44 B, 类型=text/plain, 分类=document, 上传=2026-02-14 17:06:15',
  },

  /**
   * Step 7: Delete file with confirmation
   * Action: Click "删除" button, confirm in dialog
   * Verify: Confirmation dialog appears, file removed after confirm
   */
  step7_deleteFile: {
    action: 'Click "删除" button → confirm in deletion dialog',
    verify: 'Confirmation dialog shows file name and warning, file removed after confirm',
    status: 'PASS' as const,
    detail: 'Delete dialog: title "确认删除", message "确定要删除文件 test-upload-edited.txt 吗？", warning "文件将从存储中删除，此操作不可恢复。", buttons "取消"/"确认删除". After confirm: file removed',
  },

  /**
   * Step 8: Verify empty state after delete
   * Action: Check table state after deletion
   * Verify: Table shows "暂无文件", file count is 0
   */
  step8_verifyEmptyAfterDelete: {
    action: 'Verify table state after file deletion',
    verify: 'File list count is 0, table shows "暂无文件"',
    status: 'PASS' as const,
    detail: 'After deletion: heading shows "文件列表 (0)", table body shows single row "暂无文件"',
  },
}

/**
 * Login Error Display E2E Test (bonus - tested alongside file management)
 *
 * Bug: Login page did not show error message when entering wrong password.
 * Root cause: AuthContext.login() didn't throw when response.success was false.
 * Fix: Added else branch to throw new Error(response.message || '登录失败')
 *
 * Verification:
 * - Entered admin / wrongpassword on login page
 * - Red alert banner displayed: "用户不存在或密码错误"
 * - User stays on login page (not redirected)
 *
 * Status: PASS
 */
export const loginErrorDisplayTest = {
  name: '登录错误提示测试',
  status: 'PASS' as const,
  detail: 'Entered wrong password "wrongpassword" → red alert with role="alert" shows "用户不存在或密码错误", user stays on /login page',
}

/**
 * Test Summary:
 *
 * File Management:
 * Step 1: Super admin login ......................... PASS
 * Step 2: Navigate to file management ............... PASS
 * Step 3: Verify page initial state ................. PASS
 * Step 4: Upload file via button (bug fix) .......... PASS
 * Step 5: Edit file metadata ........................ PASS
 * Step 6: Preview file .............................. PASS
 * Step 7: Delete file with confirmation ............. PASS
 * Step 8: Verify empty state after delete ........... PASS
 *
 * Login Error Display (bonus):
 * Wrong password error message ...................... PASS
 *
 * Result: 8/8 PASS (+ 1 bonus PASS)
 *
 * Bug Fixes Verified:
 * 1. "选择文件" button unresponsive → Fixed: hidden input changed from display:none
 *    to absolute+opacity:0, Button added type="button" (FileManagementPage.tsx)
 * 2. Login wrong password no error → Fixed: AuthContext.login() throws on
 *    response.success=false (AuthContext.tsx)
 */