自动化测试中的 js uuid4 使用手册

端到端测试和组件测试常常需要生成或匹配唯一 ID。如果处理不当，测试用例在回放时会因为 ID 变化而失败，影响 CI 稳定性。我们在 Cypress 与 Playwright 联合测试体系中总结了一套 js uuid4 使用手册，通过 deterministic 模式、日志钩子和 Mock 策略确保测试可重复，并借助 uuid-generator 的样本验证格式正确。

测试痛点

• 测试录制时生成的 UUID 与回放时不同，定位 DOM 元素困难。
• Mock 服务需要稳定的 ID 才能匹配请求与响应。
• 批量生成 ID 容易造成日志噪音，难以排查。
• 截图/录像对比时，随机 ID 会导致 diff 频繁。

解决方案

1. 可控随机源：在测试环境中重载 crypto.randomUUID，使用固定种子生成器（如 seedrandom），保证每次运行一致。
2. 测试 Hook：在测试启动时记录当前种子，写入日志，便于追溯；结束时恢复原始实现。
3. Mock 层统一：Mock 服务调用统一的 createUuid 方法，确保前后端对齐，避免出现“测试用例 ID 与 Mock 数据不匹配”。
4. 定位策略：在测试代码中优先使用 data-testid 或可读别名，不把 uuid 直接写进选择器。
5. 格式校验：使用 uuid-generator 导出的正则在断言中校验 ID 格式，避免测试误判。

脚手架示例

// test/setupUuid.ts
import { v4 as uuidv4 } from 'uuid'
import seedrandom from 'seedrandom'

let restore: (() => void) | null = null

export function enableDeterministicUuid(seed = 'ci-e2e') {
  const rng = seedrandom(seed)
  const original = crypto.randomUUID?.bind(crypto)
  ;(crypto as any).randomUUID = () => uuidv4({ random: Array.from({ length: 16 }, () => Math.floor(rng() * 256)) })
  restore = () => {
    if (original) {
      ;(crypto as any).randomUUID = original
    }
  }
}

export function disableDeterministicUuid() {
  restore?.()
  restore = null
}

在测试框架的 beforeAll 中调用 enableDeterministicUuid，在 afterAll 中恢复即可。

常见误区

• 忽略浏览器兼容：旧版浏览器没有 crypto.randomUUID，需要在生产与测试同时注入 polyfill。
• 直接依赖 ID 定位元素：一旦 ID 逻辑改变，测试全线掉线，应使用稳定属性。
• 未恢复原始实现：测试结束后不恢复可能影响后续用例，尤其是在同一标签页复用的情况下。
• 种子泄露：种子不可用于安全逻辑；同时要通过环境变量集中管理，避免开发与 CI 不一致。

经验总结

通过对随机源的可控化、Mock 服务的一致性以及辅助工具的协作，我们让自动化测试在面对 uuid4 这种高度随机的标识时仍然保持确定性。uuid-generator 提供的格式样本与压力测试脚本也是我们验证实现的重要工具。只要建立好基础设施，测试稳定性就不再受到随机字符串的困扰。