Story 13.5: 跨端测试基础设施验证

Status: done

Story

作为测试开发者，我想要验证跨端测试基础设施的稳定性和可靠性，以便确保测试框架在各种条件下都能正确运行并返回一致结果。

定位说明: 本 Story 聚焦测试基础设施验证，不包含业务流程测试。业务流程测试由 Story 13.1-13.4 覆盖。

Acceptance Criteria

AC1: Page Object 稳定性验证

Given 跨端测试使用多个 Page Objects When 测试执行时调用 Page Object 方法 Then 测试应验证以下基础设施：

所有 Page Object 方法可正常调用
选择器定位准确（data-testid 优先）
页面元素等待机制正确
Page Object 之间的交互稳定

AC2: 并发操作安全性验证

Given 多个测试可能同时运行 When 执行并发跨端测试 Then 测试应验证以下基础设施：

多个测试实例之间隔离正确
Browser Context 独立性验证
测试数据清理不影响其他测试
并发执行无资源冲突

AC3: 边界情况处理验证

Given 测试框架可能遇到各种边界情况 When 执行跨端测试 Then 测试应验证以下基础设施：

网络延迟情况下的等待机制
大数据量情况下的性能处理
特殊字符的选择器匹配
超时情况的错误处理

AC4: 稳定性测试（多次运行）

Given 测试基础设施需要在各种情况下保持稳定 When 连续运行测试 10 次 Then 测试应满足以下标准：

所有测试 100% 通过
无 flaky 失败
平均执行时间稳定（± 10% 波动）
Page Object 调用成功率 100%

AC5: 错误恢复机制验证

Given 测试过程中可能出现错误 When 发生错误或失败 Then 测试应验证以下基础设施：

单个测试失败不影响其他测试
测试失败后正确清理 Browser Context
错误消息清晰且有助于调试
失败测试可以独立重新运行

AC6: 代码质量标准

Given 遵循项目测试规范 When 编写测试代码 Then 代码应符合以下标准：

使用 TIMEOUTS 常量定义超时
使用 data-testid 选择器（优先级高于文本选择器）
测试文件命名：cross-platform-stability.spec.ts
完整的测试描述和注释
TypeScript 类型安全
通过 pnpm typecheck 类型检查

Tasks / Subtasks

阶段 1: 重构分析

任务 0: 分析现有测试和重构范围
- 0.1 读取并分析当前 Story 13.5 文档
- 0.2 读取并分析当前测试文件
- 0.3 确认与 Story 13.1-13.4 的重复内容
- 0.4 明确本 Story 的聚焦点：测试基础设施验证

阶段 2: 文档重构

任务 1: 重构 Story 13.5 文档
- 1.1 修改标题为"跨端测试基础设施验证"
- 1.2 更新 Story 描述，聚焦测试基础设施
- 1.3 重写 AC1：从"数据一致性验证"改为"Page Object 稳定性验证"
- 1.4 重写 AC2：从"并发操作验证"改为"并发操作安全性验证"
- 1.5 重写 AC3：从"边界情况验证"改为"边界情况处理验证"
- 1.6 更新 AC4、AC5 聚焦基础设施
- 1.7 添加"定位说明"明确本 Story 不包含业务流程测试

阶段 3: 测试代码重构

[x] 任务 2: 重写测试文件 - 移除业务流程测试
- 2.1 移除 AC1 中的业务流程测试（创建订单、编辑订单等）
- 2.2 重新实现 AC1：Page Object 稳定性验证
- 2.3 重新实现 AC2：并发操作安全性验证（Browser Context 隔离）
- 2.4 重新实现 AC3：边界情况处理验证（选择器匹配、等待机制）
- 2.5 重新实现 AC5：错误恢复机制验证（Browser Context 清理）
[x] 任务 3: 实现新的基础设施测试
- 3.1 Page Object 方法可调用性验证
- 3.2 data-testid 选择器验证
- 3.3 页面元素等待机制验证
- 3.4 Browser Context 独立性验证
[x] 任务 4: 运行测试验证
- 4.1 运行测试确保所有测试通过（19/19 passed）
- 4.2 运行 pnpm typecheck 验证类型检查（web 包通过）
- 4.3 修复发现的问题
[x] 任务 5: 提交代码
- 5.1 提交重构后的代码
- 5.2 更新 Story 状态为完成

