gym-manage/docs/superpowers/specs/2026-04-15-user-role-menu-test-fix-design.md

用户管理和角色管理测试修复设计文档

日期: 2026-04-15
作者: 张翔
版本: 1.0

1. 背景与问题

1.1 问题背景

在User Journey测试过程中，发现以下两个测试失败：

1. 导航到用户管理页面: 测试超时失败
2. 导航到角色管理页面: 测试超时失败

1.2 问题根因分析

根本原因: 用户管理和角色管理是"系统管理"菜单下的二级菜单项。在Element Plus的菜单组件中，当父菜单处于折叠状态时，子菜单项是不可见的。测试脚本直接尝试点击这些不可见的菜单项，导致超时失败。

错误信息:

locator.click: Timeout 30000ms exceeded.
Call log:
  - waiting for locator('text=用户管理').first()
    - locator resolved to <span>用户管理</span>
  - attempting click action
    - waiting for element to be visible, enabled and stable
      - element is not visible

对比分析:

• ✅ 系统配置测试：正确地先展开了系统管理菜单，测试通过
• ❌ 用户管理测试：直接尝试点击菜单项，测试失败
• ❌ 角色管理测试：直接尝试点击菜单项，测试失败

2. 解决方案设计

2.1 设计目标

修复用户管理和角色管理测试，使其能够正确展开系统管理菜单后再点击子菜单项，提高测试通过率。

2.2 技术方案

采用与系统配置测试相同的策略：先展开父菜单，再点击子菜单项。

2.3 实现细节

2.3.1 修改用户管理测试

文件: novalon-manage-web/user-journey-test.js

修改位置: 第140-180行

修改内容:

// 阶段2: 用户管理测试
console.log('\n📋 阶段2: 用户管理测试');
console.log('=====================================');

try {
  // 首先展开系统管理菜单（如果是折叠状态）
  const systemMenuSelector = '.el-sub-menu:has-text("系统管理")';
  const systemMenuElement = page.locator(systemMenuSelector).first();
  
  if (await systemMenuElement.count() > 0) {
    // 点击展开系统管理菜单
    await systemMenuElement.click();
    await page.waitForTimeout(500);
    
    // 然后点击用户管理菜单项
    const userMenuSelectors = [
      '.el-menu-item:has-text("用户管理")',
      'text=用户管理',
      'text=用户',
      '[data-menu="user"]',
      'a[href*="user"]'
    ];
    
    let navigated = false;
    for (const selector of userMenuSelectors) {
      const element = page.locator(selector).first();
      if (await element.count() > 0) {
        await element.click();
        navigated = true;
        break;
      }
    }
    
    if (navigated) {
      await page.waitForTimeout(1000);
      await captureStep(page, '04-user-management');
      logTest('导航到用户管理页面', true);
    } else {
      throw new Error('未找到用户管理菜单');
    }
  } else {
    throw new Error('未找到系统管理菜单');
  }
} catch (error) {
  logTest('导航到用户管理页面', false, error.message);
}

2.3.2 修改角色管理测试

文件: novalon-manage-web/user-journey-test.js

修改位置: 第210-240行

修改内容:

// ==================== 阶段3: 角色管理 ====================
console.log('\n📋 阶段3: 角色管理测试');
console.log('=====================================');

try {
  // 首先展开系统管理菜单（如果是折叠状态）
  const systemMenuSelector = '.el-sub-menu:has-text("系统管理")';
  const systemMenuElement = page.locator(systemMenuSelector).first();
  
  if (await systemMenuElement.count() > 0) {
    // 点击展开系统管理菜单
    await systemMenuElement.click();
    await page.waitForTimeout(500);
    
    // 然后点击角色管理菜单项
    const roleMenuSelectors = [
      '.el-menu-item:has-text("角色管理")',
      'text=角色管理',
      'text=角色',
      '[data-menu="role"]',
      'a[href*="role"]'
    ];
    
    let navigated = false;
    for (const selector of roleMenuSelectors) {
      const element = page.locator(selector).first();
      if (await element.count() > 0) {
        await element.click();
        navigated = true;
        break;
      }
    }
    
    if (navigated) {
      await page.waitForTimeout(1000);
      await captureStep(page, '05-role-management');
      logTest('导航到角色管理页面', true);
    } else {
      throw new Error('未找到角色管理菜单');
    }
  } else {
    throw new Error('未找到系统管理菜单');
  }
} catch (error) {
  logTest('导航到角色管理页面', false, error.message);
}

3. 验收标准

3.1 功能验收

• ✅ 用户管理测试能够成功导航到用户管理页面
• ✅ 角色管理测试能够成功导航到角色管理页面
• ✅ 测试通过率从80%提升到100%

3.2 质量验收

• ✅ 测试代码与系统配置测试保持一致的风格
• ✅ 测试代码包含清晰的注释
• ✅ 测试代码包含错误处理

3.3 测试验收

• ✅ User Journey测试全部通过（10/10）
• ✅ 新增Playwright测试全部通过（3/3）
• ✅ 测试报告生成成功

4. 影响范围

4.1 受影响的文件

• novalon-manage-web/user-journey-test.js: 修改用户管理和角色管理测试代码

4.2 不受影响的部分

• 前端代码：不修改
• 后端代码：不修改
• 数据库：不修改
• 其他测试：不修改

5. 风险评估

5.1 技术风险

• 风险等级: 低
• 风险描述: 修改仅涉及测试代码，不影响生产代码
• 缓解措施: 修改后立即运行测试验证

5.2 业务风险

• 风险等级: 无
• 风险描述: 不涉及业务逻辑修改

6. 后续优化建议

1. 统一测试策略: 将"先展开父菜单，再点击子菜单项"的策略应用到所有二级菜单测试中
2. 封装公共方法: 将展开菜单的逻辑封装为公共方法，减少代码重复
3. 增加等待策略: 使用更智能的等待策略（如等待元素可见）替代固定的timeout

7. 实施计划

1. 修改用户管理测试代码
2. 修改角色管理测试代码
3. 运行User Journey测试验证
4. 提交代码

预计工作量: 30分钟