visual-testing 是一个面向浏览器环境、用于执行视觉测试与 UI 验证的技能，核心手段是截图与 DOM 检查相结合。
用途
当需要验证 UI 外观、将页面与设计稿进行对比、进行响应式设计测试、检查视觉回归，或排查 UI 缺陷与样式问题时，可以启用该技能。资料列出的激活场景包括：用户想验证 UI 外观；用户要求将页面与设计对比；用户需要响应式设计测试；用户想检查视觉回归；用户提到 UI 缺陷或样式问题。
主要能力
截图捕获：支持整页或元素截图（content_take-screenshot），元素可用 selector 或 ref 指定。支持注释截图，通过 annotate: true 叠加编号标签 [1]、[2] 等，并与 ARIA ref（e1、e2）对应；标题可用 annotateContent，div/span 按钮可用 cursorInteractive。还支持 PDF 生成（content_save-as-pdf）。资料特别提醒：不要用截图来理解页面结构，应先调用 a11y_take-aria-snapshot，再用截图进行视觉验证。
响应式测试：可调整视口（interaction_resize-viewport），测试移动、平板、桌面断点，并验证响应式行为。
设计对比：可与 Figma 设计稿对比（figma_compare-page-with-design），进行视觉相似度分析并识别设计偏差。
DOM 检查：可获取 HTML 结构（content_get-as-html），检查 CSS 类与样式，验证元素是否存在与可见。
视口预设
资料给出的设备预设为：Mobile S 320px × 568px；Mobile M 375px × 667px；Mobile L 425px × 812px；Tablet 768px × 1024px；Laptop 1366px × 768px；Desktop 1920px × 1080px。
测试工作流
资料给出的推荐流程为：导航到待测页面；等待网络空闲、页面完全加载；先做 ARIA 快照获取 ref（e1、e2 等）再截图；捕获基线或注释截图；调整视口测试不同尺寸；使用 ref（如 e1）进行点击并测试悬停、弹窗等交互；与预期设计对比；记录视觉问题。
常见检查项
包括各断点下的元素可见性、文本溢出与截断、图片宽高比、颜色与排版一致性、间距与对齐、交互状态样式。
限制与说明
资料未提供收费、价格、平台支持范围、安装步骤或版本信息，这些内容暂未提供。该技能的效果与可用范围取决于所依赖的浏览器开发者工具与相关工具函数是否可用。