mcpField
A
accessibility-inspect

accessibility-inspect

github.com/accesslint测试与质量114957 次安装9 周前更新
代码仓库

关于 accessibility-inspect

accessibility-inspect 是对运行中的页面进行半自动人工无障碍评估的技能,面向需要检查键盘操作、焦点和状态变化的团队。它记录证据与未完成检查项,但不修复问题。

主要功能

  1. 01检查键盘操作与焦点
  2. 02评估结构、状态及视觉适配
  3. 03按影响和证据等级记录发现
  4. 04标记未执行及需人工确认的检查

适用场景

  1. 01检查自定义控件的键盘行为
  2. 02评估表单错误和状态变化
  3. 03为需要辅助技术的检查提供交接

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/accesslint/skills --skill accessibility-inspect

安装后在 Claude Code 中输入/accessibility-inspect确认已加载。

附带文件references/checkpoints.md

详细介绍

这是 WCAG 评估的半自动人工环节:需要交互(键盘、焦点、状态变化、重排)或人工审核(焦点可见性、错误恢复、阅读顺序)的检查,静态规则引擎无法判定这些问题。请针对正在运行的页面进行检查;仅使用源代码将发现映射到 file:line。定位并评估问题,不要修复(修复由 accesslint:accessibility-fix 负责)。自动化环节是 accesslint:accessibility-scan;accesslint:accessibility-audit 会在 WCAG-EM 下运行两者。

通用规则——严重程度、禁止代理判断的边界、高风险模式、符合性、证据支撑——见 ../shared/methodology.md。当某项判断需要裁量时,请阅读该文档。以下规则始终适用。

分级

为每项发现标注严重程度(对用户的影响)和证据依据(你能提供支持的内容)。两者要分开。

  • ● 已验证 — 结果确定且可复现。请引用选择器、交互操作,以及观察到的辅助功能树或 DOM 事实。没有这些证据,就不能标为 ●。
  • ◐ 已标记 — 你有证据,但仍需由人工判断。请附上证据和你的意见;不要自行下定论。
  • ○ 需人工判断 — 需要辅助技术或亲身体验。请交由人工处理;不要模拟判断。

如果无法确定应采用哪种证据等级,请选择较低等级。图标的填充表示证据依据,而非颜色。

如果一项发现同时包含确定性事实和解释性判断,应采用较低等级。可由机器检查的部分(例如辅助功能树中没有程序化状态——这是 1.3.1 的事实)是 ◐ 发现中的 ● 级证据;解释性结论(例如颜色是传达含义的唯一方式——对应 1.4.1)仍为 ◐。引用 ● 部分的证据,不会提升整项发现的等级。

严重程度(对用户的影响,与证据依据分开):

  • 严重 — 阻断核心任务,且没有可行的替代方法。
  • 较高 — 造成重大障碍;任务可以完成,但难度较大。
  • 中等 — 造成明显不便;任务仍可完成。
  • 轻微 — 造成少量效率损失或影响润饰效果。

台账——分母,而非脚本

以下检查点区域构成此次运行的分母:其中的每项标准都会以且仅以一种状态结束,报告会注明具体状态。

  • ● 已验证 或 ◐/○ 已标记——你执行了检查,并掌握了证据。
  • N/A——页面上不存在触发该项的功能(没有表单、媒体或拖动 UI)。根据快照判定;不计成本。
  • 未测试——该功能存在,但你没有执行检查。报告中会标记为未确定,绝不会悄然省略,也不会算作通过。

未测试是合理且诚实的结果,不产生任何成本。只测试页面功能和引擎缺口所要求的内容;不要为了让报告看起来全面而逐项测试检查点。“未确定——未测试”和已测试并验证的条目,区别在于证据,而非诚实程度。

在测试前而非测试后去重:引擎(accessibility-scan)负责静态可检测的标准——名称/标签是否存在、lang、autocomplete、语义标记、纯色背景上的文本对比度。如果提供了扫描结果集或由引擎负责的 SC 列表(如 accessibility-audit 会提供),切勿重新检查这些标准;应在台账中标记为由引擎负责。如果没有,则根据初始快照读取可获取的信息,而不是重新推导引擎会检测到的内容。

