本技能定义了一套 React Native 应用中的黄金测试(golden)与快照测试策略,并用两个检查器脚本在代码树和 Git 历史中强制执行该策略。
主要能力:
- 数据黄金:用纯函数对固定输入生成可读文本快照,文件命名为 <unit>.golden.test.ts,快照为 <file>.golden.test.ts.snap.ios,每个条目建议不超过 120 行(目标 60 行),不得依赖时钟、机器区域设置或未设种子的随机数,不得包含渲染。
- 契约条目:以 describe('[contract] <unit> goldens') 组织,至少在 contracts/goldens.json 中登记三个键,日期键需包含年末/新年对和闰日;现有契约条目永不编辑、删除或重命名,只能追加键。
- 像素黄金:使用 Skia 绘制时,在 CanvasKit golden 项目中对生产绘制函数离屏渲染,覆盖窄屏 320x400、手机 390x560、平板 1024x700 三种画布尺寸,动画需覆盖 0、0.5、1 三个时刻,通过 test/goldens/skia-golden.ts 的 toMatchPixelGolden 匹配器比较,像素容差为 0.1%。
- 快照更新规则:只允许手动、一次一个文件地更新,命令为 npx jest <file> --selectProjects golden -u,且路径必须放在前面;任何脚本、钩子或 CI 均不得自动写入快照,所有 CI 运行使用 jest --ci。
- 提交约束:任何新增、修改或删除黄金路径的提交都必须携带 Gate-Change: 尾注,说明改了哪些黄金、为什么、检查了什么。
- 检查脚本:check-goldens.mjs 检查目录结构(快照存在、可读、无组件树或内联快照、无环境输入或 UI、契约登记、像素匹配器、尺寸、基线、无自动 -u、CI 使用 jest --ci、门控路径、忽略 diff 输出);check-golden-changes.mjs 检查提交或暂存变更中的 Gate-Change 尾注、契约条目是否被编辑或删除、容差是否未经批准被提高。
使用方式:
- 每个会话先阅读 references/golden-policy.md 了解策略。
- 选择黄金类型:可读输出用数据黄金;已安装版本必须复现的输出用契约 describe;Skia 表面用像素黄金;设备整屏用 e2e-maestro 截图基线;种子生成器输出用 golden vectors。
- 数据黄金缺失 test/goldens/golden-text.ts 时,从 templates/test/goldens/ 复制模板及其测试。
- 契约用例放在 describe('[contract] <unit> goldens'),首次使用时复制 templates/contracts/goldens.json 及其 schema,替换示例条目。
- 像素黄金缺失 test/goldens/skia-golden.ts 时复制模板并安装钉死的 jest-image-snapshot@6.5.2 与 @types/jest-image-snapshot@6.4.2。
- 创建黄金:先用 --listTests 确认只列出目标文件,再用 -u 生成,逐行阅读 .snap.ios 或打开每个 PNG,然后运行 CI=1 npx jest --ci --selectProjects golden。
- 运行 node scripts/check-goldens.mjs . 并修复所有 FAIL 行直到 RESULT: PASS。
- 写提交信息到文件,暂存后运行 node scripts/check-golden-changes.mjs . --staged --message <file>,提交;会话结束用 --range <base>..HEAD,CI 用 --range origin/main..HEAD。
适用场景:React Native 项目中保护纯函数输出的数据快照、跨版本/设备/用户文件必须复现的格式契约、Skia 绘制像素、设备截图基线,以及黄金测试的失败排查与升级重审(如 Jest 大版本、Skia 或字体升级)。
限制:本技能面向 Jest 黄金项目与 Skia/CanvasKit 渲染环境;不适用于组件树快照或内联快照(明确禁止);像素黄金仅适用于使用 Skia 绘制的应用;契约条目不允许修改;容差提升需评审者批准并记录;具体项目配置(package.json、质量门控文件)需由其他技能创建。