用途:Dark Mode Bug Finder 是一个深色模式专项 QA 技能,用于查找主题相关的渲染缺陷,覆盖对比度失败、主题 token 缺失、图片反转、过渡故障等问题。
主要能力:核心理念要求所有颜色来自主题 token、遵循 WCAG 对比度(普通文本 4.5:1,大字 3:1)、主题切换无 FOUC、同步系统 prefers-color-scheme、图片与媒体可适配、阴影边框具备主题感知、第三方组件参与主题。技能给出目录结构建议(tests/dark-mode 下放置 contrast-validation、css-variable-audit、hardcoded-colors、theme-transitions、system-preference-sync、image-adaptation、component-coverage、focus-indicators 等 spec 文件,以及 fixtures、helpers、reports)。
使用方式:基于 Playwright 编写测试。提供颜色工具库函数 parseColor、relativeLuminance、contrastRatio、checkContrast、isLightColor、isDarkColor;主题辅助函数 getActiveColorScheme、setThemeViaMediaQuery、toggleThemeViaUI、getCurrentThemeColors。可运行对比度验证、占位符与输入框可见性检查、CSS 变量覆盖审计等测试,输出报告为 JSON/HTML。
适用场景:前端团队在深色模式发布前做视觉可访问性验证;排查硬编码颜色、变量未定义、切换闪烁、系统主题不同步、图片图标在深色背景下不可见等问题。
限制:资料未提供安装命令、依赖版本、具体运行方式、支持的平台范围、价格或收费信息,这些暂未提供。示例代码依赖 Playwright 与 CSSOM 读取,跨域样式表无法读取属于已知限制。