mini-starter/web/tests/e2e/specs/admin/platform-list.spec.ts

import { TIMEOUTS } from '../../utils/timeouts';
import { test, expect } from '../../utils/test-setup';
import { readFileSync } from 'fs';
import { join, dirname } from 'path';
import { fileURLToPath } from 'url';

const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);
const testUsers = JSON.parse(readFileSync(join(__dirname, '../../fixtures/test-users.json'), 'utf-8'));

test.describe('平台列表显示', () => {
  test.beforeEach(async ({ adminLoginPage, platformManagementPage }) => {
    // 以管理员身份登录后台
    await adminLoginPage.goto();
    await adminLoginPage.login(testUsers.admin.username, testUsers.admin.password);
    await adminLoginPage.expectLoginSuccess();
    await platformManagementPage.goto();
  });

  test.describe('列表基础显示', () => {
    test('应该显示平台列表页面元素', async ({ platformManagementPage }) => {
      // 验证页面标题可见
      await expect(platformManagementPage.pageTitle).toBeVisible();

      // 验证创建平台按钮可见
      await expect(platformManagementPage.createPlatformButton).toBeVisible();

      // 验证搜索框可见
      await expect(platformManagementPage.searchInput).toBeVisible();
      await expect(platformManagementPage.searchButton).toBeVisible();

      // 验证表格存在
      await expect(platformManagementPage.platformTable).toBeVisible();
    });

    test('应该加载平台列表数据', async ({ platformManagementPage }) => {
      // 验证表格存在且可见
      await expect(platformManagementPage.platformTable).toBeVisible();

      // 检查表格是否有 tbody 元素
      const tbody = platformManagementPage.platformTable.locator('tbody');
      await expect(tbody).toBeVisible();
    });
  });

  test.describe('列表数据字段显示', () => {
    test('应该正确显示平台数据字段', async ({ platformManagementPage }) => {
      // 创建测试平台
      const timestamp = Date.now();
      const platformName = `列表测试平台_${timestamp}`;
      const contactPerson = `列表测试联系人_${timestamp}`;
      const contactPhone = '13800138000';
      const contactEmail = `listtest_${timestamp}@example.com`;

      await platformManagementPage.createPlatform({
        platformName,
        contactPerson,
        contactPhone,
        contactEmail,
      });

      // 刷新页面确保数据加载
      await platformManagementPage.page.reload();
      await platformManagementPage.goto();

      // 查找平台行
      const platformRow = platformManagementPage.platformTable
        .locator('tbody tr')
        .filter({ hasText: platformName });

      // 验证平台在列表中
      const rowCount = await platformRow.count();
      expect(rowCount).toBeGreaterThan(0);

      // 验证平台名称（第二列）
      const nameCell = platformRow.locator('td').nth(1);
      await expect(nameCell).toContainText(platformName);

      // 验证联系人（第三列）
      const personCell = platformRow.locator('td').nth(2);
      await expect(personCell).toContainText(contactPerson);

      // 验证联系电话（第四列）
      const phoneCell = platformRow.locator('td').nth(3);
      await expect(phoneCell).toContainText(contactPhone);

      // 验证联系邮箱（第五列）
      const emailCell = platformRow.locator('td').nth(4);
      await expect(emailCell).toContainText(contactEmail);

      // 清理测试数据
      await platformManagementPage.deletePlatform(platformName);
    });

    test('应该显示操作列的编辑和删除按钮', async ({ platformManagementPage }) => {
      // 创建测试平台
      const timestamp = Date.now();
      const platformName = `操作按钮测试_${timestamp}`;

      await platformManagementPage.createPlatform({
        platformName,
        contactPerson: `测试联系人_${timestamp}`,
        contactPhone: '13900139000',
        contactEmail: `button_${timestamp}@test.com`,
      });

      // 刷新页面
      await platformManagementPage.page.reload();
      await platformManagementPage.goto();

      // 查找平台行
      const platformRow = platformManagementPage.platformTable
        .locator('tbody tr')
        .filter({ hasText: platformName });

      // 验证编辑按钮存在
      const editButton = platformRow.getByRole('button', { name: '编辑' });
      await expect(editButton).toBeVisible();

      // 验证删除按钮存在
      const deleteButton = platformRow.getByRole('button', { name: '删除' });
      await expect(deleteButton).toBeVisible();

      // 清理测试数据
      await platformManagementPage.deletePlatform(platformName);
    });

    test('应该显示创建时间列', async ({ platformManagementPage }) => {
      // 创建测试平台
      const timestamp = Date.now();
      const platformName = `创建时间测试_${timestamp}`;

      await platformManagementPage.createPlatform({
        platformName,
        contactPerson: `测试联系人_${timestamp}`,
        contactPhone: '13700137000',
        contactEmail: `time_${timestamp}@test.com`,
      });

      // 刷新页面
      await platformManagementPage.page.reload();
      await platformManagementPage.goto();

      // 查找平台行
      const platformRow = platformManagementPage.platformTable
        .locator('tbody tr')
        .filter({ hasText: platformName });

      // 验证创建时间列（第六列）存在且有内容
      const timeCell = platformRow.locator('td').nth(5);
      const timeText = await timeCell.textContent();
      expect(timeText).toBeTruthy();
      expect(timeText?.trim()).not.toBe('');

      // 清理测试数据
      await platformManagementPage.deletePlatform(platformName);
    });
  });

  test.describe('列表搜索功能', () => {
    // 存储创建的平台名称，用于清理
    const createdPlatforms: string[] = [];
    let searchTestTimestamp: number;

    test.beforeEach(async ({ platformManagementPage }) => {
      // 创建几个测试平台用于搜索测试
      searchTestTimestamp = Date.now();
      const platformA = `搜索测试平台A_${searchTestTimestamp}`;
      const platformB = `搜索测试平台B_${searchTestTimestamp}`;
      const platformC = `搜索测试平台C_${searchTestTimestamp}`;
      createdPlatforms.push(platformA, platformB, platformC);

      await platformManagementPage.createPlatform({
        platformName: platformA,
        contactPerson: `搜索联系人A_${searchTestTimestamp}`,
        contactPhone: '13800001111',
        contactEmail: `search_a_${searchTestTimestamp}@test.com`,
      });

      await platformManagementPage.createPlatform({
        platformName: platformB,
        contactPerson: `搜索联系人B_${searchTestTimestamp}`,
        contactPhone: '13800002222',
        contactEmail: `search_b_${searchTestTimestamp}@test.com`,
      });

      await platformManagementPage.createPlatform({
        platformName: platformC,
        contactPerson: `搜索联系人C_${searchTestTimestamp}`,
        contactPhone: '13800003333',
        contactEmail: `search_c_${searchTestTimestamp}@test.com`,
      });

      // 刷新页面确保数据加载
      await platformManagementPage.page.reload();
      await platformManagementPage.goto();
    });

    test('应该能通过平台名称搜索', async ({ platformManagementPage }) => {
      // 使用 beforeEach 中创建的平台名称进行搜索
      const searchName = `搜索测试平台A_${searchTestTimestamp}`;

      // 搜索平台
      const found = await platformManagementPage.searchByName(searchName);
      expect(found).toBe(true);

      // 验证搜索结果只显示匹配的平台
      const platformRow = platformManagementPage.platformTable
        .locator('tbody tr')
        .filter({ hasText: searchName });
      const rowCount = await platformRow.count();
      expect(rowCount).toBeGreaterThan(0);
    });

    test('搜索不存在的平台应返回空结果', async ({ platformManagementPage }) => {
      // 搜索不存在的平台
      const nonExistentName = `不存在的平台_${Date.now()}`;
      await platformManagementPage.searchInput.fill(nonExistentName);
      await platformManagementPage.searchButton.click();

      // 等待搜索结果更新（使用表格内容变化而非固定超时）
      await platformManagementPage.page.waitForLoadState('networkidle');

      // 验证搜索结果为空
      const exists = await platformManagementPage.platformExists(nonExistentName);
      expect(exists).toBe(false);
    });

    test('应该能清空搜索条件', async ({ platformManagementPage }) => {
      // 先执行一次搜索
      await platformManagementPage.searchInput.fill(`搜索测试平台A_${searchTestTimestamp}`);
      await platformManagementPage.searchButton.click();

      // 等待搜索完成
      await platformManagementPage.page.waitForLoadState('networkidle');

      // 清空搜索
      await platformManagementPage.searchInput.fill('');
      await platformManagementPage.searchButton.click();

      // 等待列表刷新
      await platformManagementPage.page.waitForLoadState('networkidle');

      // 验证所有数据都显示出来了
      const tbody = platformManagementPage.platformTable.locator('tbody tr');
      const rowCount = await tbody.count();
      expect(rowCount).toBeGreaterThan(0);
    });

    test.afterEach(async ({ platformManagementPage }) => {
      // 清理测试数据（使用实际创建的平台名称）
      for (const platformName of createdPlatforms) {
        try {
          await platformManagementPage.deletePlatform(platformName);
        } catch (error) {
          // 忽略删除失败（平台可能已被删除或从未创建成功）
          console.debug(`清理平台 ${platformName} 时出错，忽略:`, error);
        }
      }
      // 清空数组
      createdPlatforms.length = 0;
    });
  });

  test.describe('空列表状态', () => {
    test('当列表为空时应显示空状态提示', async ({ platformManagementPage }) => {
      // 获取当前所有平台
      const tbody = platformManagementPage.platformTable.locator('tbody tr');
      const initialCount = await tbody.count();

      // 如果环境已有数据，跳过此测试
      // 注意：此测试需要在空数据环境中运行，或者需要实现删除所有数据的逻辑
      // 由于删除所有数据可能影响其他测试，这里使用条件跳过
      test.skip(
        initialCount > 0,
        `环境已有 ${initialCount} 个平台数据，跳过空状态测试。此测试需要在空数据环境中运行。`
      );

      // 以下代码仅在无数据环境中执行：
      // 验证空状态提示显示
      const emptyState = platformManagementPage.page.getByText(/暂无数据|无平台|empty/i);
      await expect(emptyState).toBeVisible();
    });

    test('空状态下创建平台按钮仍然可用', async ({ platformManagementPage }) => {
      // 无论列表是否为空，创建按钮都应该可用
      await expect(platformManagementPage.createPlatformButton).toBeVisible();
      await expect(platformManagementPage.createPlatformButton).toBeEnabled();
    });
  });

  test.describe('列表数据刷新', () => {
    test('创建新平台后列表应该自动更新', async ({ platformManagementPage }) => {
      const timestamp = Date.now();
      const platformName = `刷新测试平台_${timestamp}`;

      // 创建平台
      await platformManagementPage.createPlatform({
        platformName,
        contactPerson: `刷新测试联系人_${timestamp}`,
        contactPhone: '13600136000',
        contactEmail: `refresh_${timestamp}@test.com`,
      });

      // 验证平台出现在列表中（使用重试机制）
      await expect(async () => {
        const exists = await platformManagementPage.platformExists(platformName);
        expect(exists).toBe(true);
      }).toPass({ timeout: TIMEOUTS.DIALOG });

      // 清理测试数据
      await platformManagementPage.deletePlatform(platformName);
    });

    test('删除平台后列表应该自动更新', async ({ platformManagementPage }) => {
      const timestamp = Date.now();
      const platformName = `删除刷新测试_${timestamp}`;

      // 创建平台
      await platformManagementPage.createPlatform({
        platformName,
        contactPerson: `删除刷新联系人_${timestamp}`,
        contactPhone: '13500135000',
        contactEmail: `delete_refresh_${timestamp}@test.com`,
      });

      // 验证平台存在
      expect(await platformManagementPage.platformExists(platformName)).toBe(true);

      // 删除平台
      await platformManagementPage.deletePlatform(platformName);

      // 验证平台已从列表中移除
      await expect(async () => {
        const exists = await platformManagementPage.platformExists(platformName);
        expect(exists).toBe(false);
      }).toPass({ timeout: TIMEOUTS.DIALOG });
    });
  });

  test.describe('列表表格结构', () => {
    test('应该有正确的表头', async ({ platformManagementPage }) => {
      // 验证表格存在
      const table = platformManagementPage.platformTable;
      await expect(table).toBeVisible();

      // 验证表头存在
      const thead = table.locator('thead');
      await expect(thead).toBeVisible();

      // 验证表头包含预期的列
      await expect(thead).toContainText('ID');
      await expect(thead).toContainText('平台名称');
      await expect(thead).toContainText('联系人');
      await expect(thead).toContainText('联系电话');
      await expect(thead).toContainText('联系邮箱');
    });

    test('表格应该有tbody元素', async ({ platformManagementPage }) => {
      const tbody = platformManagementPage.platformTable.locator('tbody');
      await expect(tbody).toBeVisible();
    });
  });

  test.describe('分页功能（如果适用）', () => {
    // 检查是否有分页组件的辅助函数
    let hasPaginationComponent = false;

    test.beforeAll(async ({ platformManagementPage }) => {
      // 在所有测试前检查分页组件是否存在
      const pagination = platformManagementPage.page.locator('.pagination, [data-testid="pagination"]');
      hasPaginationComponent = await pagination.count() > 0;
    });

    test('检查分页组件是否存在', async ({ platformManagementPage }) => {
      // 如果没有分页组件，跳过整个 describe 块的测试
      test.skip(!hasPaginationComponent, '当前列表没有分页功能，跳过分页相关测试');

      // 如果存在分页，验证其可见性
      const pagination = platformManagementPage.page.locator('.pagination, [data-testid="pagination"]');
      await expect(pagination.first()).toBeVisible();
    });

    // 注意：以下测试需要分页组件存在，并需要创建足够的测试数据（超过一页的数据量）
    // 由于创建大量测试数据可能影响测试速度和稳定性，这里暂时跳过
    // 如果需要实现完整的分页测试，需要：
    // 1. 创建超过每页显示数量的平台数据
    // 2. 验证分页切换功能
    // 3. 验证每页显示数量选择

    test.skip(true, '分页功能完整测试需要创建大量测试数据，暂时跳过。如需测试，请在测试环境创建足够的数据后运行。');
  });

  test.describe('列表交互测试', () => {
    test('点击编辑按钮应该打开编辑对话框', async ({ platformManagementPage }) => {
      // 创建测试平台
      const timestamp = Date.now();
      const platformName = `编辑交互测试_${timestamp}`;

      await platformManagementPage.createPlatform({
        platformName,
        contactPerson: `编辑测试联系人_${timestamp}`,
        contactPhone: '13400134000',
        contactEmail: `edit_interact_${timestamp}@test.com`,
      });

      // 刷新页面
      await platformManagementPage.page.reload();
      await platformManagementPage.goto();

      // 点击编辑按钮
      await platformManagementPage.openEditDialog(platformName);

      // 验证编辑对话框打开
      const dialog = platformManagementPage.page.locator('[role="dialog"]');
      await expect(dialog).toBeVisible();

      // 验证编辑对话框标题
      await expect(platformManagementPage.editDialogTitle).toBeVisible();

      // 关闭对话框
      await platformManagementPage.cancelDialog();

      // 清理测试数据
      await platformManagementPage.deletePlatform(platformName);
    });

    test('点击删除按钮应该打开删除确认对话框', async ({ platformManagementPage }) => {
      // 创建测试平台
      const timestamp = Date.now();
      const platformName = `删除交互测试_${timestamp}`;

      await platformManagementPage.createPlatform({
        platformName,
        contactPerson: `删除测试联系人_${timestamp}`,
        contactPhone: '13300133000',
        contactEmail: `delete_interact_${timestamp}@test.com`,
      });

      // 刷新页面
      await platformManagementPage.page.reload();
      await platformManagementPage.goto();

      // 点击删除按钮
      await platformManagementPage.openDeleteDialog(platformName);

      // 验证删除确认对话框打开
      const dialog = platformManagementPage.page.locator('[role="alertdialog"]');
      await expect(dialog).toBeVisible();

      // 取消删除
      await platformManagementPage.cancelDelete();

      // 验证平台仍然存在
      expect(await platformManagementPage.platformExists(platformName)).toBe(true);

      // 清理测试数据
      await platformManagementPage.deletePlatform(platformName);
    });
  });
});