| name | sd-panel |
| description | Seedance 浏览器面板连接 — Chrome DevTools MCP 连接、元素定位、工具可用性检测。由 seedance-storyboard 主 skill 调用。 |
| metadata | {"version":"1.1.1","last_updated":"2026-07-16","author":"Takis","repository":"https://github.com/oijhl852/seedance-storyboard"} |
sd-panel — 面板连接
作者：Takis | 仓库：seedance-storyboard
管理 Seedance 网页面板的浏览器连接和元素定位。
前置条件
- Chrome DevTools MCP 已配置
- Chrome 以
--remote-debugging-port=9222 运行
- Seedance 面板已打开
缺少任一条件时停止，不要尝试猜测页面地址、选择器或凭证。
工作流程
1. 连接面板
mcp__chrome-devtools__list_pages → 找到 Seedance 面板 URL
mcp__chrome-devtools__select_page → 选中面板
mcp__chrome-devtools__take_snapshot → 读取当前状态
2. 检测视频状态
| 状态 | 特征 |
|---|
| 🟡 生成中 | div.el-loading-mask 包含 task ID |
| 🟢 已完成 | <video class="vjs-tech"> 存在 |
3. 工具可用性
| 页面状态 | 可用工具 | 不可用工具 |
|---|
| 有视频播放 | press_key / type_text / navigate_page / take_snapshot | click / fill / evaluate_script / hover |
| 刚reload | 全部可用（黄金窗口约10秒） | |
有视频时先 reload 再操作。
不要把“黄金窗口约10秒”当成固定计时。reload 后先重新 snapshot，确认目标元素存在且页面不再加载，再执行下一步。
4. 切换集（Episode）
1. click 第一个 input[readonly] (value="第X集")
2. click li.el-select-dropdown__item 匹配 "第N集"
3. 页面自动以新 part_no 重新加载
5. 切换片段（Segment）
function switchToSegment(n) {
const nodes = document.querySelectorAll('.timeline-node');
for (const node of nodes) {
const orderEl = node.querySelector('.card-order');
if (orderEl && orderEl.textContent.trim() === String(n)) {
const img = node.querySelector('img.img');
if (img) { img.click(); return true; }
}
}
return false;
}
⚠️ 使用 card-order 文字匹配，不使用图片索引。
6. 修改面板参数
所有 el-select 下拉参数（画幅/分辨率/时长/模型）：
1. click 下拉框 (readonly value="当前值")
2. take_snapshot 看选项
3. click 目标选项
分辨率、时长和模型可能影响费用或生成结果。修改前先展示旧值和新值，得到用户确认后再点击。
7. 建立新的空白片段
修改已有工程时，默认不点击已有片段进行覆盖。标准流程是：
- 在面板中点击“+”建立新的空白片段。
- 重新 snapshot，确认新片段没有已有内容并记录它的序号。
- 将新提示词和已验证的 chip 注入这个空白片段。
- 只有用户明确要求覆盖原片段时，才进入覆盖确认流程。
如果面板没有“+”或无法确认新片段为空，停止操作并请用户手动建立空白片段。
失败处理
- 找不到目标页面：列出当前页面标题和地址，请用户打开正确面板。
- 找不到选择器：重新 snapshot；仍不存在时停止，不使用相似元素代替。
- 工具超时：按“reload → snapshot → 键盘导航”顺序降级，不能连续重复点击。
- 页面重新渲染后 UID 失效：重新 snapshot 获取新 UID，不复用旧 UID。
🔄 更新
仓库：https://github.com/oijhl852/seedance-storyboard
