博客

Chromatic 是由 Storybook 团队开发的视觉测试工具。其价值主张十分清晰：如果您的设计系统建立在 Storybook 之上，Chromatic 会自动捕获每一个 story、检测视觉回归，并在与 GitHub 集成的工作流中协调 UI 评审。这种原生集成是其面向已投入 Storybook 的 React、Vue 或 Angular 团队的优势所在，同时也是面向未使用 Storybook 团队的天然局限。

本页文章从多个角度分析 Chromatic：视觉 diff 的质量、评审体验的人体工学、按 snapshot 计费的定价模式及其对大型设计系统的影响、与 GitHub Actions 及其他 CI 的集成、与 Percy、Applitools 或 Delta-QA 的对比。我们还探讨更微妙的场景：当需要测试整页（而非仅 story 中孤立的组件）时该怎么办、如何处理 Chromatic Cloud 渲染与本地渲染之间的差异、当 story 数量达到数百时如何估算实际成本。Chromatic 在其专长领域表现卓越；Delta-QA 则定位于不同战场——完整网页、桌面端、不依赖 Storybook 或任何特定框架——这些文章将帮助您选择真正契合自身前端架构的工具。