mirror/nanobot
1
0
Fork 0
mirror of https://github.com/HKUDS/nanobot.git synced 2026-08-31 00:03:01 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix(webui): preserve causal message order (NAN-29) (#5503)

Browse Source
This commit is contained in:
chengyongru
2026-08-24 15:08:22 +08:00
committed by GitHub
parent 7f288a49fc
commit 04974b7607
8 changed files with 651 additions and 204 deletions
Download Patch File Download Diff File Expand all files Collapse all files
nanobot/webui/transcript.py
+8 -26
View File
@@ -1813,11 +1813,16 @@ def replay_transcript_to_ui_messages(
break
content = str(candidate.get("content") or "")
has_answer = len(content) > 0
if has_answer:
break
# A completed reasoning field is closed even while its assistant
# placeholder remains streaming for the rest of the turn.
if (
candidate.get("reasoningStreaming")
or candidate.get("reasoning") is not None
or has_answer
or candidate.get("isStreaming")
or (
candidate.get("isStreaming")
and candidate.get("reasoning") is None
)
):
prev[i] = {
**candidate,
@@ -1827,15 +1832,6 @@ def replay_transcript_to_ui_messages(
**turn_fields,
}
return
if not has_answer and candidate.get("isStreaming"):
prev[i] = {
**candidate,
"reasoning": chunk,
"reasoningStreaming": True,
"activitySegmentId": candidate.get("activitySegmentId") or _ensure_activity_segment(),
**turn_fields,
}
return
break
segment = _ensure_activity_segment()
prev.append(
@@ -1915,19 +1911,6 @@ def replay_transcript_to_ui_messages(
and not m.get("media")
)
def is_tool_trace_at(index: int) -> bool:
m = messages[index] if 0 <= index < len(messages) else None
return bool(m and m.get("kind") == "trace")
def prune_reasoning_only() -> None:
nonlocal messages
kept: list[dict[str, Any]] = []
for i, m in enumerate(messages):
if is_reasoning_only_placeholder(m) and not is_tool_trace_at(i + 1):
continue
kept.append(m)
messages = kept
def stamp_completion(
*,
latency_ms: int | None = None,
@@ -2442,7 +2425,6 @@ def replay_transcript_to_ui_messages(
for i, m in enumerate(messages):
if m.get("isStreaming"):
messages[i] = {**m, "isStreaming": False}
prune_reasoning_only()
lat = rec.get("latency_ms")
usage = rec.get("usage")
sanitized_usage = (
tests/utils/test_webui_transcript.py
+122
View File
@@ -409,6 +409,128 @@ def test_replay_canonical_completed_stream_records() -> None:
assert msgs[1]["latencyMs"] == 42
def test_replay_preserves_closed_reasoning_slices_before_later_tool_trace() -> None:
msgs = replay_transcript_to_ui_messages([
{
"event": "reasoning_delta",
"chat_id": "reasoning-boundary",
"text": "First reasoning.",
"turn_id": "turn-reasoning-boundary",
"turn_phase": "reasoning",
"turn_seq": 1,
},
{
"event": "reasoning_end",
"chat_id": "reasoning-boundary",
"turn_id": "turn-reasoning-boundary",
"turn_phase": "reasoning",
"turn_seq": 2,
},
{
"event": "reasoning_delta",
"chat_id": "reasoning-boundary",
"text": "Second reasoning.",
"turn_id": "turn-reasoning-boundary",
"turn_phase": "reasoning",
"turn_seq": 3,
},
{
"event": "reasoning_end",
"chat_id": "reasoning-boundary",
"turn_id": "turn-reasoning-boundary",
"turn_phase": "reasoning",
"turn_seq": 4,
},
{
"event": "message",
"chat_id": "reasoning-boundary",
"text": "exec()",
"kind": "tool_hint",
"turn_id": "turn-reasoning-boundary",
"turn_phase": "activity",
"turn_seq": 5,
},
{
"event": "message",
"chat_id": "reasoning-boundary",
"text": "Final answer.",
"turn_id": "turn-reasoning-boundary",
"turn_phase": "answer",
"turn_seq": 6,
},
{
"event": "turn_end",
"chat_id": "reasoning-boundary",
"turn_id": "turn-reasoning-boundary",
"turn_phase": "complete",
"turn_seq": 7,
},
])
assert [
message.get("reasoning")
or (message.get("traces") or [None])[0]
or message.get("content")
for message in msgs
] == [
"First reasoning.",
"Second reasoning.",
"exec()",
"Final answer.",
]
def test_replay_preserves_closed_reasoning_slices_without_tool_trace() -> None:
msgs = replay_transcript_to_ui_messages([
{"event": "reasoning_delta", "text": "First reasoning.", "turn_seq": 1},
{"event": "reasoning_end", "turn_seq": 2},
{"event": "reasoning_delta", "text": "Second reasoning.", "turn_seq": 3},
{"event": "reasoning_end", "turn_seq": 4},
{"event": "message", "text": "Final answer.", "turn_seq": 5},
{"event": "turn_end", "turn_seq": 6},
])
assert [
(message.get("reasoning"), message.get("content"))
for message in msgs
] == [
("First reasoning.", ""),
("Second reasoning.", "Final answer."),
]
def test_replay_keeps_answer_separate_from_reasoning_before_delayed_tool_trace() -> None:
msgs = replay_transcript_to_ui_messages([
{"event": "delta", "text": "Visible progress.", "turn_phase": "answer"},
{"event": "stream_end", "turn_phase": "answer"},
{"event": "reasoning_delta", "text": "Think again.", "turn_phase": "reasoning"},
{"event": "reasoning_end", "turn_phase": "reasoning"},
{
"event": "message",
"text": "exec()",
"kind": "tool_hint",
"turn_phase": "activity",
},
{"event": "message", "text": "Final answer.", "turn_phase": "answer"},
{"event": "turn_end", "turn_phase": "complete"},
])
assert [
(
message.get("content"),
message.get("reasoning"),
message.get("kind"),
message.get("turnPhase"),
)
for message in msgs
] == [
("Visible progress.", None, None, "answer"),
("", "Think again.", None, "reasoning"),
("exec()", None, "trace", "activity"),
("Final answer.", None, None, "answer"),
]
def test_replay_turn_end_preserves_usage_semantics(tmp_path, monkeypatch) -> None:
monkeypatch.setattr("nanobot.config.paths.get_data_dir", lambda: tmp_path)
key = "websocket:t-usage"
webui/src/components/thread/ThreadMessages.tsx
+4 -8
View File
@@ -26,12 +26,8 @@ interface ThreadMessagesProps {
export type DisplayUnit = TurnUnit;
export function buildDisplayUnits(
messages: UIMessage[],
isStreaming = false,
activeTurnId: string | null = null,
): DisplayUnit[] {
return projectActivityTimeline(messages, isStreaming ? activeTurnId : undefined);
export function buildDisplayUnits(messages: UIMessage[]): DisplayUnit[] {
return projectActivityTimeline(messages);
}
export function assistantForkFlags(units: DisplayUnit[]): boolean[] {
@@ -69,8 +65,8 @@ export function ThreadMessages({
const { t } = useTranslation();
const messageListRef = useRef<HTMLDivElement>(null);
const units = useMemo(
() => buildDisplayUnits(messages, isStreaming, activeTurnId),
[activeTurnId, isStreaming, messages],
() => buildDisplayUnits(messages),
[messages],
);
const forkBoundaryAfterUnitIndex = useMemo(
() => unitIndexAfterMessageCount(units, forkBoundaryMessageCount),
webui/src/hooks/useNanobotStream.ts
+5 -5
View File
@@ -21,7 +21,6 @@ import {
isReasoningOnlyPlaceholder,
matchesTurn,
mergeFileEdits,
pruneReasoningOnlyPlaceholders,
replaceMessageAt,
stampLastAssistantCompletion,
stripCoveredFileEditToolHintsFromMessages,
@@ -90,10 +89,12 @@ function attachReasoningChunk(
const activitySegmentId = candidate.activitySegmentId ?? segments?.ensure();
const hasAnswer = candidate.content.length > 0;
if (hasAnswer) break;
// ``reasoning_end`` closes this row even though the assistant placeholder
// stays streaming for the rest of the turn. The next reasoning stream must
// get its own row when an intervening tool trace is delayed or unavailable.
if (
candidate.reasoningStreaming
|| candidate.reasoning !== undefined
|| candidate.isStreaming
|| (candidate.isStreaming && candidate.reasoning === undefined)
) {
const merged: UIMessage = {
...candidate,
@@ -841,7 +842,6 @@ export function useNanobotStream(
const completedAt = Date.now();
setMessages((prev) => {
let finalized = prev.map((m) => (m.isStreaming ? { ...m, isStreaming: false } : m));
finalized = pruneReasoningOnlyPlaceholders(finalized);
const latencyMs =
typeof ev.latency_ms === "number" && ev.latency_ms >= 0
? Math.round(ev.latency_ms)
@@ -1185,7 +1185,7 @@ export function useNanobotStream(
}
const base = finalizeActiveTurn ? finalizeStreamedTurn(prev) : prev;
return [
...(sideChannel || continueActiveTurn ? base : pruneReasoningOnlyPlaceholders(base)),
...base,
{
id: userMessageId,
role: "user",
webui/src/lib/activity-timeline.ts
+116 -101
View File
@@ -1,8 +1,7 @@
import type { UIMessage } from "@/lib/types";
/** A completed turn has two surfaces: one activity container and one final
* answer. Answer text is never inferred to be activity merely because a later
* tool event arrived; explicit reasoning/activity fields own that distinction. */
/** A turn is projected into ordered answer messages and collapsible activity
* runs. Folding changes presentation only; it never changes semantic order. */
export type TurnUnit =
| {
type: "activity";
@@ -49,14 +48,14 @@ export function hasPendingAgentActivity(messages: UIMessage[]): boolean {
|| previous.turnId !== lastTurnId;
}
/**
* Project completed or replayed gateway rows into the stable shape:
/** Project gateway rows without changing their causal order.
*
* user → [one live/completed activity surface] → [one final answer]
*
* A provider may emit multiple answer segments around tool activity. They are
* merged into the one final answer instead of being reclassified as reasoning;
* only explicit reasoning, trace, and model-activity rows enter the fold.
* Messages use ``turnSeq`` when every row in the turn provides it and fall
* back to stable arrival order otherwise. Only contiguous rows of the same
* display class are combined: activity rows share a collapsible surface, and
* adjacent answer slices share an answer bubble. A visible answer is always a
* hard boundary between activity surfaces; completed empty transport frames
* have no display semantics and therefore create no boundary.
*/
export function normalizeActivityTimeline(
messages: UIMessage[],
@@ -73,42 +72,22 @@ export function normalizeActivityTimeline(
return;
}
const ordered = orderMessagesByTurnSeq(turnMessages);
const activity: UIMessage[] = [];
const answers: UIMessage[] = [];
let activitySourceMessageCount = 0;
for (const message of ordered) {
if (isRawActivity(message)) {
activity.push(message);
activitySourceMessageCount += 1;
} else if (isAssistantAnswer(message)) {
if (message.reasoning?.trim() || message.reasoningStreaming) {
// The synthetic reasoning row and answer both come from one raw
// message, so account for that source on the answer unit only.
activity.push(reasoningOnlyMessageFromAnswer(message));
}
answers.push(stripInlineReasoning(message));
} else {
activity.push(message);
activitySourceMessageCount += 1;
}
}
if (activity.length) {
units.push({
type: "activity",
messages: activity,
sourceMessageCount: activitySourceMessageCount,
turnLatencyMs: activityTurnLatencyMs(activity, ordered),
startedAtMs: activeTurnStartedAtMs,
});
}
if (answers.length) {
units.push({
type: "message",
message: mergeAssistantAnswers(answers),
sourceMessageCount: answers.length,
});
const projected = projectOrderedTurn(
orderMessagesByTurnSeq(turnMessages),
activeTurnStartedAtMs,
);
if (projected.length) {
units.push(...projected);
} else if (units.length) {
// A turn containing only completed transport placeholders has no
// display surface. Keep its source count on the preceding prompt so
// persisted fork-boundary offsets still map to a visible unit.
const lastIndex = units.length - 1;
const last = units[lastIndex];
units[lastIndex] = {
...last,
sourceMessageCount: last.sourceMessageCount + turnMessages.length,
};
}
turnMessages = [];
@@ -133,57 +112,22 @@ export function normalizeActivityTimeline(
return units;
}
/**
* Keep an in-flight turn in arrival order. Answer, reasoning, and activity
* semantics are explicit, but a later tool event can still arrive after
* already-visible answer Markdown. Reparenting on each event would make that
* Markdown tree jump between containers.
*
* Completed turns still use ``normalizeActivityTimeline`` and collapse into
* one audit surface plus the merged answer. While the turn is active, answer
* text and contiguous activity phases stay in arrival order. A later tool
* therefore appends a Working surface after existing Markdown instead of
* reparenting it.
*/
export function projectActivityTimeline(
messages: UIMessage[],
liveTurnId?: string | null,
): TurnUnit[] {
if (liveTurnId === undefined) return normalizeActivityTimeline(messages);
const liveStart = findLiveTurnStart(messages, liveTurnId);
if (liveStart < 0) return normalizeActivityTimeline(messages);
const nextPrompt = messages.findIndex(
(message, index) => index > liveStart && message.role === "user",
);
const liveEnd = nextPrompt < 0 ? messages.length : nextPrompt;
return [
...normalizeActivityTimeline(messages.slice(0, liveStart)),
...projectLiveTurn(messages.slice(liveStart, liveEnd)),
...normalizeActivityTimeline(messages.slice(liveEnd)),
];
return normalizeActivityTimeline(messages);
}
function findLiveTurnStart(messages: UIMessage[], liveTurnId: string | null): number {
for (let index = messages.length - 1; index >= 0; index -= 1) {
const message = messages[index];
if (message.role !== "user") continue;
if (liveTurnId === null || message.turnId === liveTurnId) return index;
}
return -1;
}
function projectLiveTurn(messages: UIMessage[]): TurnUnit[] {
function projectOrderedTurn(
messages: UIMessage[],
startedAtMs?: number,
): TurnUnit[] {
const units: TurnUnit[] = [];
const prompt = messages[0];
const startedAtMs = prompt?.role === "user" ? validCreatedAtMs(prompt.createdAt) : undefined;
let activity: UIMessage[] = [];
let activitySourceMessageCount = 0;
if (prompt?.role === "user") {
units.push({ type: "message", message: prompt, sourceMessageCount: 1 });
}
let answers: UIMessage[] = [];
let answerSourceMessageCount = 0;
let leadingNoopSourceMessageCount = 0;
const flushActivity = () => {
if (!activity.length) return;
@@ -191,36 +135,87 @@ function projectLiveTurn(messages: UIMessage[]): TurnUnit[] {
type: "activity",
messages: activity,
sourceMessageCount: activitySourceMessageCount,
turnLatencyMs: activityTurnLatencyMs(activity, activity),
startedAtMs,
});
activity = [];
activitySourceMessageCount = 0;
};
for (const message of messages.slice(prompt?.role === "user" ? 1 : 0)) {
if (isRawActivity(message)) {
activity.push(message);
const flushAnswers = () => {
if (!answers.length) return;
units.push({
type: "message",
message: mergeAssistantAnswers(answers),
sourceMessageCount: answerSourceMessageCount,
});
answers = [];
answerSourceMessageCount = 0;
};
const claimLeadingNoops = () => {
const count = leadingNoopSourceMessageCount;
leadingNoopSourceMessageCount = 0;
return count;
};
const appendActivity = (message: UIMessage, sourceMessageCount: number) => {
flushAnswers();
activity.push(message);
activitySourceMessageCount += sourceMessageCount + claimLeadingNoops();
};
const absorbDisplayNoop = () => {
if (activity.length) {
activitySourceMessageCount += 1;
} else if (answers.length) {
answerSourceMessageCount += 1;
} else {
leadingNoopSourceMessageCount += 1;
}
};
for (const message of messages) {
if (isCompletedDisplayNoop(message)) {
absorbDisplayNoop();
continue;
}
if (isRawActivity(message)) {
appendActivity(message, 1);
continue;
}
if (isAssistantAnswer(message)) {
if (message.reasoning?.trim() || message.reasoningStreaming) {
activity.push(reasoningOnlyMessageFromAnswer(message));
// This raw message contributes one answer source plus a synthetic
// reasoning row, so count it only on the answer unit.
appendActivity(reasoningOnlyMessageFromAnswer(message), 0);
}
flushActivity();
units.push({
type: "message",
message: stripInlineReasoning(message),
sourceMessageCount: 1,
});
answerSourceMessageCount += claimLeadingNoops();
answers.push(stripInlineReasoning(message));
answerSourceMessageCount += 1;
continue;
}
activity.push(message);
activitySourceMessageCount += 1;
appendActivity(message, 1);
}
flushActivity();
flushAnswers();
let lastActivityIndex = -1;
for (let index = units.length - 1; index >= 0; index -= 1) {
if (units[index].type !== "activity") continue;
lastActivityIndex = index;
break;
}
if (lastActivityIndex >= 0) {
const lastActivity = units[lastActivityIndex];
if (lastActivity.type === "activity") {
const turnLatencyMs = activityTurnLatencyMs(lastActivity.messages, messages);
if (turnLatencyMs !== undefined) {
units[lastActivityIndex] = { ...lastActivity, turnLatencyMs };
}
}
}
return units;
}
@@ -228,6 +223,26 @@ function isRawActivity(message: UIMessage): boolean {
return isAgentActivityMember(message);
}
/** A completed transport placeholder carries ordering/accounting metadata but
* no user-visible semantics, so it cannot define a display boundary. */
function isCompletedDisplayNoop(message: UIMessage): boolean {
return (
message.role === "assistant"
&& message.kind !== "trace"
&& message.activityKind !== "model"
&& !message.isStreaming
&& !message.reasoningStreaming
&& message.content.trim().length === 0
&& !message.reasoning?.trim()
&& !message.media?.length
&& !message.images?.length
&& !message.traces?.some((line) => line.trim().length > 0)
&& !message.toolEvents?.length
&& !message.fileEdits?.length
&& !message.sessionMessage
);
}
function isAssistantAnswer(message: UIMessage): boolean {
if (message.role !== "assistant" || message.kind === "trace" || message.activityKind === "model") {
return false;
webui/src/lib/thread-event-projection.ts
-15
View File
@@ -119,21 +119,6 @@ export function isReasoningOnlyPlaceholder(message: UIMessage): boolean {
);
}
function isToolTrace(message: UIMessage | undefined): boolean {
return message?.kind === "trace";
}
export function pruneReasoningOnlyPlaceholders(prev: UIMessage[]): UIMessage[] {
return prev.filter((message, index) => {
if (!isReasoningOnlyPlaceholder(message)) return true;
// A reasoning-only assistant row immediately followed by tool traces is
// the live equivalent of a persisted assistant tool-call message with
// empty content, reasoning_content, and tool_calls. Keep it so live render
// and history replay stay isomorphic.
return isToolTrace(prev[index + 1]);
});
}
export function stampLastAssistantCompletion(
prev: UIMessage[],
completion: Pick<UIMessage, "latencyMs" | "completedAt" | "usage" | "contextWindowTokens">,
webui/src/tests/thread-messages.test.tsx
+297 -40
View File
@@ -238,6 +238,244 @@ describe("ThreadMessages", () => {
expect(screen.getByText(/working/i)).toBeInTheDocument();
});
it("projects a turn in causal order independently of streaming state", () => {
const turnId = "turn-causal-order";
const messages: UIMessage[] = [
{
id: "u1",
role: "user",
content: "inspect this",
turnId,
turnPhase: "user",
turnSeq: 0,
createdAt: 1,
},
{
id: "a1",
role: "assistant",
content: "I will inspect it.",
turnId,
turnPhase: "answer",
turnSeq: 1,
createdAt: 2,
},
{
id: "a2",
role: "assistant",
content: "Inspection complete.",
turnId,
turnPhase: "answer",
turnSeq: 4,
createdAt: 5,
},
{
id: "t1",
role: "tool",
kind: "trace",
content: "shell()",
traces: ["shell()"],
turnId,
turnPhase: "activity",
turnSeq: 2,
createdAt: 3,
},
{
id: "r1",
role: "assistant",
content: "",
reasoning: "checking output",
turnId,
turnPhase: "reasoning",
turnSeq: 3,
createdAt: 4,
},
];
const units = buildDisplayUnits(messages);
const order = (units: ReturnType<typeof buildDisplayUnits>) => units.map((unit) => (
unit.type === "activity"
? `activity:${unit.messages.map((message) => message.id).join(",")}`
: unit.message.id
));
expect(order(units)).toEqual([
"u1",
"a1",
"activity:t1,r1",
"a2",
]);
const { rerender } = render(
<ThreadMessages messages={messages} isStreaming activeTurnId={turnId} />,
);
const firstAnswer = screen.getByText("I will inspect it.");
const finalAnswer = screen.getByText("Inspection complete.");
const liveActivity = screen.getByRole("button", { name: /working/i });
expect(firstAnswer.compareDocumentPosition(liveActivity) & Node.DOCUMENT_POSITION_FOLLOWING)
.toBeTruthy();
expect(liveActivity.compareDocumentPosition(finalAnswer) & Node.DOCUMENT_POSITION_FOLLOWING)
.toBeTruthy();
rerender(<ThreadMessages messages={messages} isStreaming={false} activeTurnId={null} />);
const completedActivity = screen.getByRole("button", { name: /worked/i });
expect(firstAnswer.compareDocumentPosition(completedActivity) & Node.DOCUMENT_POSITION_FOLLOWING)
.toBeTruthy();
expect(completedActivity.compareDocumentPosition(finalAnswer) & Node.DOCUMENT_POSITION_FOLLOWING)
.toBeTruthy();
});
it("ignores a completed empty answer frame without splitting contiguous activity", () => {
const turnId = "turn-empty-answer-frame";
const segmentId = "activity-1";
const messages: UIMessage[] = [
{
id: "user",
role: "user",
content: "reply ok, then check",
turnId,
turnPhase: "user",
turnSeq: 1,
createdAt: 1,
},
{
id: "reasoning-before",
role: "assistant",
content: "",
reasoning: "Planning confirmation",
activitySegmentId: segmentId,
turnId,
turnPhase: "reasoning",
turnSeq: 3,
createdAt: 2,
},
{
id: "ok",
role: "assistant",
content: "ok",
reasoning: "Preparing first query",
activitySegmentId: segmentId,
turnId,
turnPhase: "answer",
turnSeq: 7,
createdAt: 3,
},
{
id: "first-tool",
role: "tool",
kind: "trace",
content: "first()",
traces: ["first()"],
activitySegmentId: segmentId,
turnId,
turnPhase: "activity",
turnSeq: 9,
createdAt: 4,
},
{
id: "empty-answer-frame",
role: "assistant",
content: "",
isStreaming: false,
turnId,
turnPhase: "answer",
turnSeq: 10,
createdAt: 5,
},
{
id: "second-tool",
role: "tool",
kind: "trace",
content: "second()",
traces: ["second()"],
activitySegmentId: segmentId,
turnId,
turnPhase: "activity",
turnSeq: 12,
createdAt: 6,
},
{
id: "final",
role: "assistant",
content: "finished",
reasoning: "Summarizing result",
activitySegmentId: segmentId,
turnId,
turnPhase: "answer",
turnSeq: 113,
createdAt: 7,
},
];
const units = buildDisplayUnits(messages);
expect(units.map((unit) => (
unit.type === "activity"
? `activity:${unit.messages.map((message) => message.id).join(",")}`
: unit.message.id
))).toEqual([
"user",
"activity:reasoning-before,ok-reasoning",
"ok",
"activity:first-tool,second-tool,final-reasoning",
"final",
]);
expect(units.map((unit) => unit.sourceMessageCount)).toEqual([1, 1, 1, 3, 1]);
render(<ThreadMessages messages={messages} isStreaming={false} />);
const activityShells = screen.getAllByRole("button", { name: /worked/i });
const ok = screen.getByText("ok");
const final = screen.getByText("finished");
expect(activityShells).toHaveLength(2);
expect(activityShells[0].compareDocumentPosition(ok) & Node.DOCUMENT_POSITION_FOLLOWING)
.toBeTruthy();
expect(ok.compareDocumentPosition(activityShells[1]) & Node.DOCUMENT_POSITION_FOLLOWING)
.toBeTruthy();
expect(activityShells[1].compareDocumentPosition(final) & Node.DOCUMENT_POSITION_FOLLOWING)
.toBeTruthy();
});
it("keeps empty frame source counts on the nearest visible unit", () => {
const emptyFrame: UIMessage = {
id: "empty",
role: "assistant",
content: "",
isStreaming: false,
turnPhase: "answer",
createdAt: 2,
};
const answerUnits = buildDisplayUnits([
{ id: "a1", role: "assistant", content: "first", createdAt: 1 },
emptyFrame,
{ id: "a2", role: "assistant", content: "second", createdAt: 3 },
]);
expect(answerUnits).toMatchObject([{
type: "message",
message: { content: "first\n\nsecond" },
sourceMessageCount: 3,
}]);
const emptyTurnUnits = buildDisplayUnits([
{ id: "user", role: "user", content: "hello", createdAt: 1 },
emptyFrame,
]);
expect(emptyTurnUnits).toMatchObject([{
type: "message",
message: { id: "user" },
sourceMessageCount: 2,
}]);
const streamingUnits = buildDisplayUnits([{
...emptyFrame,
id: "streaming-placeholder",
isStreaming: true,
}]);
expect(streamingUnits).toMatchObject([{
type: "activity",
messages: [{ id: "streaming-placeholder" }],
sourceMessageCount: 1,
}]);
});
it("offers a follow-up action for text selected within one completed answer", async () => {
const onQuoteSelection = vi.fn();
render(
@@ -494,7 +732,7 @@ describe("ThreadMessages", () => {
]);
});
it("moves orphan trailing activity before the completed assistant answer", () => {
it("keeps trailing activity after the completed assistant answer", () => {
const messages: UIMessage[] = [
{
id: "r1",
@@ -523,10 +761,9 @@ describe("ThreadMessages", () => {
const units = buildDisplayUnits(messages);
expect(units).toHaveLength(2);
expect(units).toHaveLength(3);
expect(units[0].type === "activity" ? units[0].messages.map((m) => m.id) : []).toEqual([
"r1",
"t1",
]);
expect(units[1]).toMatchObject({
type: "message",
@@ -535,6 +772,9 @@ describe("ThreadMessages", () => {
content: "Let me search the latest data.",
},
});
expect(units[2].type === "activity" ? units[2].messages.map((m) => m.id) : []).toEqual([
"t1",
]);
});
it("only marks the current activity timeline as live while streaming", () => {
@@ -611,7 +851,7 @@ describe("ThreadMessages", () => {
},
];
const units = buildDisplayUnits(messages, true);
const units = buildDisplayUnits(messages);
expect(
units[1].type === "activity" ? units[1].startedAtMs : undefined,
@@ -805,27 +1045,29 @@ describe("ThreadMessages", () => {
},
];
const units = buildDisplayUnits(messages, true);
const units = buildDisplayUnits(messages);
expect(units).toHaveLength(2);
expect(units).toHaveLength(3);
expect(units[0].type === "activity" ? units[0].messages.map((m) => m.id) : []).toEqual([
"t0",
"t1",
]);
expect(units[1]).toMatchObject({
type: "message",
message: { id: "a1", content: "partial answer" },
});
expect(units[2].type === "activity" ? units[2].messages.map((m) => m.id) : []).toEqual([
"t1",
]);
render(<ThreadMessages messages={messages} isStreaming />);
const answer = screen.getByText("partial answer");
const liveActivity = screen.getByRole("button", { name: /working/i });
expect(answer.closest("[data-testid='activity-model-message']")).toBeNull();
expect(liveActivity.compareDocumentPosition(answer) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
expect(answer.compareDocumentPosition(liveActivity) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
});
it("moves late activity before a completed assistant answer", () => {
it("keeps late activity after a completed assistant answer", () => {
const messages: UIMessage[] = [
{
id: "r1",
@@ -855,8 +1097,8 @@ describe("ThreadMessages", () => {
const units = buildDisplayUnits(messages);
expect(units).toHaveLength(2);
expect(units[0].type === "activity" ? units[0].messages.map((m) => m.id) : []).toEqual(["r1", "t1"]);
expect(units).toHaveLength(3);
expect(units[0].type === "activity" ? units[0].messages.map((m) => m.id) : []).toEqual(["r1"]);
expect(units[1]).toMatchObject({
type: "message",
message: {
@@ -864,16 +1106,17 @@ describe("ThreadMessages", () => {
content: "Hong Kong is hot today.",
},
});
expect(units[2].type === "activity" ? units[2].messages.map((m) => m.id) : []).toEqual(["t1"]);
render(<ThreadMessages messages={messages} isStreaming={false} />);
const answer = screen.getByText("Hong Kong is hot today.");
const laterActivity = screen.getByRole("button", { name: /worked/i });
const laterActivity = screen.getAllByRole("button", { name: /worked/i }).at(-1);
expect(laterActivity).toBeTruthy();
expect(laterActivity!.compareDocumentPosition(answer) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
expect(answer.compareDocumentPosition(laterActivity!) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
});
it("does not leave a completed web-search thought below the final answer", () => {
it("keeps completed web-search activity on both sides of an answer", () => {
const messages: UIMessage[] = [
{
id: "user",
@@ -909,13 +1152,14 @@ describe("ThreadMessages", () => {
render(<ThreadMessages messages={messages} isStreaming={false} />);
const thought = screen.getByRole("button", { name: /worked/i });
const activities = screen.getAllByRole("button", { name: /worked/i });
const answer = screen.getByText("知道，IEM Cologne Major 2026 今天开打了。");
expect(thought).toBeTruthy();
expect(thought!.compareDocumentPosition(answer) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
expect(activities).toHaveLength(2);
expect(activities[0].compareDocumentPosition(answer) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
expect(answer.compareDocumentPosition(activities[1]) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
});
it("normalizes completed prior turns while the next user turn is streaming", () => {
it("preserves a completed prior turn's order while the next turn is streaming", () => {
const messages: UIMessage[] = [
{
id: "thought",
@@ -949,18 +1193,20 @@ describe("ThreadMessages", () => {
},
];
const units = buildDisplayUnits(messages, true);
const units = buildDisplayUnits(messages);
expect(units).toHaveLength(3);
expect(units).toHaveLength(4);
expect(units[0].type === "activity" ? units[0].messages.map((m) => m.id) : []).toEqual([
"thought",
"web",
]);
expect(units[1]).toMatchObject({
type: "message",
message: { id: "answer" },
});
expect(units[2]).toMatchObject({
expect(units[2].type === "activity" ? units[2].messages.map((m) => m.id) : []).toEqual([
"web",
]);
expect(units[3]).toMatchObject({
type: "message",
message: { id: "next-user" },
});
@@ -1001,7 +1247,7 @@ describe("ThreadMessages", () => {
},
];
const units = buildDisplayUnits(messages, true);
const units = buildDisplayUnits(messages);
expect(units).toHaveLength(2);
expect(units[0].type === "activity" ? units[0].messages.map((m) => m.id) : []).toEqual([
@@ -1091,7 +1337,7 @@ describe("ThreadMessages", () => {
expect(screen.queryByText("Worked for 0s")).not.toBeInTheDocument();
});
it("keeps all assistant answer slices outside activity with one action set", () => {
it("keeps answer slices on either side of activity in generation order", () => {
const messages: UIMessage[] = [
{
id: "early",
@@ -1116,15 +1362,20 @@ describe("ThreadMessages", () => {
];
const units = buildDisplayUnits(messages);
expect(units).toHaveLength(2);
expect(units[0].type === "activity" ? units[0].messages.map((m) => m.id) : []).toEqual([
expect(units).toHaveLength(3);
expect(units[0]).toMatchObject({
type: "message",
message: { id: "early", content: "starting…" },
sourceMessageCount: 1,
});
expect(units[1].type === "activity" ? units[1].messages.map((m) => m.id) : []).toEqual([
"t1",
]);
expect(units[0].sourceMessageCount).toBe(1);
expect(units[1]).toMatchObject({
expect(units[1].sourceMessageCount).toBe(1);
expect(units[2]).toMatchObject({
type: "message",
message: { id: "early", content: "starting…\n\nfinal reply" },
sourceMessageCount: 2,
message: { id: "late", content: "final reply" },
sourceMessageCount: 1,
});
render(
@@ -1135,7 +1386,7 @@ describe("ThreadMessages", () => {
/>,
);
expect(screen.getAllByRole("button", { name: "Copy" })).toHaveLength(1);
expect(screen.getAllByRole("button", { name: "Copy" })).toHaveLength(2);
expect(screen.getAllByRole("button", { name: "Fork" })).toHaveLength(1);
expect(screen.getByText("starting…").closest("[data-testid='activity-model-message']")).toBeNull();
expect(screen.getByText("final reply").closest("[data-testid='activity-model-message']")).toBeNull();
@@ -1165,25 +1416,30 @@ describe("ThreadMessages", () => {
content: "",
media: [{ kind: "file", url: "/api/media/result.csv", name: "result.csv" }],
turnPhase: "answer",
isStreaming: true,
isStreaming: false,
createdAt: 3,
},
];
const units = buildDisplayUnits(messages);
expect(units).toHaveLength(2);
expect(units[0].type === "activity" ? units[0].messages.map((m) => m.id) : []).toEqual([
expect(units).toHaveLength(3);
expect(units[0]).toMatchObject({
type: "message",
message: { id: "early", content: "generated the file" },
sourceMessageCount: 1,
});
expect(units[1].type === "activity" ? units[1].messages.map((m) => m.id) : []).toEqual([
"t1",
]);
expect(units[1]).toMatchObject({
expect(units[2]).toMatchObject({
type: "message",
message: {
id: "early",
content: "generated the file",
id: "attachment",
content: "",
media: [{ kind: "file", url: "/api/media/result.csv", name: "result.csv" }],
},
sourceMessageCount: 2,
sourceMessageCount: 1,
});
render(<ThreadMessages messages={messages} isStreaming={false} />);
@@ -1230,7 +1486,7 @@ describe("ThreadMessages", () => {
rerender(<ThreadMessages {...props} isStreaming={false} activeTurnId={null} />);
expect(container.querySelectorAll('[data-assistant-footer] [aria-label="Copy"]')).toHaveLength(2);
expect(container.querySelectorAll('[data-assistant-footer] [aria-label="Copy"]')).toHaveLength(3);
expect(container.querySelectorAll('[data-assistant-footer] [aria-label="Fork"]')).toHaveLength(2);
});
@@ -1417,7 +1673,8 @@ describe("ThreadMessages", () => {
.filter(Boolean);
expect(assistantFlags).toEqual([
["a1", true],
["a1", false],
["a2", true],
["a3", true],
]);
});
webui/src/tests/useNanobotStream.test.tsx
+99 -9
View File
@@ -3,6 +3,7 @@ import type { ReactNode } from "react";
import { describe, expect, it, vi } from "vitest";
import { useNanobotStream } from "@/hooks/useNanobotStream";
import { normalizeActivityTimeline } from "@/lib/activity-timeline";
import type { StreamError } from "@/lib/nanobot-client";
import type {
ConnectionStatus,
@@ -1813,6 +1814,84 @@ describe("useNanobotStream", () => {
expect(result.current.messages[2].reasoning).toBe("Second reasoning.");
});
it("preserves closed reasoning slices when the tool trace is unavailable", async () => {
const fake = fakeClient();
const { result } = renderHook(() => useNanobotStream("chat-r8", EMPTY_MESSAGES), {
wrapper: wrap(fake.client),
});
act(() => {
fake.emit("chat-r8", {
event: "reasoning_delta",
chat_id: "chat-r8",
text: "First reasoning.",
turn_id: "turn-r8",
turn_phase: "reasoning",
turn_seq: 1,
});
fake.emit("chat-r8", {
event: "reasoning_end",
chat_id: "chat-r8",
turn_id: "turn-r8",
turn_phase: "reasoning",
turn_seq: 2,
});
fake.emit("chat-r8", {
event: "reasoning_delta",
chat_id: "chat-r8",
text: "Second reasoning.",
turn_id: "turn-r8",
turn_phase: "reasoning",
turn_seq: 3,
});
fake.emit("chat-r8", {
event: "reasoning_end",
chat_id: "chat-r8",
turn_id: "turn-r8",
turn_phase: "reasoning",
turn_seq: 4,
});
fake.emit("chat-r8", {
event: "message",
chat_id: "chat-r8",
text: "Final answer.",
turn_id: "turn-r8",
turn_phase: "answer",
turn_seq: 5,
});
fake.emit("chat-r8", {
event: "turn_end",
chat_id: "chat-r8",
turn_id: "turn-r8",
turn_phase: "complete",
turn_seq: 6,
});
});
await flushStreamFrame();
expect(result.current.messages.map((message) => ({
reasoning: message.reasoning,
content: message.content,
}))).toEqual([
{ reasoning: "First reasoning.", content: "" },
{ reasoning: "Second reasoning.", content: "Final answer." },
]);
const units = normalizeActivityTimeline(result.current.messages);
expect(units).toHaveLength(2);
expect(units[0].type === "activity" ? units[0].messages.map((message) => (
message.reasoning || message.traces?.[0]
)) : []).toEqual([
"First reasoning.",
"Second reasoning.",
]);
expect(units[1]).toMatchObject({
type: "message",
message: { content: "Final answer." },
});
});
it("keeps tool-call reasoning before the matching live tool trace", () => {
const fake = fakeClient();
const { result } = renderHook(() => useNanobotStream("chat-tool-reasoning", EMPTY_MESSAGES), {
@@ -1903,7 +1982,7 @@ describe("useNanobotStream", () => {
});
});
it("prunes reasoning-only placeholders when a turn ends without an answer", () => {
it("preserves reasoning-only output when a turn ends without an answer", () => {
const fake = fakeClient();
const { result } = renderHook(() => useNanobotStream("chat-empty-thinking", EMPTY_MESSAGES), {
wrapper: wrap(fake.client),
@@ -1925,11 +2004,18 @@ describe("useNanobotStream", () => {
});
});
expect(result.current.messages).toHaveLength(0);
expect(result.current.messages).toHaveLength(1);
expect(result.current.messages[0]).toMatchObject({
role: "assistant",
content: "",
reasoning: "thinking without final text",
reasoningStreaming: false,
isStreaming: false,
});
expect(result.current.isStreaming).toBe(false);
});
it("drops stale reasoning-only placeholders before sending the next user turn", () => {
it("keeps earlier reasoning before sending the next user turn", () => {
const fake = fakeClient();
const initialMessages = [
{
@@ -1950,12 +2036,16 @@ describe("useNanobotStream", () => {
result.current.send("fine");
});
expect(result.current.messages).toHaveLength(1);
expect(result.current.messages[0].role).toBe("user");
expect(result.current.messages[0].content).toBe("fine");
expect(result.current.messages[0].turnId).toEqual(expect.any(String));
expect(result.current.messages[0].turnPhase).toBe("user");
expect(result.current.messages[0].deliveryStatus).toBe("sending");
expect(result.current.messages).toHaveLength(2);
expect(result.current.messages[0]).toMatchObject({
role: "assistant",
reasoning: "leftover thinking",
});
expect(result.current.messages[1].role).toBe("user");
expect(result.current.messages[1].content).toBe("fine");
expect(result.current.messages[1].turnId).toEqual(expect.any(String));
expect(result.current.messages[1].turnPhase).toBe("user");
expect(result.current.messages[1].deliveryStatus).toBe("sending");
});
it("returns the submitted turn identity used by the optimistic row and wire frame", () => {