admin/DeskClaw
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(chat): thinking execution graph (#880)

Browse Source
This commit is contained in:
Haze
2026-04-20 20:53:26 +08:00
committed by GitHub
Unverified
parent 7fa4852c1d
commit 9a1575114d
9 changed files with 227 additions and 274 deletions
Download Patch File Download Diff File Expand all files Collapse all files

207
tests/e2e/chat-task-visualizer.spec.ts
View File

@@ -148,14 +148,6 @@ const childTranscriptMessages = [
},
];
const inFlightPrompt = 'Open browser, search for tech news, and take a screenshot';
const seededInFlightHistory = [
{
role: 'user',
content: [{ type: 'text', text: inFlightPrompt }],
timestamp: Date.now(),
},
];
const longRunPrompt = 'Inspect the workspace and summarize the result';
const longRunProcessSegments = Array.from({ length: 9 }, (_, index) => `Checked source ${index + 1}.`);
const longRunSummary = 'Here is the summary.';
@@ -277,205 +269,6 @@ test.describe('ClawX chat execution graph', () => {
}
});
test('does not duplicate the in-flight user prompt or cumulative streaming content', async ({ launchElectronApp }) => {
const app = await launchElectronApp({ skipSetup: true });
try {
await installIpcMocks(app, {
gatewayStatus: { state: 'running', port: 18789, pid: 12345 },
gatewayRpc: {
[stableStringify(['sessions.list', {}])]: {
success: true,
result: {
sessions: [{ key: PROJECT_MANAGER_SESSION_KEY, displayName: 'main' }],
},
},
[stableStringify(['chat.history', { sessionKey: PROJECT_MANAGER_SESSION_KEY, limit: 200 }])]: {
success: true,
result: {
messages: seededInFlightHistory,
},
},
},
hostApi: {
[stableStringify(['/api/gateway/status', 'GET'])]: {
ok: true,
data: {
status: 200,
ok: true,
json: { state: 'running', port: 18789, pid: 12345 },
},
},
[stableStringify(['/api/agents', 'GET'])]: {
ok: true,
data: {
status: 200,
ok: true,
json: {
success: true,
agents: [{ id: 'main', name: 'main' }],
},
},
},
},
});
await app.evaluate(async ({ app: _app }) => {
const { ipcMain } = process.mainModule!.require('electron') as typeof import('electron');
(globalThis as typeof globalThis & { __chatExecutionHistory?: unknown[] }).__chatExecutionHistory = [
{
role: 'user',
content: [{ type: 'text', text: 'Open browser, search for tech news, and take a screenshot' }],
timestamp: Date.now(),
},
];
ipcMain.removeHandler('gateway:rpc');
ipcMain.handle('gateway:rpc', async (_event: unknown, method: string, payload: unknown) => {
void payload;
if (method === 'sessions.list') {
return {
success: true,
result: {
sessions: [{ key: 'agent:main:main', displayName: 'main' }],
},
};
}
if (method === 'chat.history') {
return {
success: true,
result: {
messages: (
(globalThis as typeof globalThis & { __chatExecutionHistory?: unknown[] }).__chatExecutionHistory
?? seededInFlightHistory
),
},
};
}
return { success: true, result: {} };
});
});
const page = await getStableWindow(app);
try {
await page.reload();
} catch (error) {
if (!String(error).includes('ERR_FILE_NOT_FOUND')) {
throw error;
}
}
await expect(page.getByTestId('main-layout')).toBeVisible();
await expect(page.getByText(inFlightPrompt)).toHaveCount(1);
await app.evaluate(async ({ BrowserWindow }) => {
const win = BrowserWindow.getAllWindows()[0];
win?.webContents.send('gateway:notification', {
method: 'agent',
params: {
runId: 'mock-run',
sessionKey: 'agent:main:main',
state: 'started',
},
});
});
await expect(page.locator('[data-testid="chat-execution-graph"]')).toHaveAttribute('data-collapsed', 'false');
await expect(page.locator('[data-testid="chat-execution-step-thinking-trailing"]')).toBeVisible();
await expect(page.locator('[data-testid="chat-execution-step-thinking-trailing"] [aria-hidden="true"]')).toHaveCount(1);
await expect(page.locator('[data-testid^="chat-message-"]')).toHaveCount(1);
await app.evaluate(async ({ BrowserWindow }) => {
const win = BrowserWindow.getAllWindows()[0];
win?.webContents.send('gateway:notification', {
method: 'agent',
params: {
runId: 'mock-run',
sessionKey: 'agent:main:main',
state: 'delta',
message: {
role: 'assistant',
content: [
{ type: 'thinking', thinking: 'thinking 1' },
{ type: 'thinking', thinking: 'thinking 1 2' },
{ type: 'thinking', thinking: 'thinking 1 2 3' },
{ type: 'text', text: '1' },
{ type: 'text', text: '1 2' },
{ type: 'text', text: '1 2 3' },
],
},
},
});
});
await expect(page.getByText(inFlightPrompt)).toHaveCount(1);
// Intermediate process output should be rendered in the execution graph
// only, not as a streaming assistant chat bubble.
await expect(page.locator('[data-testid^="chat-message-"]')).toHaveCount(1);
await expect(page.locator('[data-testid="chat-execution-graph"]')).toHaveAttribute('data-collapsed', 'false');
await expect(page.locator('[data-testid="chat-execution-step-thinking-trailing"]')).toBeVisible();
await expect(page.locator('[data-testid="chat-execution-step-thinking-trailing"] [aria-hidden="true"]')).toHaveCount(1);
await expect(page.locator('[data-testid="chat-execution-graph"] [data-testid="chat-execution-step"]').getByText('Thinking', { exact: true })).toHaveCount(3);
const firstChatBubble = page.locator('[data-testid^="chat-message-"] > div').first();
await expect(firstChatBubble.getByText(/^1 2 3$/)).toHaveCount(0);
await app.evaluate(async ({ BrowserWindow }) => {
(globalThis as typeof globalThis & { __chatExecutionHistory?: unknown[] }).__chatExecutionHistory = [
{
role: 'user',
content: [{ type: 'text', text: 'Open browser, search for tech news, and take a screenshot' }],
timestamp: Date.now(),
},
{
role: 'assistant',
content: [{
type: 'toolCall',
id: 'browser-start-call',
name: 'browser',
arguments: { action: 'start' },
}],
timestamp: Date.now(),
},
{
role: 'assistant',
content: [{
type: 'toolCall',
id: 'browser-open-call',
name: 'browser',
arguments: { action: 'open', targetUrl: 'https://x.com/home' },
}],
timestamp: Date.now(),
},
{
role: 'assistant',
id: 'final-response',
content: [{ type: 'text', text: 'Done.' }],
timestamp: Date.now(),
},
];
const win = BrowserWindow.getAllWindows()[0];
win?.webContents.send('gateway:notification', {
method: 'agent',
params: {
runId: 'mock-run',
sessionKey: 'agent:main:main',
state: 'final',
message: {
role: 'assistant',
id: 'final-response',
content: [{ type: 'text', text: 'Done.' }],
timestamp: Date.now(),
},
},
});
});
await expect(page.getByText('Done.')).toBeVisible();
await expect(page.locator('[data-testid="chat-execution-graph"]')).toHaveAttribute('data-collapsed', 'true');
} finally {
await closeElectronApp(app);
}
});
test('preserves long execution history counts and strips the full folded reply prefix', async ({ launchElectronApp }) => {
const app = await launchElectronApp({ skipSetup: true });

4
tests/unit/chat-page-execution-graph.test.tsx
View File

@@ -126,13 +126,13 @@ describe('Chat execution graph lifecycle', () => {
});
});
it('collapses execution once the reply starts streaming and keeps only the reply suffix in the bubble', async () => {
it('keeps the execution graph expanded while the reply is still streaming and shows only the reply suffix in the bubble', async () => {
const { Chat } = await import('@/pages/Chat/index');
render(<Chat />);
await waitFor(() => {
expect(screen.getByTestId('chat-execution-graph')).toHaveAttribute('data-collapsed', 'true');
expect(screen.getByTestId('chat-execution-graph')).toHaveAttribute('data-collapsed', 'false');
});
expect(screen.getByText('Here is the summary.')).toBeInTheDocument();