feat(client): 字体可注入 + 启用 golden 视觉回归闸

- pangolin_theme: PangolinFonts 加 useBundled 开关 + sora/manrope/jetBrainsMono/
  manropeTextTheme 封装(生产走 google_fonts / 测试走 bundled family);
  PangolinText 与 _build 改调封装,移除散落的 GoogleFonts 直接调用
- test/flutter_test_config.dart: 全测试前置,FontLoader 注册 test/fonts 真实
  Sora/Manrope/JetBrainsMono + Lucide 图标字体,置 useBundled=true
- 启用 test/golden(去 @Skip):连接键三态+推荐卡+额度卡×明暗 12 基准图
- tool/visual-diff.md: 标注 golden 严格闸已落地

测试: flutter test 76 通过(原 64+1skip → 76 无 skip), analyze 0 error

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
wangjia
2026-06-16 11:36:50 +08:00
parent 281a6261fb
commit 1340b477a7
16 changed files with 96 additions and 36 deletions
+7 -4
View File
@@ -26,10 +26,13 @@ node ~/.claude/skills/design-distill/tools/diff.mjs <baseline.png> <impl.png> <d
## 实现侧截图:两条路径与现状
### A. Flutter golden推荐,CI 友好)— 当前被 google_fonts 阻塞
`flutter test --update-goldens``RepaintBoundary`,无 chrome/窗口问题,入 CI。
**阻塞**:组件用 `GoogleFonts.*()`,测试环境 `allowRuntimeFetching=false` 会抛异常(`test/golden/components_golden_test.dart` 因此 `@Skip`)。
**解法**:让字体可注入——把 `pangolin_theme.dart``PangolinText` / `GoogleFonts.*TextTheme` 改为可由测试用 `FontLoader` 注册的 family 覆盖(test/fonts/ 已备 Manrope/Sora/JetBrainsMono ttf),或测试态走 bundled 字体。改完即可启用 golden 做严格回归闸
### A. Flutter golden已启用 ✅,CI 严格回归闸)
`flutter test --update-goldens test/golden``RepaintBoundary`,无 chrome/窗口问题,入 CI。
**字体方案**(已落地):`PangolinFonts.useBundled` 开关 + `test/flutter_test_config.dart` `FontLoader`
注册 `test/fonts/` 真实 Sora/Manrope/JetBrainsMono + Lucide 图标字体,测试态绕过 google_fonts
- 改组件视觉后:`flutter test test/golden` 失败即回归;确认是预期变更则 `--update-goldens` 重生成基准。
- 现覆盖:连接键三态 + 推荐卡 + 额度卡 × 明暗(`test/golden/components_golden_test.dart`)。
- 注:CJK 文案用 fallbackNoto Sans SC 未打包,体积大),基准自洽不影响回归检测;新增屏/组件按此模式扩展。
### B. screencapture 真实 app(已可截,但受限)
真实渲染、字体真实,但:macOS 原生标题栏(红绿灯) vs 原型自绘 chrome 结构不同;窗口精确定位需「辅助功能」权限。