v14.0-F: 登录UI移入设置菜单+删顶部横条+retainContextWhenHidden+TRAE修复

Author: zcj220

extension/src/extension.ts

@@ -26,7 +26,9 @@ export function activate(context: vscode.ExtensionContext): void {
   // 注册侧边栏
   const sidebarProvider = new SidebarProvider(context.extensionUri, client, context);
   context.subscriptions.push(
-    vscode.window.registerWebviewViewProvider(SidebarProvider.viewType, sidebarProvider),
+    vscode.window.registerWebviewViewProvider(SidebarProvider.viewType, sidebarProvider, {
+      webviewOptions: { retainContextWhenHidden: true },
+    }),
   );
 
   // 尝试连接 WebSocket

extension/src/sidebarProvider.ts

@@ -117,6 +117,11 @@ export class SidebarProvider implements vscode.WebviewViewProvider {
         case "getSuggestions":
           await this._handleGetSuggestions(msg);
           break;
+        case "openExternal":
+          if (msg.url && typeof msg.url === 'string' && msg.url.startsWith('https://')) {
+            vscode.env.openExternal(vscode.Uri.parse(msg.url));
+          }
+          break;
       }
     });
 
@@ -1624,73 +1629,42 @@ ${commonRules}`;
     .step-num { color: var(--info); min-width: 20px; }
     .step-desc { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
     .step-time { color: var(--info); font-size: 10px; min-width: 36px; text-align: right; }
-    /* 认证面板 */
-    .auth-panel {
-      padding: 16px 12px;
-    }
-    .auth-panel h2 {
-      font-size: 15px; margin: 0 0 12px; text-align: center;
+    /* 设置菜单内登录子面板 */
+    .sdrop-auth-panel {
+      display: none; padding: 8px 12px;
+      border-top: 1px solid var(--input-border);
     }
-    .auth-panel .auth-input {
+    .sdrop-auth-panel input {
       width: 100%; box-sizing: border-box;
-      padding: 7px 10px; margin-bottom: 8px;
+      padding: 5px 7px; margin-bottom: 5px;
       background: var(--input-bg); color: var(--input-fg);
-      border: 1px solid var(--input-border); border-radius: 4px;
-      font-size: 13px; outline: none;
+      border: 1px solid var(--input-border); border-radius: 3px;
+      font-size: 11px; outline: none;
     }
-    .auth-panel .auth-input:focus { border-color: var(--btn-bg); }
-    .auth-panel .auth-btn {
-      width: 100%; padding: 8px; margin-top: 4px;
+    .sdrop-auth-panel input:focus { border-color: var(--btn-bg); }
+    .sdrop-login-btn {
+      flex: 1; padding: 5px; font-size: 11px; font-weight: 600;
       background: var(--btn-bg); color: var(--btn-fg);
-      border: none; border-radius: 4px; cursor: pointer;
-      font-size: 13px; font-weight: 600;
-    }
-    .auth-panel .auth-btn:hover { background: var(--btn-hover); }
-    .auth-panel .auth-toggle {
-      display: block; text-align: center; margin-top: 12px;
-      font-size: 12px; color: var(--btn-bg); cursor: pointer;
-      text-decoration: underline; background: none; border: none;
-    }
-    .auth-panel .auth-error {
-      color: var(--error); font-size: 12px; margin: 6px 0; text-align: center;
-      display: none;
-    }
-    .auth-user-bar {
-      display: flex; align-items: center; justify-content: space-between;
-      padding: 6px 12px; font-size: 12px;
-      border-bottom: 1px solid var(--input-border);
+      border: none; border-radius: 3px; cursor: pointer;
+    }
+    .sdrop-login-btn:hover { background: var(--btn-hover); }
+    .sdrop-register-btn {
+      padding: 5px 8px; font-size: 11px;
+      background: none; color: var(--btn-bg);
+      border: 1px solid var(--btn-bg); border-radius: 3px; cursor: pointer;
     }
-    .auth-user-bar .username { color: var(--success); font-weight: 600; }
-    .auth-user-bar .logout-btn {
-      background: none; border: none; color: var(--muted);
-      cursor: pointer; font-size: 11px; text-decoration: underline;
+    .sdrop-register-btn:hover { background: var(--btn-bg); color: var(--btn-fg); }
+    .auth-error {
+      color: var(--error); font-size: 11px; margin: 0 0 5px; display: none;
+    }
+    .sdrop-user-row {
+      padding: 6px 12px; font-size: 11px;
+      border-top: 1px solid var(--input-border);
     }
-    .auth-user-bar .logout-btn:hover { color: var(--error); }
   </style>
 </head>
 <body>
-  <!-- 认证：已登录用户栏 -->
-  <div id="authUserBar" class="auth-user-bar" style="display:none">
-    <span>👤 <span class="username" id="authUsername"></span>
-      <span style="color:var(--muted);font-size:11px" id="authPlan"></span></span>
-    <span id="authCredits" style="font-size:11px;color:var(--muted);margin-left:4px"></span>
-    <button class="logout-btn" onclick="doLogout()">退出登录</button>
-  </div>
-  <!-- 认证：登录/注册面板 -->
-  <div id="authPanel" class="auth-panel" style="display:none">
-    <h2 id="authTitle">登录 TestPilot AI</h2>
-    <div id="authError" class="auth-error"></div>
-    <input id="authEmail" class="auth-input" type="text"
-      placeholder="邮箱" style="display:none" />
-    <input id="authUser" class="auth-input" type="text"
-      placeholder="用户名或邮箱" />
-    <input id="authPass" class="auth-input" type="password"
-      placeholder="密码" onkeydown="if(event.key==='Enter')doAuth()" />
-    <button class="auth-btn" onclick="doAuth()">登录</button>
-    <button class="auth-toggle" onclick="toggleAuthMode()">
-      没有账号？注册
-    </button>
-  </div>
+
   <!-- 引擎状态 -->
   <div class="section">
     <!-- 标题行：引擎字 + 齿轮设置按钮（随页面滚动） -->
@@ -1720,9 +1694,27 @@ ${commonRules}`;
             <span>🔤 字体大小</span>
             <span class="badge-soon">即将推出</span>
           </div>