区域SC测试触发条件
键盘与焦点2.1.1, 2.1.2, 2.4.3, 2.4.7, 2.4.11始终测试——一次批量遍历(见下文)
结构与语义1.3.1, 1.3.2, 2.4.1, 2.4.6始终测试——从初始快照读取;无需额外操作
名称、角色、状态4.1.2, 2.5.3, 4.1.3存在自定义控件/有状态控件(静态名称是否存在由引擎负责)
视觉适配1.4.1, 1.4.4, 1.4.10, 1.4.12, 1.3.4, 2.3.3, 1.4.11每个页面都测试重排/缩放(各调整一次);仅在存在动态效果时检查动态效果
表单与错误3.3.1–3.3.3, 1.3.5, 3.3.7, 3.3.8存在表单(标签/autocomplete 是否存在由引擎负责)
媒体与计时1.2.x, 2.2.1, 2.2.2存在 <video>/<audio>、自动播放或超时
指针与目标2.5.1, 2.5.7, 2.5.8目标大小可从批量遍历中免费检查;仅在存在拖动 UI 时检查拖动操作
内容与导航3.1.1/2, 2.4.4, 3.2.3/4, 3.2.6从快照检查 lang 和链接用途;跨页面一致性由 accessibility-audit 负责(此处不测试)

各检查点的操作步骤和默认评级:references/checkpoints.md。在触发的区域需要详细步骤时,或用户要求进行深度检查(--deep:通过完整流程测试每个触发区域)时,请阅读该文档。

证据预算——根据评级限制投入

经过校准的不确定性,成本必须低于错误的确定性。发现项可能达到的评级决定值得收集多少证据:

  • ●——一次性收集完整证据:选择器、交互、观察到的 DOM 或无障碍树事实。不要重复已记录过的交互。
  • ◐——严格限制:一个选择器、一张截图(仅当问题与视觉有关时)、你的判断,以及需要由他人确认的内容。然后停止。无论你的倾向如何,◐ 都必须由人工重新判定;更多证据不会将其升级为 ●,只会增加成本。
  • ○——不进行任何操作:说明功能、辅助技术以及你已测试的流程。切勿为了“强化”○ 而操作页面。

前提:可操作的浏览器

此级别通过浏览器 MCP 运行:chrome-devtools(推荐)、playwright 或 puppeteer。如果没有连接任何一种工具,则只运行静态检查,其余内容报告为 ○ 待人工处理,并告知用户:

claude mcp add chrome-devtools npx -- -y chrome-devtools-mcp@latest

目标

$ARGUMENTS 是一个 URL、accesslint.config.json 中的目标名称,或留空以使用默认目标。--selector <css> 将范围限定为某个组件;--wait-for <css> 等待异步内容。

navigate_page 需要 URL,因此请先解析:

  • 如果是 URL:直接使用。
  • 如果是目标名称或留空:读取 accesslint.config.json(以及被 git 忽略的 accesslint.config.local.json 覆盖文件),将名称(或 default)解析为对应的 url;同时获取其 waitFor 和 selector。
  • 如果没有配置:询问 URL,或建议运行 npx @accesslint/cli init。

然后导航到该 URL,并在测试前等待闸门条件(如果提供了 --wait-for,则使用它;否则使用目标的 waitFor)。

高效操作

一次快照,然后按范围读取。 等待闸门条件后获取一份完整快照;以此为依据判断结构、名称、角色、状态和 N/A 项。状态改变后,不要再次获取整页快照——只通过 evaluate_script 限定读取发生变化的组件(或获取该子树的快照)。每次交互都重新获取整页快照,是本层级中最容易避免、代价也最大的一项开销。