Dev Notes

Epic 13 背景和依赖

Epic 13: 跨端数据同步测试 (Epic E)

目标: 验证后台操作后小程序端的数据同步，覆盖完整的业务流程
业务分组: Epic E（跨端数据同步测试）
背景: 真实用户旅程跨越管理后台和小程序，需要验证数据同步的正确性和时效性
依赖:
- Epic 10: ✅ 已完成（订单管理 E2E 测试）
- Epic 12: ✅ 已完成（小程序登录测试）
- Story 13.1-13.4: 🔄 进行中（跨端数据同步测试）

Epic 13 Story 依赖关系：

Story 13.1: 后台创建订单 → 企业小程序验证 ✅
Story 13.2: 后台编辑订单 → 企业小程序验证
Story 13.3: 后台添加人员 → 人才小程序验证
Story 13.4: 后台更新状态 → 双小程序验证
Story 13.5: 跨端测试基础设施验证 ← 当前 Story
Story 13.6: 首页看板数据联动专项测试 ✅
Story 13.7: 首页导航和交互测试

Story 13.5 定位说明

本 Story 与 13.1-13.4 的区别：

Story	聚焦点	测试内容
13.1-13.4	业务流程测试	创建订单、编辑订单、添加人员、更新状态等业务功能
13.5	测试基础设施验证	Page Object 稳定性、Browser Context 隔离、选择器匹配、等待机制

本 Story 不包含：

❌ 业务流程测试（创建订单、编辑订单等）
❌ 数据一致性验证（由 13.1-13.4 覆盖）
❌ 跨端业务场景（由 13.1-13.4 覆盖）

本 Story 包含：

✅ Page Object 方法可调用性验证
✅ data-testid 选择器验证
✅ Browser Context 独立性验证
✅ 页面元素等待机制验证
✅ 并发操作安全性验证
✅ 边界情况处理验证（选择器匹配、等待机制）
✅ 错误恢复机制验证

测试基础设施验证策略

Page Object 稳定性验证：

test.describe('AC1: Page Object 稳定性验证', () => {
  test('应该能成功实例化和调用所有 Page Object 方法', async ({ adminPage }) => {
    // 验证 Page Object 可以正确实例化
    const adminLoginPage = new AdminLoginPage(adminPage);
    const orderManagementPage = new OrderManagementPage(adminPage);

    // 验证 Page Object 方法可调用
    expect(typeof adminLoginPage.goto).toBe('function');
    expect(typeof adminLoginPage.login).toBe('function');
    expect(typeof orderManagementPage.goto).toBe('function');
  });
});

Browser Context 隔离验证：

test.describe.parallel('AC2: 并发操作安全性验证', () => {
  test('Browser Context 应该独立隔离', async ({ page: page1, browser }) => {
    // 创建两个独立的 context
    const context1 = page1.context();
    const context2 = await browser.newContext();

    // 验证两个 context 是独立的
    expect(context1).not.toBe(context2);

    // 清理
    await context2.close();
  });
});

data-testid 选择器验证：

test('应该使用 data-testid 选择器定位关键元素', async ({ adminPage }) => {
  const orderManagementPage = new OrderManagementPage(adminPage);
  await orderManagementPage.goto();

  // 验证关键元素使用 data-testid 选择器
  const createButton = adminPage.getByTestId('create-order-button');
  const count = await createButton.count();
  expect(count).toBeGreaterThan(0);
});

等待机制验证：

test('页面元素等待机制应该正确工作', async ({ adminPage }) => {
  const orderManagementPage = new OrderManagementPage(adminPage);

  const startTime = Date.now();
  await orderManagementPage.goto();
  const endTime = Date.now();

  // 验证页面在合理时间内加载完成
  expect(endTime - startTime).toBeLessThan(TIMEOUTS.PAGE_LOAD);
});

测试隔离策略

确保测试之间不相互干扰：

// 使用独立的 Browser Context
test.beforeEach(async ({ browser }) => {
  // 每个测试使用独立的 context
  const context = await browser.newContext();
  const page = await context.newPage();
  // 测试代码...
});