-          <div class="sdrop-item disabled">
-            <span>🔑 账户登录</span>
-            <span class="badge-soon">即将推出</span>
+          <div class="sdrop-divider"></div>
+          <div class="sdrop-item" id="settingsAuthRow" onclick="toggleSettingsAuth()">
+            <span id="settingsAuthLabel">🔑 账户登录</span>
+            <span id="settingsAuthArrow" style="font-size:10px;color:var(--muted)">▾</span>
+          </div>
+          <div id="settingsAuthPanel" class="sdrop-auth-panel">
+            <div id="authError" class="auth-error"></div>
+            <input id="authUser" type="text" placeholder="用户名或邮箱" autocomplete="username" />
+            <input id="authPass" type="password" placeholder="密码" autocomplete="current-password" onkeydown="if(event.key==='Enter')doAuth()" />
+            <div style="display:flex;gap:6px;margin-top:4px">
+              <button class="sdrop-login-btn" onclick="doAuth()">登录</button>
+              <button class="sdrop-register-btn" onclick="openRegister()">前往注册 ↗</button>
+            </div>
+          </div>
+          <div id="settingsUserRow" class="sdrop-user-row" style="display:none">
+            <div style="display:flex;align-items:center;justify-content:space-between">
+              <span style="color:var(--success);font-weight:600">👤 <span id="authUsername"></span>
+                <span style="color:var(--muted)" id="authPlan"></span></span>
+              <button onclick="doLogout()" style="background:none;border:none;color:var(--muted);cursor:pointer;font-size:11px;text-decoration:underline">退出</button>
+            </div>
+            <div id="authCredits" style="font-size:11px;color:var(--muted);margin-top:2px"></div>
           </div>
         </div>
       </div>
