diff --git a/01_content/build.mjs b/01_content/build.mjs index 263741c..5abf129 100644 --- a/01_content/build.mjs +++ b/01_content/build.mjs @@ -43,6 +43,7 @@ await build({ target: ['es2022'], jsx: 'automatic', external: ['@deepseek-ai/*', 'react', 'react-dom', 'react/jsx-runtime', 'react/jsx-dev-runtime', 'scheduler'], + loader: { '.css': 'text' }, // xterm.css 以文本内联进样式串（宿主不加载独立 css 文件） banner: clientBanner, footer: clientFooter, }) diff --git a/01_content/src/client/split.tsx b/01_content/src/client/split.tsx index cbfc94a..f55ad87 100644 --- a/01_content/src/client/split.tsx +++ b/01_content/src/client/split.tsx @@ -1,6 +1,6 @@ import { Fragment, useCallback, useEffect, useRef, useState } from 'react' import { Terminal } from 'xterm' -import 'xterm/css/xterm.css' + import MarkdownIt from 'markdown-it' import hljs from 'highlight.js/lib/core' import hljsTypescript from 'highlight.js/lib/languages/typescript' diff --git a/01_content/src/client/styles.ts b/01_content/src/client/styles.ts index c0b7705..4a9eb20 100644 --- a/01_content/src/client/styles.ts +++ b/01_content/src/client/styles.ts @@ -1,4 +1,9 @@ -export const css = [ +// xterm 自带样式以文本内联（宿主只加载 JS，独立的 lib/client.css 不会被注入—— +// 否则 xterm 的隐藏输入 textarea 会裸露成左上角的小输入框） +// @ts-ignore +import xtermCss from 'xterm/css/xterm.css' + +export const css = xtermCss + '\n' + [ // 区块整体 '.dsh-wt_section{box-sizing:border-box;display:flex;flex-direction:column;gap:6px;width:100%;padding:0}', '.dsh-wt_float{min-width:176px;max-width:264px;background:var(--dsw-alias-bg-base,#0b0e14);border:1px solid var(--dsw-alias-border-l2,#3a4150);border-radius:10px;padding:8px;box-shadow:var(--dsw-shadow-lv2,0 8px 24px rgba(0,0,0,.4))}', diff --git a/02_process/worklogs/2026-08-16_worktable-v2.md b/02_process/worklogs/2026-08-16_worktable-v2.md index 1f013b2..24193b2 100644 --- a/02_process/worklogs/2026-08-16_worktable-v2.md +++ b/02_process/worklogs/2026-08-16_worktable-v2.md @@ -1029,6 +1029,19 @@ functional-diag 全 20 STEP ERROR_COUNT: 0。 - 备注：纯客户端改动，F5 即生效。 +## 补记（终端左上角「小输入框」修复：xterm.css 内联注入） + +- 用户反馈：终端窗左上角仍有一个像很小输入框的东西。 +- 排查：直连终端 WS 抓原始输出 = 干净 PS 提示符（-NoProfile 已生效）；真正元凶是 xterm 的 + 隐藏输入 textarea——xterm.css 被打进 lib/client.css，而宿主只加载 JS 不加载独立 css 文件， + 该样式从未注入，textarea 裸露可见。 +- 修复：client 构建加 text loader，styles.ts 内联 import 'xterm/css/xterm.css' 拼入注入样式串； + split.tsx 移除独立 css import。 +- 验证（termtextarea-mini.cjs）：终端 tab 打开后 textarea opacity=0 / z-index=-5 / 7×14px + 不可见 ✓。 +- 备注：纯客户端改动，F5 即生效。回归期间发现宿主侧故障（见下条）导致全量回归无法通过。 + + diff --git a/04_test/diagload-mini.cjs b/04_test/diagload-mini.cjs new file mode 100644 index 0000000..2ff183c --- /dev/null +++ b/04_test/diagload-mini.cjs @@ -0,0 +1,70 @@ +// diagload-mini.cjs — 诊断插件加载：控制台错误 + 关键全局 + 区块 DOM +const http = require('http'); +const { spawn } = require('child_process'); +const WebSocket = require('ws'); +const PORT = 9366; +const proc = spawn('C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe', [ + '--headless=new', '--disable-gpu', '--no-first-run', '--no-default-browser-check', + '--window-size=1440,900', '--force-device-scale-factor=1', + '--remote-debugging-port=' + PORT, + '--user-data-dir=C:\\Users\\SJL\\AppData\\Local\\Temp\\wt-chrome-diagload', + 'about:blank', +], { stdio: 'ignore' }); +const getJSON = (p) => new Promise((res, rej) => { + http.get({ host: '127.0.0.1', port: PORT, path: p }, (r) => { let d=''; r.on('data',c=>d+=c); r.on('end',()=>{try{res(JSON.parse(d))}catch(e){rej(e)}}) }).on('error', rej); +}); +const sleep = (ms) => new Promise((r) => setTimeout(r, ms)); +(async () => { + let list = null; + for (let i = 0; i < 40; i++) { try { list = await getJSON('/json/list'); if (list && list.length) break; } catch {} await sleep(500); } + const target = list.find((t) => t.type === 'page') || list[0]; + const ws = new WebSocket(target.webSocketDebuggerUrl); + let id = 0; const pending = new Map(); const events = []; + const send = (method, params) => new Promise((res) => { const mid = ++id; pending.set(mid, res); ws.send(JSON.stringify({ id: mid, method, params })); }); + ws.on('message', (raw) => { const m = JSON.parse(String(raw)); if (m.id && pending.has(m.id)) { pending.get(m.id)(m); pending.delete(m.id); } else if (m.method) events.push(m); }); + await new Promise((r) => ws.on('open', r)); + await send('Runtime.enable'); + await send('Log.enable'); + await send('Page.enable'); + await send('Page.addScriptToEvaluateOnNewDocument', { + source: "try{ if(window===window.top && location.origin==='http://127.0.0.1:3080'){ localStorage.setItem('dsh.worktable.projects.v1', JSON.stringify({order:[],lastUsed:{},hidden:[],nameOverrides:{},shortcuts:[],layouts:[{id:'t-layout',title:'L',top:null,left:null,main:[{id:'p1',title:'W',min:200,content:null}],chatWidth:{default:320,min:240,max:600},chatSide:'right',chatFullHeight:false}],bindings:{},folders:{}})); } }catch(e){}", + }); + await send('Page.navigate', { url: 'http://127.0.0.1:3080/' }); + const evaluate = async (expr) => { + const r = await send('Runtime.evaluate', { expression: expr, returnByValue: true, awaitPromise: true }); + if (r.result && r.result.exceptionDetails) return { __error: (r.result.exceptionDetails.exception || {}).description || r.result.exceptionDetails.text }; + return r.result && r.result.result ? r.result.result.value : undefined; + }; + await sleep(10000); + // 新 UI：点击「展开侧边栏」 + const exp = await evaluate(`(function(){ var b = document.querySelector('button[aria-label=\"展开侧边栏\"]'); if (b) { b.click(); return true; } return false; })()`); + console.log('EXPAND:', JSON.stringify(exp)); + await sleep(1500); + const pre = await evaluate(`(function(){ + // 找侧栏开关：dump 所有带 title/aria-label 的按钮 + var btns = [].slice.call(document.querySelectorAll('button[title], button[aria-label]')).slice(0, 30).map(function(b){ return { t: b.title || '', a: b.getAttribute('aria-label') || '', cls: String(b.className).slice(0, 50) }; }); + return JSON.stringify(btns); + })()`); + console.log('BUTTONS:', JSON.stringify(pre).slice(0, 2200)); + const step = await evaluate(`(function(){ + var out = {}; + out.dsh = !!window.__dshWorktable; + // 侧栏结构：找可能的 section 容器并 dump 文本 + var cands = [].slice.call(document.querySelectorAll('aside, nav, [class*=sidebar], [class*=Sidebar], [class*=rail], [class*=Rail]')).slice(0, 8).map(function(el){ return { cls: String(el.className).slice(0, 60), text: String(el.innerText).slice(0, 120).replace(/\\n/g, ' | ') }; }); + out.sidebarCands = cands; + // 顶层结构：body 直接子元素 + out.bodyKids = [].slice.call(document.body.children).map(function(el){ return { tag: el.tagName, cls: String(el.className).slice(0, 80), text: String(el.innerText).slice(0, 100).replace(/\\n/g, ' | ') }; }); + out.section = !!document.querySelector('.dsh-wt_section'); + out.root = !!document.querySelector('.dsh-wt_root'); + out.cards = document.querySelectorAll('.dsh-wt_layout').length; + out.worktableText = document.body ? (document.body.innerText.indexOf('工作台') >= 0) : null; + return JSON.stringify(out); + })()`); + console.log('DIAGLOAD:', JSON.stringify(step)); + const errs = events.filter((e) => e.method === 'Runtime.exceptionThrown' || (e.method === 'Log.entryAdded' && e.params.entry.level === 'error')) + .slice(-10).map((e) => e.method === 'Runtime.exceptionThrown' + ? 'EXC: ' + ((e.params.exceptionDetails.exception || {}).description || '').slice(0, 260) + : 'LOG: ' + (e.params.entry.text || '').slice(0, 200) + ' | ' + (e.params.entry.url || '').slice(0, 120)); + console.log('ERRORS:', JSON.stringify(errs, null, 1)); + ws.close(); proc.kill(); process.exit(0); +})().catch((e) => { console.error('FATAL', e && e.stack || e); try { proc.kill(); } catch {} process.exit(1); }); diff --git a/04_test/termraw-mini.cjs b/04_test/termraw-mini.cjs new file mode 100644 index 0000000..789f1cd --- /dev/null +++ b/04_test/termraw-mini.cjs @@ -0,0 +1,13 @@ +// termraw-mini.cjs — 直连终端 WS 抓原始输出：判断服务端是否已用 -NoProfile +const WebSocket = require('ws'); +const http = require('http'); +const ws = new WebSocket('ws://127.0.0.1:3080/api/worktable/term?sessionId=&cwd=E:\\AI_Workspace\\DeepseekHarness&cols=100&rows=24'); +let buf = ''; +const timer = setTimeout(() => { + console.log('RAW:', JSON.stringify(buf.slice(0, 700))); + ws.close(); + process.exit(0); +}, 5000); +ws.on('open', () => { console.log('OPEN'); ws.send('\r'); }); +ws.on('message', (d) => { buf += String(d); if (buf.indexOf('>') >= 0 && buf.length > 40) { clearTimeout(timer); console.log('RAW:', JSON.stringify(buf.slice(0, 700))); ws.close(); process.exit(0); } }); +ws.on('error', (e) => { console.log('ERR', e.message); process.exit(1); }); diff --git a/04_test/termtextarea-mini.cjs b/04_test/termtextarea-mini.cjs new file mode 100644 index 0000000..8727f23 --- /dev/null +++ b/04_test/termtextarea-mini.cjs @@ -0,0 +1,68 @@ +// termtextarea-mini.cjs — 打开终端窗，验证 xterm 隐藏输入框已不可见（css 已注入） +const http = require('http'); +const { spawn } = require('child_process'); +const WebSocket = require('ws'); +const PORT = 9365; +const proc = spawn('C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe', [ + '--headless=new', '--disable-gpu', '--no-first-run', '--no-default-browser-check', + '--window-size=1440,900', '--force-device-scale-factor=1', + '--remote-debugging-port=' + PORT, + '--user-data-dir=C:\\Users\\SJL\\AppData\\Local\\Temp\\wt-chrome-termtextarea', + 'about:blank', +], { stdio: 'ignore' }); +const getJSON = (p) => new Promise((res, rej) => { + http.get({ host: '127.0.0.1', port: PORT, path: p }, (r) => { let d=''; r.on('data',c=>d+=c); r.on('end',()=>{try{res(JSON.parse(d))}catch(e){rej(e)}}) }).on('error', rej); +}); +const sleep = (ms) => new Promise((r) => setTimeout(r, ms)); +(async () => { + let list = null; + for (let i = 0; i < 40; i++) { try { list = await getJSON('/json/list'); if (list && list.length) break; } catch {} await sleep(500); } + const target = list.find((t) => t.type === 'page') || list[0]; + const ws = new WebSocket(target.webSocketDebuggerUrl); + let id = 0; const pending = new Map(); const events = []; + const send = (method, params) => new Promise((res) => { const mid = ++id; pending.set(mid, res); ws.send(JSON.stringify({ id: mid, method, params })); }); + ws.on('message', (raw) => { const m = JSON.parse(String(raw)); if (m.id && pending.has(m.id)) { pending.get(m.id)(m); pending.delete(m.id); } else if (m.method) events.push(m); }); + await new Promise((r) => ws.on('open', r)); + await send('Runtime.enable'); + await send('Page.enable'); + await send('Page.navigate', { url: 'http://127.0.0.1:3080/' }); + const evaluate = async (expr) => { + const r = await send('Runtime.evaluate', { expression: expr, returnByValue: true, awaitPromise: true }); + if (r.result && r.result.exceptionDetails) return { __error: (r.result.exceptionDetails.exception || {}).description || r.result.exceptionDetails.text }; + return r.result && r.result.result ? r.result.result.value : undefined; + }; + let ready = null; + for (let i = 0; i < 30; i++) { await sleep(1000); ready = await evaluate("!!window.__dshWorktable"); if (ready === true) break; } + await sleep(1500); + const step = await evaluate(`(async function(){ + var out = {}; + var sleep = function(ms){ return new Promise(function(r){ setTimeout(r, ms); }); }; + var st = window.__dshWorktable.splitStore; + st.open({id:'t-term',title:'t',top:null,main:[{id:'p1',title:'W',min:200,content:null}],chatWidth:{default:320,min:240,max:600}}); + await sleep(700); + st.openTab('main', 0, { kind: 'builtin', type: 'terminal' }); + await sleep(1800); + out.tabs = st.spec && st.spec.main[0] && st.spec.main[0].tabs ? st.spec.main[0].tabs.map(function(t){ return t.content && t.content.type; }) : null; + var pane = document.querySelector('.dsh-wt_pane'); + out.paneHtml = pane ? pane.innerHTML.slice(0, 300) : null; + out.termHost = !!document.querySelector('.dsh-wt_termHost'); + out.xterm = !!document.querySelector('.xterm'); + out.failText = document.querySelector('.dsh-wt_paneWipText') ? String(document.querySelector('.dsh-wt_paneWipText').textContent).slice(0,40) : null; + var ta = document.querySelector('.xterm-helper-textarea'); + out.textareaExists = !!ta; + if (ta) { + var cs = getComputedStyle(ta); + var r = ta.getBoundingClientRect(); + out.opacity = cs.opacity; + out.left = cs.left; + out.rect = { x: Math.round(r.x), y: Math.round(r.y), w: Math.round(r.width), h: Math.round(r.height) }; + out.zIndex = cs.zIndex; + } + st.close(); + return JSON.stringify(out); + })()`); + console.log('TERMTEXTAREA:', JSON.stringify(step)); + const errs = events.filter((e) => e.method === 'Runtime.exceptionThrown').slice(-6).map((e) => ((e.params.exceptionDetails.exception || {}).description || '').slice(0, 200)); + console.log('EXCEPTIONS:', JSON.stringify(errs)); + ws.close(); proc.kill(); process.exit(0); +})().catch((e) => { console.error('FATAL', e && e.stack || e); try { proc.kill(); } catch {} process.exit(1); });