@aiyiran/myclaw 1.1.140 → 1.1.141

package/CLAUDE.md

@@ -40,6 +40,31 @@ myclaw/
 
 ---
 
+## 本地开发流程
+
+**关键一步**：进仓库目录，跑一次 `npm link`（一次性）
+
+```bash
+cd /Users/yiran/.openclaw/workspace-yiranclaw/myclaw
+npm link
+```
+
+这会把 npm 包的符号链接指向你的 git 仓库，之后：
+
+- 改了 `assets/`、`server/`、`patches/`、`index.js` 等任何文件
+- 直接跑 `myclaw server` 或 `myclaw patch` —— 会用你改的代码，**无需 publish**
+
+开发流程：
+
+```
+修改代码 → mc server（重启同步） 或 mc patch（注入 control-ui） 
+  → 验证改动生效 → 改对了才 publish.sh --git
+```
+
+**不 npm link 的后果**：改了代码要 publish + mc update 才能在 npm 包里生效，非常麻烦。
+
+---
+
 ## 两个环境（本地 vs 远程）
 
 很多逻辑都在这里分叉，改代码前先确认你在哪个环境：

package/assets/debug-collector.js

@@ -179,6 +179,11 @@ async function closePreviewAndSaveDebugRecord() {
         const result = await saveDebugRecordToServer(recordToSave);
 
         latestDebugRecordResult = result;
+        window.myclawLastDebugRecord = {
+            ...result,
+            workspace: currentWorkspaceContext && currentWorkspaceContext.workspace,
+            entryFile: currentWorkspaceContext && currentWorkspaceContext.entryFile,
+        };
 
         setPreviewState("debug-record-ready");
 

package/assets/myclaw-inject.js

@@ -313,7 +313,340 @@
     } catch (e) {}
   }
 