一次性批量遍历键盘焦点。 在单次 evaluate_script 调用中遍历焦点,而不是每停一处就执行一次 press_key/快照循环:计算可通过 Tab 聚焦的元素序列,按顺序对每个元素调用 focus(),并为每一处返回精简 JSON——选择器、角色/名称、document.activeElement 确认结果、:focus 上计算后的 outline/box-shadow、边界框(可顺便确定 2.5.8),以及元素是否位于粘性元素/覆盖层矩形之下(2.4.11)。遍历结果是确定性的 DOM 事实,因此可以引用为 ● 证据。

遍历用于发现候选项;真实按键事件才能确认行为。脚本化的 focus() 不会触发应用的 keydown 处理程序,因此仍需通过 press_key 验证可操作性(Enter/Space/方向键)以及焦点陷阱断言,但只需检查遍历发现的可疑项:复合控件(roving tabindex、aria-activedescendant)、其处理程序可能拦截 Tab/Esc 的元素,以及遍历无法到达的元素。● 级键盘陷阱问题需要在该组件上实际按下 Tab/Esc;无需在页面上的每个组件都这样操作。

高风险模式

对于拖放、富文本编辑器、树视图、数据网格、自定义组合框或菜单、轮播,以及大量使用 toast 或实时区域的 UI,启发式检查并不可靠。指出 APG 模式,验证能够验证的部分(●/◐),其余部分以 ○ 交接,并注明需要执行的辅助技术步骤。引擎规则使用 explain_rule,控件规范使用 APG。

报告

按证据依据对发现进行分组;严重程度标注在行内。在顶部结清清单——分母中的每个 SC 都必须且只能归入一个类别——并保持精简:先列数量,再列裸 SC 编号。按共同原因对未执行的 SC 分组,每组用一个括号短语说明原因,绝不为每个 SC 单独占一行。

报告应把篇幅用于失败项、标记项和交接项。通过项只需在清单中列出 SC 编号,不要逐段叙述“通过了什么”;最多用一句话概括,也不要在建议中重复问题条目已给出的修复方案。

# Manual inspection — <target>  ·  semi-automated tier
Severity: <c> critical · <s> serious · <m> moderate    Basis: ● <v> · ◐ <f> · ○ <h>
Ledger: pass ● <SCs> · fail ● <SCs> · flagged ◐/○ <SCs> · engine-owned <SCs> · N/A <SCs>
        not exercised → undetermined: <SCs (shared reason)> · <SCs (shared reason)>

## ● Verified
- [serious] Keyboard trap in date picker — SC 2.1.2
    where: div.datepicker[role=dialog]   repro: Tab into grid, focus never exits via Tab or Esc
    fix: <mechanical> | NEEDS HUMAN

## ◐ Flagged
- [moderate] Focus indicator may be too faint — SC 2.4.7
    where: button.ghost   evidence: focus-ghost.png; outline = 1px rgba(0,0,0,.2)
    opinion: likely fails 3:1 non-text contrast — confirm visually

## ○ Human-required
- Live-region announcement on add-to-cart — SC 4.1.3
    aria-live="polite" present (●); actual NVDA/JAWS/VoiceOver output unverified
    needs: screen-reader users (blind / low-vision, per Section 508 FPC)
    flow: add-to-cart → toast (exercised above)

每个条目都以选择器和可见文本为依据。只有在 accessibility-scan 的源映射提供时,才添加 file:line (symbol);不要猜测。每个 ○ 条目都是交接:注明所需的功能能力和辅助技术,以及你执行的流程。

说明

  • 无障碍树显示的是机器状态,而不是屏幕阅读器播报的内容。存在 aria-live 并不意味着它会播报。
  • 浏览器缩放不可见;通过 CSS 缩放近似判断的结果为 ◐。
  • 初始快照前等待异步内容加载;之后优先按选择器范围读取,而不是重新获取快照。
  • 组合各层级(对 accessibility-scan 的结果去重,并共用一个浏览器)是 accessibility-audit 的职责。本技能独立运行时,只报告其检查发现的问题,并在清单中说明未检查的内容。

评论

支持 Markdown