长页面截图
将以下提示词粘贴到你的 AI 对话框中:
请根据 https://skillhub.cn/install/skillhub.md,安装 @user_1d9d65e1/xxdxy。
技能介绍
问题
在对话中查看网页、UI 状态或已配对设备时,文字快照只能描述结构,无法直接展示布局、颜色、图表和报错位置。工程师或用户在说“截个图”“看看这个网页”时,需要一种把截图作为聊天媒体交付的能力,并且要覆盖浏览器整页、指定元素和设备屏幕。
工作方式
该技能把截图结果转成可嵌入回复的图片,而不是只返回路径。
- 浏览器截图:使用
browser的open打开目标 URL,等待页面加载后调用screenshot。 - 整页与局部:
fullPage用于截取完整页面;selector按 CSS 选择器截取某个区域;maxWidth可控制输出宽度。 - 设备屏幕:先用
nodes status检查节点,再用nodes camera_snap或nodes screen_record获取结果。 - 交付格式:回复中单独一行写
MEDIA:,系统会把图片内联显示在对话中。
适用边界
截图前应确认页面已加载完成,可用 snapshot 检查。涉及密码、个人信息等敏感页面时,需要提醒用户。若截图失败,可降级为 snapshot 的文字版页面快照。它适合快速核对网页 UI、分享局部截图和查看设备状态,不适合作为完整录屏分析或无视觉结果的自动化验证。
使用场景
- 排查前端样式异常时,截取完整网页并回传图片给协作同事
- 用选择器截取报错模块,方便在对话中定位 UI 细节
- 检查已配对节点状态,用节点截屏工具回传设备画面
- 页面过长时分段截取关键区域,并用快照降级确认内容
适合人员
- 需要核对网页样式、图表和报错位置的前端工程师
- 要在对话里快速确认远程节点桌面状态的运维支持
- 需要截取长页面关键模块给协作同事复核的产品经理
- 需要把设备屏幕或浏览器界面作为图片证据留存的测试工程师