@@ -1928,80 +1920,65 @@ ${commonRules}`;
   <script nonce="${nonce}">
     const vscode = acquireVsCodeApi();
 
-    // ── 认证逻辑 ──────────────────────────────
-    let authMode = 'login'; // 'login' | 'register'
-    const authPanel = document.getElementById('authPanel');
-    const authUserBar = document.getElementById('authUserBar');
-    const authTitle = document.getElementById('authTitle');
-    const authEmail = document.getElementById('authEmail');
+    // ── 认证逻辑（登录UI位于设置菜单内） ──────────────────────────────
     const authUser = document.getElementById('authUser');
     const authPass = document.getElementById('authPass');
     const authError = document.getElementById('authError');
     const authUsername = document.getElementById('authUsername');
     const authPlan = document.getElementById('authPlan');
 
     function showAuthError(msg) {
-      authError.textContent = msg;
-      authError.style.display = msg ? 'block' : 'none';
-    }
-
-    function toggleAuthMode() {
-      authMode = authMode === 'login' ? 'register' : 'login';
-      if (authMode === 'register') {
-        authTitle.textContent = '注册 TestPilot AI';
-        authEmail.style.display = 'block';
-        authEmail.placeholder = '邮箱';
-        authUser.placeholder = '用户名';
-        document.querySelector('.auth-btn').textContent = '注册';
-        document.querySelector('.auth-toggle').textContent = '已有账号？登录';
-      } else {
-        authTitle.textContent = '登录 TestPilot AI';
-        authEmail.style.display = 'none';
-        authUser.placeholder = '用户名或邮箱';
-        document.querySelector('.auth-btn').textContent = '登录';
-        document.querySelector('.auth-toggle').textContent = '没有账号？注册';
-      }
-      showAuthError('');
+      if (authError) { authError.textContent = msg; authError.style.display = msg ? 'block' : 'none'; }
+    }
+
+    function toggleSettingsAuth() {
+      const panel = document.getElementById('settingsAuthPanel');
+      const arrow = document.getElementById('settingsAuthArrow');
+      const open = panel && panel.style.display === 'block';
+      if (panel) panel.style.display = open ? 'none' : 'block';
+      if (arrow) arrow.textContent = open ? '▾' : '▴';
+      if (!open) setTimeout(() => authUser && authUser.focus(), 50);
+    }
+
+    function openRegister() {
+      vscode.postMessage({ command: 'openExternal', url: 'https://testpilotai.pages.dev/register' });
     }
 
     function doAuth() {
       showAuthError('');
-      if (authMode === 'login') {
-        const u = authUser.value.trim();
-        const p = authPass.value;
-        if (!u || !p) { showAuthError('请填写用户名和密码'); return; }
-        vscode.postMessage({ command: 'login', emailOrUsername: u, password: p });
-      } else {
-        const e = authEmail.value.trim();
-        const u = authUser.value.trim();
-        const p = authPass.value;
-        if (!e || !u || !p) { showAuthError('请填写所有字段'); return; }
-        if (p.length < 6) { showAuthError('密码至少6位'); return; }
-        vscode.postMessage({ command: 'register', email: e, username: u, password: p });
-      }
+      const u = authUser.value.trim();
+      const p = authPass.value;
+      if (!u || !p) { showAuthError('请填写用户名和密码'); return; }
+      vscode.postMessage({ command: 'login', emailOrUsername: u, password: p });
     }
 
     function doLogout() {
       vscode.postMessage({ command: 'logout' });
     }
 
     function setAuthState(loggedIn, user) {
+      const authPanel = document.getElementById('settingsAuthPanel');
+      const userRow = document.getElementById('settingsUserRow');
+      const authLabel = document.getElementById('settingsAuthLabel');
+      const authArrow = document.getElementById('settingsAuthArrow');
       if (loggedIn && user) {
-        authPanel.style.display = 'none';
-        authUserBar.style.display = 'flex';
-        authUsername.textContent = user.username || '';
-        authPlan.textContent = user.plan ? '(' + user.plan + ')' : '';
-        // 积分显示
+        if (authPanel) authPanel.style.display = 'none';
+        if (userRow) userRow.style.display = 'block';
+        if (authLabel) authLabel.textContent = '👤 ' + (user.username || '');
+        if (authArrow) authArrow.style.display = 'none';
+        if (authUsername) authUsername.textContent = user.username || '';
+        if (authPlan) authPlan.textContent = user.plan ? '(' + user.plan + ')' : '';
         const creditsEl = document.getElementById('authCredits');
         if (creditsEl && user.credits !== undefined) {
           const low = user.credits < 10;
           creditsEl.textContent = '💰 ' + user.credits + '分';
           creditsEl.style.color = low ? 'var(--error)' : 'var(--muted)';
-          creditsEl.title = '剩余积分：' + user.credits + '（每10步消耗 1 积分）';
         }
       } else {
-        authPanel.style.display = 'block';
-        authUserBar.style.display = 'none';
+        if (authPanel) authPanel.style.display = 'none';
+        if (userRow) userRow.style.display = 'none';
+        if (authLabel) authLabel.textContent = '🔑 账户登录';
+        if (authArrow) { authArrow.textContent = '▾'; authArrow.style.display = ''; }
       }
     }
 

开发备忘录.md

@@ -1,11 +1,11 @@
 # TestPilot AI 开发备忘录
 
-> 最后更新：2026-03-24（✅ v14.0-A/B/C 完成：MySQL RDS + Plugin 登录 + 云端分享）
+> 最后更新：2026-03-25（✅ v14.0-F 完成：登录UI迷你横条 + TRAE双版本冲突修复 + retainContextWhenHidden）
 > 项目结构详见 README.md，此处不重复。
 
 ---
 
-## v14.0 进度总结（2026-03-24）
+## v14.0 进度总结（2026-03-25）
 
 ### ✅ v14.0-A MySQL 云数据库完成
 - **Alibaba Cloud RDS MySQL 8.0.36** 配置完毕
@@ -27,8 +27,15 @@
 - 社区 tab 整合分享表单 + 建议展示
 - 流程：测试完成(固Bug) → 自动弹窗 → 用户确认 → 云端上传 + 展示社区建议
 
-### ⏳ v14.0-D 积分系统（已完成）
-### ⏳ v14.0-E 安全增强（已完成）
+### ✅ v14.0-D 积分系统（已完成）
+### ✅ v14.0-E 安全增强（已完成）
+
+### ✅ v14.0-F 登录UI升级 + TRAE修复（2026-03-25）
+- **登录UI改为迷你横条**：删除大面板 `.auth-panel`，改为单行状态条 `.auth-mini-bar` + 折叠下拉表单 `.auth-login-dropdown`
+- **注册改为跳官网**：点击「前往注册」→ `openExternal` 打开 `https://testpilotai.pages.dev/register`，不再内嵌注册表单
+- **修复引擎未连接日志反复打印**：`extension.ts` 新增 `retainContextWhenHidden: true`，防止 WebView 被销毁/重建导致 `hasLoggedDisconnected` 变量重置
+- **修复 TRAE 显示旧版**：TRAE 扩展目录中存在两个版本（`testpilot-ai.testpilot-ai-1.2.9` 旧 publisher + `wenzhouxinzao.testpilot-ai-1.3.0`），将旧版目录 rename 为 `.bak`，安装新版
+- **服务器 alembic 分支冲突修复**：`stamp f03fbc681fc5` 跳过重复建表，再 `upgrade 3f8a9b2c1d47` 建 3 个安全表（login_attempts/refresh_tokens/email_verifications）
 
 ---
 
