SuperAPI AI 工具集

vscode-playwright

测试与质量

查看项目

更新于 10-16 06:47

技能介绍

用途:捕获高质量 VS Code 编辑器视图、代码走查与 Copilot Chat 示例截图,用于幻灯片、文档等视觉素材;并将自包含 HTML 动画录制成无声 WebM 片段。

主要能力:脚本化路径 scripts/capture_vscode.py 依据 YAML 计划无头运行 serve-web,在 Monaco 打开文件、测量渲染字体并逐项截图,全程无需 MCP,可在 CI 运行;每项截图通过输出末行 JSON 报告 rendered_font_size_pt、zoom 与 source_resolution,并非 0 退出表示全部达标。动画录制路径 scripts/record_browser_video.py 在场景 body 设置 data-animation-ready="true" 并定义 window.startAnimation() 后开始录制,浏览器上下文离线、阻断 Service Worker、拦截 WebSocket、关闭弹窗,仅从受批资产根提供文件,默认 24 fps、结合虚拟场景时间采样并用 FFmpeg 编码,输出无声片段,可与旁白 WAV 配对。

必要用法:脚本化截图先执行 uv sync、uv run playwright install --with-deps chromium,再运行 uv run python scripts/capture_vscode.py --plan capture-plan.yml --workspace /path/to/repo。录制使用 uv run python scripts/record_browser_video.py --scene animation/scene-001/index.html --output clips/scene-001.webm --duration 8 --resolution 1920x1080。交互式截图需真实 Playwright MCP 浏览器工具与 curl,工具前缀由宿主注册名决定(示例为 mcp_microsoft_pla_browser_*,实际可能不同)。

限制:脚本化截图需要 code 或 code-insiders CLI;录制需要 uv、Playwright 1.48 及以上、Chromium 与支持 libvpx-vp9 的 FFmpeg,不需要 VS Code 或 MCP。用户设置存于浏览器 IndexedDB,无法通过写入磁盘 settings.json 预置;Markdown 打开为跨源预览 webview,无法测量其中文本,应改捕代码或配置文件;截图默认字体缩放后可能过小,需提高 CSS zoom 并重新测量;视口比例需与目标占位符匹配。具体收费、价格与更多平台支持暂未提供。