mini-starter/tests/e2e/specs/admin/users.spec.ts

import { test, expect } from '../../utils/test-setup';
import testUsers from '../../fixtures/test-users.json' with { type: 'json' };

test.describe('用户管理 E2E 测试', () => {
  test.beforeEach(async ({ adminLoginPage, userManagementPage }) => {
    // 以管理员身份登录
    await adminLoginPage.goto();
    await adminLoginPage.login(testUsers.admin.username, testUsers.admin.password);
    await userManagementPage.goto();
    await userManagementPage.expectToBeVisible();
  });

  test('用户列表页面加载', async ({ userManagementPage }) => {
    await userManagementPage.expectToBeVisible();
    await expect(userManagementPage.pageTitle).toHaveText('用户管理');
  });

  test('搜索用户功能', async ({ userManagementPage }) => {
    // 在搜索框中输入关键词
    await userManagementPage.searchInput.fill('test');
    await userManagementPage.searchButton.click();

    // 验证搜索结果
    await expect(userManagementPage.userTable).toBeVisible();
    const userRows = await userManagementPage.getUserRows();
    expect(userRows.length).toBeGreaterThan(0);
  });

  test('创建新用户', async ({ userManagementPage }) => {
    const testUser = {
      username: `testuser_${Date.now()}`,
      password: 'Test123!',
      email: `test${Date.now()}@example.com`
    };

    // 打开创建用户对话框
    await userManagementPage.createUserButton.click();
    await expect(userManagementPage.createUserDialog).toBeVisible();

    // 填写用户信息
    await userManagementPage.usernameInput.fill(testUser.username);
    await userManagementPage.passwordInput.fill(testUser.password);
    await userManagementPage.emailInput.fill(testUser.email);

    // 提交表单
    await userManagementPage.submitCreateUserButton.click();

    // 验证用户创建成功
    await expect(userManagementPage.successToast).toBeVisible();
    await expect(userManagementPage.successToast).toContainText('创建成功');
  });

  test('编辑用户信息', async ({ userManagementPage }) => {
    // 获取第一个用户
    const firstUserRow = userManagementPage.getUserRow(0);
    await expect(firstUserRow).toBeVisible();

    // 点击编辑按钮
    await userManagementPage.getEditButton(0).click();
    await expect(userManagementPage.editUserDialog).toBeVisible();

    // 修改用户信息
    const newEmail = `updated${Date.now()}@example.com`;
    await userManagementPage.emailInput.fill(newEmail);

    // 提交更新
    await userManagementPage.submitEditUserButton.click();

    // 验证更新成功
    await expect(userManagementPage.successToast).toBeVisible();
    await expect(userManagementPage.successToast).toContainText('更新成功');
  });

  test('删除用户', async ({ userManagementPage }) => {
    // 获取用户行数
    const initialUserCount = (await userManagementPage.getUserRows()).length;

    if (initialUserCount > 0) {
      // 点击第一个用户的删除按钮
      await userManagementPage.getDeleteButton(0).click();
      await expect(userManagementPage.deleteConfirmDialog).toBeVisible();

      // 确认删除
      await userManagementPage.confirmDeleteButton.click();

      // 验证删除成功
      await expect(userManagementPage.successToast).toBeVisible();
      await expect(userManagementPage.successToast).toContainText('删除成功');

      // 验证用户数量减少
      const finalUserCount = (await userManagementPage.getUserRows()).length;
      expect(finalUserCount).toBe(initialUserCount - 1);
    }
  });

  test('用户列表分页', async ({ userManagementPage }) => {
    // 验证分页控件存在
    await expect(userManagementPage.pagination).toBeVisible();

    // 如果有第二页，测试翻页
    if (await userManagementPage.nextPageButton.isVisible()) {
      await userManagementPage.nextPageButton.click();
      await expect(userManagementPage.currentPageIndicator).toContainText('2');

      // 返回第一页
      await userManagementPage.previousPageButton.click();
      await expect(userManagementPage.currentPageIndicator).toContainText('1');
    }
  });

  test('用户状态筛选', async ({ userManagementPage }) => {
    // 打开高级筛选
    await userManagementPage.advancedFilterButton.click();
    await expect(userManagementPage.filterPanel).toBeVisible();

    // 选择启用状态
    await userManagementPage.statusFilter.selectOption('0');
    await userManagementPage.applyFilterButton.click();

    // 验证筛选结果
    const userRows = await userManagementPage.getUserRows();
    expect(userRows.length).toBeGreaterThan(0);

    // 验证用户状态
    for (const row of userRows) {
      const statusBadge = row.locator('[data-testid="user-status"]');
      await expect(statusBadge).toHaveText('启用');
    }
  });

  test('重置筛选条件', async ({ userManagementPage }) => {
    // 应用筛选条件
    await userManagementPage.advancedFilterButton.click();
    await userManagementPage.statusFilter.selectOption('1');
    await userManagementPage.applyFilterButton.click();

    // 重置筛选
    await userManagementPage.resetFilterButton.click();

    // 验证所有用户显示
    const userRows = await userManagementPage.getUserRows();
    expect(userRows.length).toBeGreaterThan(0);
  });

  test('用户列表排序', async ({ userManagementPage }) => {
    // 点击用户名排序
    await userManagementPage.usernameHeader.click();

    // 获取排序后的用户名
    const firstUsername = await userManagementPage.getUsername(0);
    const secondUsername = await userManagementPage.getUsername(1);

    // 验证排序（升序）
    expect(firstUsername.localeCompare(secondUsername)).toBeLessThanOrEqual(0);

    // 再次点击进行降序排序
    await userManagementPage.usernameHeader.click();

    const firstUsernameDesc = await userManagementPage.getUsername(0);
    const secondUsernameDesc = await userManagementPage.getUsername(1);

    // 验证降序排序
    expect(firstUsernameDesc.localeCompare(secondUsernameDesc)).toBeGreaterThanOrEqual(0);
  });

  test('响应式布局 - 桌面端', async ({ userManagementPage, page }) => {
    await page.setViewportSize({ width: 1200, height: 800 });
    await userManagementPage.expectToBeVisible();

    // 验证桌面端布局元素
    await expect(userManagementPage.searchInput).toBeVisible();
    await expect(userManagementPage.createUserButton).toBeVisible();
    await expect(userManagementPage.userTable).toBeVisible();
  });

  test('响应式布局 - 移动端', async ({ userManagementPage, page }) => {
    await page.setViewportSize({ width: 375, height: 667 });
    await userManagementPage.expectToBeVisible();

    // 验证移动端布局
    await expect(userManagementPage.pageTitle).toBeVisible();
    await expect(userManagementPage.mobileMenuButton).toBeVisible();
  });
});