@@ -61,22 +68,40 @@ cp .env.example .env   # 编辑 .env 填入 API 密钥，并确保 TP_SERVER_REL
 poetry run python main.py  # 验证：访问 http://127.0.0.1:8900/api/v1/health
 ```
 
-#### IDE 插件安装（VS Code / Windsurf / Cursor）
+#### IDE 插件安装（VS Code / Windsurf / Cursor / TRAE）
 ```bash
 cd extension
-npm install && npm run compile
-npx vsce package --allow-missing-repository
+npm install && node esbuild.js
+npx @vscode/vsce package --no-yarn
 # VS Code
 "/Applications/开发工具/Visual Studio Code.app/Contents/Resources/app/bin/code" \
-  --install-extension testpilot-ai-1.0.0.vsix
+  --install-extension testpilot-ai-1.3.0.vsix
 # Windsurf
 "/Applications/开发工具/Windsurf.app/Contents/Resources/app/bin/windsurf" \
-  --install-extension testpilot-ai-1.0.0.vsix
+  --install-extension testpilot-ai-1.3.0.vsix
 # Cursor
 "/Applications/开发工具/Cursor.app/Contents/Resources/app/bin/code" \
-  --install-extension testpilot-ai-1.0.0.vsix
+  --install-extension testpilot-ai-1.3.0.vsix
+# TRAE（Linux/macOS 同理）
+"/Applications/Trae.app/Contents/MacOS/Trae" \
+  --install-extension testpilot-ai-1.3.0.vsix --force
 ```
 
+**TRAE 注意事项（⚠️ 重要）：**
+- TRAE 扩展目录（Windows）：`C:\Users\%USERNAME%\.trae-cn\extensions\`
+- 目录名格式：`{publisher}.{extensionName}-{version}`，publisher 不同 = 完全不同的插件
+- 若 TRAE 同时存在旧版（不同 publisher ID），需先将旧版目录 rename 为 `.bak`：
+  ```powershell
+  cd "$env:USERPROFILE\.trae-cn\extensions"
+  Rename-Item testpilot-ai.testpilot-ai-1.2.9 testpilot-ai.testpilot-ai-1.2.9.bak
+  ```
+- Windows TRAE 安装新版：
+  ```powershell
+  & "$env:USERPROFILE\AppData\Local\Programs\Trae\Trae.exe" `
+    --install-extension D:\Projects\TestPilotAI\extension\testpilot-ai-1.3.0.vsix --force
+  ```
+- 安装后必须重启 TRAE 才生效
+
 #### MCP 配置（Mac 路径版）
 ```bash
 # 查询 Poetry 虚拟环境 Python 路径
@@ -248,6 +273,7 @@ git pull && poetry install && cd desktop && npm install && npm run build
 | v13.1 | ✅ **服务器部署+MySQL适配**（2026-03-15）：腾讯云轻量Ubuntu服务器+阿里云RDS MySQL+Nginx直接部署+SSL |
 | v13.2 | ✅ **官网上线+扩展UI修复**（2026-03-17）：HTTPS证书+下载页+启动按钮状态Bug修复+经验库自动fallback远程 |
 | v14.x | ✅ **插件UI大升级**（2026-03-17~22）：<br>主题切换（浅色/深色，localStorage持久）<br>设置改浮动下拉菜单（不占Tab位）<br>齿轮按钮内联到引擎状态行（随页面滚动，不遮挡内容）<br>顽固Bug 4级递进系统（localStorage持久，通过后自动清零）<br>蓝本扫描排除test_fixtures/.venv/目录 |
+| v14.0-F | ✅ **登录UI迷你横条+TRAE修复**（2026-03-25）：<br>登录面板改为单行状态条+折叠下拉（删除大 auth-panel）<br>注册→跳官网 openExternal（不内嵌注册表单）<br>retainContextWhenHidden:true 修复日志反复打印<br>TRAE旧publisher版本(.bak)清理，新vsix安装成功 |
 | v18 | ✅ **编程AI蓝本自动生成规则注入**（2026-03-20）：AGENTS.md+copilot-instructions.md+全IDE规则文件映射 |
 | v19 | ✅ **页面指纹识别系统**（2026-03-21）：dump UI树提取文本指纹→秒级识别当前页→复用坐标缓存。Android/桌面已实现，iOS待Mac环境实现 |
 | v20 | ✅ **批量蓝本测试结果修复+全平台审计**（2026-03-21）：inBatchMode竞态保护+步骤蓝本标签+桌面持久化缓存+移动端溢出检测 |