browser_visual_component
Capture a screenshot of a CSS-selected component and compare it against a named baseline to detect visual differences, returning diff pixel count and ratio. Automatically creates a baseline if none exists.
Instructions
Component-level visual diff in one call: capture a screenshot of the CSS-selected component, compare against same-named baseline, return diffPixels/diffRatio/passed. Auto-creates the baseline if missing and returns baseline_created flag.
中文详情：
用途：组件级视觉对比，一次调用完成组件截图 → 与同名基线对比 → 返回差异指标；基线不存在时自动创建并返回 baseline_created 标记
何时使用：组件库视觉回归时；卡片/弹窗/表格等独立组件 UI 验证时；多主题（light/dark）组件对比时；增量 UI 改动只对比受影响组件时
输出：{ ok: boolean, name: string, selector: string, baselinePath: string, actualPath: string, diffPath: string, diffPixels: number, diffRatio: number, passed: boolean, baseline_created: boolean }
参数：
name (string, 必填)：组件基线名称，不含扩展名
selector (string, 必填)：CSS 选择器，精确选择要对比的组件
maxDiffPixelRatio (number, 可选)：允许的最大差异像素比例，默认 0.01
sessionName (string, 可选)：浏览器会话名称，默认当前活跃会话
错误：selector 无匹配抛出 'element not found'；选择器匹配多个元素抛出 'Selector matches multiple elements, refine it'
示例：{"name":"product-card","selector":".product-card","maxDiffPixelRatio":0.005}
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| name | Yes | 组件基线名称，不含扩展名 | |
| selector | Yes | CSS 选择器，精确选择要对比的组件 | |
| sessionName | No | 浏览器会话名称，默认当前活跃会话 | |
| maxDiffPixelRatio | No | 允许的最大差异像素比例，默认 0.01 |