Cypress无障碍测试高级解决方案
检查违规详情
从运行级别报告导航到特定视图规则后，您将进入违规详情视图。
该页面分为两个主要部分：规则和快照。
规则
详情视图左侧列出了符合当前视图筛选条件的所有规则。如果未选择特定视图，则该列表适用于运行中的所有视图。
规则详情
每个规则可展开显示相关元素和附加信息：
- 描述：解释规则的文本，包括其来源、影响的用户体验以及如何修复问题。
- 了解更多：指向Deque University的链接，提供深入指导。
元素详情
点击展开规则部分中的元素可提供：
- 固定元素：在UI中高亮显示该元素以便识别。
- 复制选择器：复制唯一标识元素的CSS选择器的按钮。
- 打印到控制台：将元素引用记录到浏览器控制台进行调试。在基于Chrome的浏览器中，可右键点击记录的元素并选择"在元素面板中显示"直接导航到实时DOM。
- 分享问题：复制markdown或纯文本片段以与团队或协作者分享问题的按钮。
- 解决方案：解决问题的潜在方案列表。
快照
快照是测试期间应用程序状态的完整HTML和CSS表示。与截图或视频不同，这些快照允许您：
- 无需本地运行应用程序即可检查DOM和无障碍树。
- 理解每个违规的上下文并直接从快照调试。
该区域还提供"测试回放"按钮，可访问出现此快照的任何测试，以及屏幕底部显示的特定快照URL。
您还可以循环查看所有可用快照以了解应用程序捕获的所有状态，但这通常不是必需的。应将快照视为与屏幕左侧列出的元素相关的示例和证据。浏览报告最有用的方式就是如此。