深色模式与视觉测试:为什么你需要两倍的测试
深色模式将视觉测试面积翻倍。反转的颜色、破损的对比度、不可见的图片:了解自动化视觉测试如何在不加倍工作量的情况下保护两种主题。
阅读更多 →视觉测试新闻、教程和最佳实践
视觉检测远不止于逐像素比较两张图像。根据所针对的缺陷类型,算法与阈值各不相同:细微的颜色漂移(token 解析错误、sRGB 与 P3 色域转换)需要感知层面的对比;布局偏移(flexbox 错乱、margin 重复)通过结构分析更能显现;字体问题(fallback 字体替代了主字体被加载)则要求对亚像素渲染保持特别关注。在响应式或 dark mode 模式下情况又会再度变化,每一个断点都会成倍增加需要覆盖的面积。
本页汇集了剖析可检测视觉回归类型及其辨别方法的文章:与字体平滑相关的假阳性、肉眼难以察觉的真实对比度回归、窄视口下的布局崩坏、深色模式部分切换失败导致某些组件忘记适配的情形。我们也讨论了对比算法的选择(像素匹配、SSIM、感知比较)及各自的优势与盲区。Delta-QA 综合运用上述方法,在最大限度降低噪声的同时对真实回归保持严格;这些文章阐述其原理,帮助您理解一个视觉测试工具究竟能够、又不能可靠地检测出哪些内容。
深色模式将视觉测试面积翻倍。反转的颜色、破损的对比度、不可见的图片:了解自动化视觉测试如何在不加倍工作量的情况下保护两种主题。
阅读更多 →你的CSS在本地完美运行,部署后却全部崩溃了?了解CSS为何在部署后崩溃,以及自动化视觉测试如何防止这场噩梦。
阅读更多 →如何对网站进行完整的视觉审计:页面清单、基线、跨浏览器、响应式、无障碍。分步方法论。
阅读更多 →误报是视觉测试的头号问题。Anti-aliasing、动画、跨浏览器渲染:pixel diff 为什么会失败,以及结构化方法如何从根本上消除误报。
阅读更多 →AI vs deterministic algorithm for visual regression testing
阅读更多 →免费且无需注册即可视觉对比两个HTML页面。通过真实浏览器渲染发现代码中不可见的CSS差异。
阅读更多 →