test.afterEach(async ({ context }) => {
  // 清理 Browser Context
  await context.close();
});

错误恢复策略

测试失败后的清理：

test.afterEach(async ({ context }) => {
  try {
    // 清理 Browser Context
    await context.close();
  } catch (error) {
    // 清理失败，记录但不影响其他测试
    console.error('清理 Browser Context 失败:', error);
  }
});

参考文档

架构文档：

_bmad-output/planning-artifacts/epics.md#Epic 13
_bmad-output/project-context.md
docs/standards/e2e-radix-testing.md

相关 Story 文档：

10-14-order-stability-test.md (订单管理稳定性验证 - 测试基础设施参考)
13-1-order-create-sync.md (订单列表同步测试 - 业务流程)
13-2-order-edit-sync.md (订单编辑同步测试 - 业务流程)
13-3-person-add-sync.md (人员添加同步测试 - 业务流程)
13-4-status-update-sync.md (状态更新同步测试 - 业务流程)

Dev Agent Record

Agent Model Used

Claude Opus 4.5 (model ID: claude-opus-4-5-20251101)

Debug Log References

No debug logs needed - refactoring straightforward

Completion Notes List

Story 13.5 重构完成，状态：done

代码审查修复记录（2026-01-15）：

AC4 稳定性测试实现: 新增 AC4 测试，运行 10 次验证测试稳定性，测量执行时间波动
AC1 Page Object 验证增强: 实际调用 Page Object 方法验证返回值类型，而不仅仅是验证方法存在
AC3 网络延迟测试修复: 使用实际页面（http://localhost:8080）而非 about:blank 进行测试
AC6 TypeScript 类型验证增强: 新增 Promise 类型、实例类型、Locator 方法类型验证
测试结果: 23/23 测试全部通过，执行时间 30.8秒

重构摘要：

将 Story 13.5 从"跨端数据同步稳定性验证"重构为"跨端测试基础设施验证"
移除了与 Story 13.1-13.4 重复的业务流程测试（创建订单、编辑订单、添加人员、更新状态等）
聚焦测试基础设施验证：Page Object 稳定性、Browser Context 隔离、选择器匹配、等待机制

重构内容：

更新了 Story 文档的标题和定位说明
重写了所有 AC 的描述，聚焦测试基础设施
更新了 Dev Notes，明确本 Story 与 13.1-13.4 的区别
重写了测试文件，移除业务流程测试，新增基础设施测试

测试结果：

所有测试通过（19/19）
执行时间：~28.5 秒
无 flaky 失败
类型检查通过（web 包）

文件修改：

cross-platform-stability.spec.ts: 从 486 行减少到 361 行（减少约 25%）
移除了所有业务流程测试（创建订单、编辑订单、状态同步等）
新增了 Page Object 稳定性验证、Browser Context 隔离验证等基础设施测试

File List

Modified files:

_bmad-output/implementation-artifacts/13-5-cross-platform-stability.md (重构)
web/tests/e2e/specs/cross-platform/cross-platform-stability.spec.ts (重写)

Change Log

2026-01-14: Story 13.5 创建完成
- 跨端数据同步稳定性验证需求
- 数据一致性验证
- 并发操作验证
- 边界情况验证
- 稳定性测试（多次运行）
- 错误恢复验证
- 状态：backlog
2026-01-15: Story 13.5 重构完成
- 从"跨端数据同步稳定性验证"重构为"跨端测试基础设施验证"
- 移除与 13.1-13.4 重复的业务流程测试
- 聚焦测试基础设施验证：Page Object 稳定性、Browser Context 隔离、选择器匹配
- 更新所有 AC 的描述
- 所有测试通过（19/19）
- 状态：completed
2026-01-15: Story 13.5 代码审查修复完成
- 实现 AC4 稳定性测试（运行 10 次，测量执行时间）
- 增强 AC1 Page Object 验证（实际调用方法验证返回值）
- 修复 AC3 网络延迟测试（使用实际页面而非 about:blank）
- 增强 AC6 TypeScript 类型验证（Promise、实例、Locator 方法）
- 所有测试通过（23/23）
- 状态：done

13-5-cross-platform-stability.md 12 KB 文件歷史 原始文件