-  // ═══ 3. Prompt 小助手按钮（实现见 myclaw-iteration.js） ═══
+  // ═══ 3. Debug 按钮 ═══
+
+  function createDebugButton() {
+    var btn = document.createElement("button");
+    btn.id = "myclaw-debug-btn";
+    btn.className = "agent-chat__input-btn";
+    btn.title = "Debug";
+    btn.setAttribute("aria-label", "Debug");
+    btn.innerHTML = [
+      '<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18"',
+      '  viewBox="0 0 24 24" fill="none" stroke="currentColor"',
+      '  stroke-width="2" stroke-linecap="round" stroke-linejoin="round">',
+      '  <path d="m8 2 1.88 1.88"/>',
+      '  <path d="M14.12 3.88 16 2"/>',
+      '  <path d="M9 7.13v-1a3.003 3.003 0 1 1 6 0v1"/>',
+      '  <path d="M12 20c-3.3 0-6-2.7-6-6v-3a4 4 0 0 1 4-4h4a4 4 0 0 1 4 4v3c0 3.3-2.7 6-6 6"/>',
+      '  <path d="M12 20v-9"/>',
+      '  <path d="M6.53 9C4.6 9.43 3 11.3 3 13.5"/>',
+      '  <path d="M20.97 13.5c0-2.2-1.6-4.07-3.53-4.5"/>',
+      '  <path d="M4 19.5c0-2.2 1.8-4 4-4"/>',
+      '  <path d="M20 19.5c0-2.2-1.8-4-4-4"/>',
+      '</svg>',
+    ].join("");
+
+    btn.addEventListener("click", function (e) {
+      e.stopPropagation();
+      showDebugModal();
+    });
+
+    return btn;
+  }
+
+  var debugVoiceDestroyers = [];
+
+  function closeDebugModal() {
+    debugVoiceDestroyers.forEach(function (destroy) {
+      try { destroy(); } catch (e) {}
+    });
+    debugVoiceDestroyers = [];
+    var modal = document.getElementById("myclaw-debug-modal");
+    if (modal) modal.remove();
+  }
+
+  function makeDebugLabel(text) {
+    var label = document.createElement("div");
+    label.textContent = text;
+    label.className = "myclaw-debug-label";
+    return label;
+  }
+
+  function makeDebugVoiceInputField(placeholder, maxLength, onChange) {
+    var wrap = document.createElement("div");
+    wrap.style.cssText = [
+      "display:flex", "gap:8px", "align-items:center",
+      "width:100%", "box-sizing:border-box",
+    ].join(";");
+
+    var input = document.createElement("textarea");
+    input.rows = 3;
+    input.maxLength = maxLength || 180;
+    input.placeholder = placeholder || "";
+    input.spellcheck = false;
+    input.style.cssText = [
+      "flex:1 1 0%", "min-width:0", "padding:9px 12px",
+      "background:#252536",
+      "border:1.5px solid #3d3d5c",
+      "border-radius:8px",
+      "color:#cdd6f4",
+      "font-size:13px",
+      "line-height:1.6",
+      "font-family:-apple-system,sans-serif",
+      "outline:none",
+      "resize:vertical",
+      "transition:border-color 0.15s, border-left-width 0.1s",
+    ].join(";");
+
+    var localVoice = null;
+    var localRecording = false;
+    var localStopping = false;
+
+    input.onfocus = function () { if (!localRecording) input.style.borderColor = "#6366f1"; };
+    input.onblur = function () { if (!localRecording) input.style.borderColor = "#3d3d5c"; };
+    input.oninput = function () { if (onChange) onChange(input.value); };
+
+    var micBtn = document.createElement("button");
+    micBtn.type = "button";
+    micBtn.title = "语音输入";
+    micBtn.style.cssText = [
+      "width:34px", "height:34px", "flex-shrink:0",
+      "border-radius:50%",
+      "border:1.5px solid #3d3d5c",
+      "background:#252536",
+      "color:#888",
+      "cursor:pointer",
+      "display:flex", "align-items:center", "justify-content:center",
+      "transition:all 0.15s",
+      "position:relative",
+    ].join(";");
+    micBtn.innerHTML = [
+      '<svg width="14" height="14" viewBox="0 0 24 24" fill="none"',
+      ' stroke="currentColor" stroke-width="2"',
+      ' stroke-linecap="round" stroke-linejoin="round">',
+      '  <path d="M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z"/>',
+      '  <path d="M19 10v2a7 7 0 0 1-14 0v-2"/>',
+      '  <line x1="12" x2="12" y1="19" y2="22"/>',
+      '</svg>',
+    ].join("");
+
+    function setMicUI(isRecording) {
+      if (isRecording) {
+        micBtn.style.background = "#ff4444";
+        micBtn.style.borderColor = "#ff4444";
+        micBtn.style.color = "#fff";
+        micBtn.title = "停止录音";
+        input.style.borderColor = "#ff4444";
+        input.style.borderLeftWidth = "3px";
+      } else {
+        micBtn.style.background = "#252536";
+        micBtn.style.borderColor = "#3d3d5c";
+        micBtn.style.color = "#888";
+        micBtn.title = "语音输入";
+        input.style.borderColor = "#3d3d5c";
+        input.style.borderLeftWidth = "1.5px";
+      }
+    }
+
+    function initLocalVoice() {
+      if (typeof window.VoiceInput === "undefined") return false;
+      localVoice = new window.VoiceInput({
+        onResult: function (text) {
+          if (!localRecording && !localStopping) return;
+          input.value = String(text || "").slice(0, input.maxLength);
+          if (onChange) onChange(input.value);
+        },
+        onStatusChange: function (oldStatus, newStatus) {
+          if (newStatus === "idle" && localRecording && !localStopping) {
+            setTimeout(function () {
+              if (localRecording && localVoice) localVoice.start();
+            }, 300);
+          }
+        },
+        onError: function (err) {
+          console.error("[myclaw-debug] voice error:", err);
+          localRecording = false;
+          localStopping = false;
+          setMicUI(false);
+        },
+      });
+      return true;
+    }
+
+    function startLocalVoice() {
+      if (!localVoice && !initLocalVoice()) {
+        console.warn("[myclaw-debug] VoiceInput SDK 未加载");
+        return;
+      }
+      localRecording = true;
+      setMicUI(true);
+      localVoice.start();
+    }
+
+    function stopLocalVoice() {
+      if (!localRecording) return;
+      localStopping = true;
+      localRecording = false;
+      setMicUI(false);
+      setTimeout(function () {
+        localStopping = false;
+        if (localVoice) localVoice.stop();
+      }, 1500);
+    }
+
+    micBtn.onclick = function () {
+      if (localRecording) {
+        stopLocalVoice();
+      } else {
+        startLocalVoice();
+      }
+    };
+
+    wrap.appendChild(input);
+    wrap.appendChild(micBtn);
+
+    return {
+      el: wrap,
+      getValue: function () { return input.value; },
+      focus: function () { input.focus(); },
+      destroy: function () { if (localRecording) stopLocalVoice(); },
+    };
+  }
+
+  function showDebugModal() {
+    if (document.getElementById("myclaw-debug-modal")) return;
+
+    var state = { description: "" };
+
+    function buildDebugPrompt() {
+      var rec = window.myclawLastDebugRecord;
+      var lines = [];
+
+      if (rec) {
+        if (rec.debugRecordPath) {
+          lines.push("调试记录文件：" + rec.debugRecordPath);
+        } else if (rec.debugRecordUrl) {
+          lines.push("调试记录：" + rec.debugRecordUrl);
+        } else if (rec.workspace) {
+          lines.push("调试记录：" + rec.workspace + "/debug/debug-record.html");
+        }
+        if (rec.entryFile) {
+          lines.push("正在调试的文件：" + rec.entryFile);
+        }
+        lines.push("");
+      }
+
+      lines.push("学生描述：" + (state.description || "（未填写）"));
+      lines.push("");
+      lines.push("请从学生描述里提取：我做了什么、发生了什么、我的预期是什么。");
+      lines.push("然后先阅读调试记录，再结合源码定位问题，只做最小修复。修复后说明原因和改动位置。");
+
+      return lines.join("\n");
+    }
+
+    var overlay = document.createElement("div");
+    overlay.id = "myclaw-debug-modal";
+
+    var box = document.createElement("div");
+    box.className = "myclaw-debug-box";
+
+    var header = document.createElement("div");
+    header.className = "myclaw-debug-header";
+    header.innerHTML = "<span>🐛 告诉 AI，发生了什么？</span>";
+    var closeX = document.createElement("span");
+    closeX.textContent = "✕";
+    closeX.className = "myclaw-debug-close";
+    closeX.onclick = function () { closeDebugModal(); };
+    header.appendChild(closeX);
+
+    var scroll = document.createElement("div");
+    scroll.className = "myclaw-debug-scroll";
+
+    var guide = document.createElement("div");
+    guide.className = "myclaw-debug-guide";
+    ["我做了什么", "发生了什么", "我的预期是什么"].forEach(function (text) {
+      var item = document.createElement("span");
+      item.textContent = text;
+      guide.appendChild(item);
+    });
+
+    var inputSection = document.createElement("div");
+    inputSection.appendChild(makeDebugLabel("用一句话说清楚"));
+    var descriptionField = makeDebugVoiceInputField("比如：我点了开始按钮，页面没有反应，我希望角色开始移动", 180, function (val) {
+      state.description = val;
+      refresh();
+    });
+    inputSection.appendChild(descriptionField.el);
+    debugVoiceDestroyers.push(descriptionField.destroy);
+
+    var previewWrap = document.createElement("div");
+    previewWrap.className = "myclaw-debug-preview";
+    var previewLabel = document.createElement("div");
+    previewLabel.className = "myclaw-debug-preview-label";
+    previewLabel.textContent = "将要发给 AI 的内容：";
+    var previewEl = document.createElement("div");
+    previewEl.className = "myclaw-debug-preview-text";
+    previewWrap.appendChild(previewLabel);
+    previewWrap.appendChild(previewEl);
+
+    scroll.appendChild(guide);
+    scroll.appendChild(inputSection);
+    scroll.appendChild(previewWrap);
+
+    var footer = document.createElement("div");
+    footer.className = "myclaw-debug-footer";
+
+    var cancelBtn = document.createElement("button");
+    cancelBtn.className = "myclaw-debug-cancel";
+    cancelBtn.textContent = "取消";
+    cancelBtn.addEventListener("click", function () {
+      closeDebugModal();
+    });
+
+    var insertBtn = document.createElement("button");
+    insertBtn.className = "myclaw-debug-insert";
+    insertBtn.textContent = "⬇ 先放到聊天框";
+    insertBtn.addEventListener("click", function () {
+      if (!hasDebugInput()) return;
+      setTextareaValue(buildDebugPrompt());
+      closeDebugModal();
+    });
+
+    var submitBtn = document.createElement("button");
+    submitBtn.className = "myclaw-debug-submit";
+    submitBtn.textContent = "➤ 直接发给 AI";
+    submitBtn.addEventListener("click", function () {
+      if (!hasDebugInput()) return;
+      setTextareaValue(buildDebugPrompt());
+      closeDebugModal();
+      trySend();
+    });
+
+    function hasDebugInput() {
+      return !!state.description.trim();
+    }
+
+    function refresh() {
+      var ready = hasDebugInput();
+      previewEl.textContent = ready ? buildDebugPrompt() : "先写一项，这里会自动整理成要发给 AI 的内容。";
+      previewEl.style.color = ready ? "#cdd6f4" : "#555";
+      submitBtn.disabled = !ready;
+      insertBtn.disabled = !ready;
+      submitBtn.style.opacity = ready ? "1" : "0.4";
+      insertBtn.style.opacity = ready ? "1" : "0.4";
+      submitBtn.style.cursor = ready ? "pointer" : "not-allowed";
+      insertBtn.style.cursor = ready ? "pointer" : "not-allowed";
+    }
+
+    footer.appendChild(cancelBtn);
+    footer.appendChild(insertBtn);
+    footer.appendChild(submitBtn);
+    box.appendChild(header);
+    box.appendChild(scroll);
+    box.appendChild(footer);
+    overlay.appendChild(box);
+    document.body.appendChild(overlay);
+
+    overlay.addEventListener("click", function (e) {
+      if (e.target === overlay) closeDebugModal();
+    });
+
+    refresh();
+    descriptionField.focus();
+  }
+
+  // ═══ 3.1 Prompt 小助手按钮（实现见 myclaw-iteration.js） ═══
 
   function createPromptButton() {
     return window.myclawIteration.createButton();
@@ -514,26 +847,31 @@ btn.addEventListener("click", function () {
 
   function injectButton() {
     var toolbar = document.querySelector(".agent-chat__toolbar-left");
-    if (!toolbar || document.querySelector("#myclaw-voice-btn")) return;
+    if (!toolbar) return;
+    if (
+      toolbar.querySelector("#myclaw-debug-btn") &&
+      toolbar.querySelector("#myclaw-prompt-btn") &&
+      toolbar.querySelector("#myclaw-voice-btn")
+    ) {
+      injected = true;
+      return;
+    }
 
     if (window.myclawIteration) {
       window.myclawIteration.init({ trySend: trySend });
     }
 
-    var voiceBtn = createVoiceButton();
-    var promptBtn = createPromptButton();
+    var debugBtn = document.querySelector("#myclaw-debug-btn") || createDebugButton();
+    var promptBtn = document.querySelector("#myclaw-prompt-btn") || createPromptButton();
+    var voiceBtn = document.querySelector("#myclaw-voice-btn") || createVoiceButton();
 
-    // 插入到工具栏最前面：prompt 按钮在最左，语音按钮紧跟其右
-    if (toolbar.firstChild) {
-      toolbar.insertBefore(voiceBtn, toolbar.firstChild);
-      toolbar.insertBefore(promptBtn, voiceBtn);
-    } else {
-      toolbar.appendChild(promptBtn);
-      toolbar.appendChild(voiceBtn);
-    }
+    // 插入到工具栏最前面：debug 按钮在最左，prompt 和语音按钮依次靠右
+    toolbar.insertBefore(voiceBtn, toolbar.firstChild);
+    toolbar.insertBefore(promptBtn, voiceBtn);
+    toolbar.insertBefore(debugBtn, promptBtn);
 
     injected = true;
-    console.log("[myclaw-inject] \u2705 \u8bed\u97f3\u6309\u94ae + prompt\u6309\u94ae\u5df2\u6ce8\u5165");
+    console.log("[myclaw-inject] \u2705 debug\u6309\u94ae + \u8bed\u97f3\u6309\u94ae + prompt\u6309\u94ae\u5df2\u6ce8\u5165");
   }
 
   // ═══ 注入录音态样式 ═══
@@ -602,6 +940,45 @@ btn.addEventListener("click", function () {
       "  from { opacity: 0; }",
       "  to { opacity: 1; }",
       "}",
+      /* Debug 提交弹框 */
+      "#myclaw-debug-modal {",
+      "  position: fixed; inset: 0; z-index: 99999;",
+      "  background: rgba(0,0,0,0.45);",
+      "  display: flex; align-items: center; justify-content: center;",
+      "  animation: myclaw-fade-in 0.15s ease;",
+      "}",
+      ".myclaw-debug-box {",
+      "  background: #fff; border-radius: 16px;",
+      "  padding: 24px 28px 20px; width: 420px; max-width: 92vw;",
+      "  box-shadow: 0 8px 32px rgba(0,0,0,0.18);",
+      "  display: flex; flex-direction: column; gap: 12px;",
+      "}",
+      ".myclaw-debug-title {",
+      "  font-size: 18px; font-weight: 700; color: #222;",
+      "}",
+      ".myclaw-debug-hint {",
+      "  font-size: 13px; color: #888;",
+      "}",
+      ".myclaw-debug-textarea {",
+      "  width: 100%; box-sizing: border-box;",
+      "  border: 1.5px solid #e0e0e0; border-radius: 10px;",
+      "  padding: 12px; font-size: 14px; line-height: 1.7;",
+      "  resize: vertical; outline: none; font-family: inherit; color: #333;",
+      "}",
+      ".myclaw-debug-textarea:focus { border-color: #4f6ef7; }",
+      ".myclaw-debug-footer {",
+      "  display: flex; justify-content: flex-end; gap: 10px;",
+      "}",
+      ".myclaw-debug-cancel {",
+      "  padding: 8px 18px; border-radius: 8px; border: 1.5px solid #e0e0e0;",
+      "  background: #fff; color: #666; font-size: 14px; cursor: pointer;",
+      "}",
+      ".myclaw-debug-submit {",
+      "  padding: 8px 20px; border-radius: 8px; border: none;",
+      "  background: #4f6ef7; color: #fff; font-size: 14px;",
+      "  font-weight: 600; cursor: pointer;",
+      "}",
+      ".myclaw-debug-submit:hover { background: #3a58d6; }",
     ].join("\n");
     document.head.appendChild(style);
   }
@@ -1795,7 +2172,11 @@ btn.addEventListener("click", function () {
 
     // 持续监听 DOM 变化，确保按钮始终在
     new MutationObserver(function () {
-      if (!document.querySelector("#myclaw-voice-btn")) {
+      if (
+        !document.querySelector("#myclaw-debug-btn") ||
+        !document.querySelector("#myclaw-prompt-btn") ||
+        !document.querySelector("#myclaw-voice-btn")
+      ) {
         injected = false;
       }
       if (!injected) {

package/index.js

@@ -1986,16 +1986,21 @@ function runSync(workspaceName) {
 
   // 用户目录下的服务目录
   const targetDir = path.join(os.homedir(), '.openclaw', 'myclaw', 'server');
+  const targetAssetsDir = path.join(os.homedir(), '.openclaw', 'myclaw', 'assets');
   const targetPyPath = path.join(targetDir, 'sync_workspace.py');
   const targetConfigPath = path.join(targetDir, 'config.json');
   const sourcePyPath = path.join(__dirname, 'server', 'sync_workspace.py');
   const sourceSchemaPath = path.join(__dirname, 'server', 'artifacts_schema.py');
   const sourceDebugRecordPath = path.join(__dirname, 'server', 'debug_record.py');
+  const sourceProbeJsPath = path.join(__dirname, 'assets', 'debug-probe.js');
 
   // 确保目标目录存在
   if (!fs.existsSync(targetDir)) {
     fs.mkdirSync(targetDir, { recursive: true });
   }
+  if (!fs.existsSync(targetAssetsDir)) {
+    fs.mkdirSync(targetAssetsDir, { recursive: true });
+  }
 
   // 同步 py 文件
   fs.copyFileSync(sourcePyPath, targetPyPath);
@@ -2003,6 +2008,10 @@ function runSync(workspaceName) {
   if (fs.existsSync(sourceDebugRecordPath)) {
     fs.copyFileSync(sourceDebugRecordPath, path.join(targetDir, 'debug_record.py'));
   }
+  // probe 源码：sync_workspace.py 注入 HTML 时需要读取它
+  if (fs.existsSync(sourceProbeJsPath)) {
+    fs.copyFileSync(sourceProbeJsPath, path.join(targetAssetsDir, 'debug-probe.js'));
+  }
 
   // 读取配置（如果不存在则创建）
   let config;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aiyiran/myclaw",
-  "version": "1.1.140",
+  "version": "1.1.141",
   "description": "",
   "main": "index.js",
   "bin": {