1
Display 切换
检测元素在 display 值之间切换（none、block、flex、grid、inline）。
25 测试用例
可见性与透明度
可见性变化可能使内容意外出现或消失。Delta-QA 捕捉每个可见性状态变化。
我们检测什么
2
Visibility 属性
捕捉 visibility:hidden 变化，元素变为不可见但仍占据空间。
3
透明度变化
监控从完全透明（0）到完全不透明（1）的 opacity 变化。
4
Z-index 重排
检测堆叠上下文变化，元素因 z-index 修改而以不同方式重叠。
5
Overflow 和裁剪
识别 overflow 行为变化（visible、hidden、scroll、auto），可能隐藏或显示内容。
实际场景
🎯
消失的促销横幅
一位开发者重做 header 时在父容器上添加了 overflow: hidden。促销横幅"使用代码 SUMMER 享八折"还在代码里，但视觉上被裁切了——屏幕上不可见。访客看不到促销活动，你连续好几天都在丢失销量。团队信赖测试流水线——横幅在 DOM 中存在，测试全部通过。Delta-QA 对比截图，检测到横幅消失——页面顶部的空白在差异图中立刻显现。
⚠️
遮住按钮的 z-index
一位开发者集成了一个 z-index 为 9999 的聊天小部件。在移动端，小部件正好定位在屏幕底部悬浮的"购买"按钮上方。按钮还在代码里但被聊天窗口完全遮住——客户无法购买。测试人员在桌面端验证过，没有检查移动端元素重叠的情况。Delta-QA 对比移动端截图，检测到"购买"按钮被小部件遮盖——被遮挡区域在差异图中清晰可见。
💡
让文字无法阅读的透明度
一位开发者降低了主图暗色遮罩层的透明度，想"让照片更清晰"。白色文字落在了过于明亮的背景上——几乎无法阅读。访客无法阅读首页的主要信息。这个改动看起来只是美化调整，开发者觉得效果更好就直接合并了。Delta-QA 对比截图，高亮变得无法阅读的文字——文字与背景之间的对比度下降在叠加图中清晰可见。