mirror of
https://github.com/bytedance/deer-flow.git
synced 2026-08-12 15:59:04 +00:00
* feat(frontend): add structured human input cards for ask_clarification Implement a reusable Human Input Card flow for ask_clarification while keeping the existing text fallback for older clients and IM channels. Backend: - Add structured ToolMessage.artifact.human_input payloads for clarification requests. - Preserve ToolMessage.content as the readable Markdown/text fallback. - Normalize clarification options from native lists, JSON strings, plain strings, mixed scalar values, None, and missing options. - Derive input_mode as choice_with_other when options exist, otherwise free_text. - Keep disable_clarification non-interactive behavior as a plain ToolMessage with no human_input artifact. - Cover artifact persistence and Gateway message metadata preservation in tests. Frontend: - Add human input protocol types, runtime guards, extractors, response builders, and thread-state helpers. - Add reusable HumanInputCard with option buttons, free-text input, pending, read-only, disabled, and answered states. - Render structured clarification cards from artifact.human_input, with Markdown fallback for malformed or legacy tool messages. - Preserve line breaks in structured question/context/option text. - Hide submitted clarification bridge messages from the chat UI via additional_kwargs.hide_from_ui. - Send structured human_input_response metadata through the fourth sendMessage options argument, preserving run context in the third argument. - Wire submissions for normal chats, custom agent chats, agent bootstrap chats, and sidecar chats. - Derive answered state from raw thread.messages so hidden replies still update the original card. - Clear pending state when the hidden reply arrives, dispatch is dropped, or a later async stream failure appears on thread.error. * perf(frontend): optimize HumanInputCard UI interactions - Support Enter key to submit text input (Shift+Enter for newline) - Render question and context fields as Markdown instead of plain text - Replace deprecated FormEventHandler type with structural typing * test(frontend): add unit test cover optimize HumanInputCard UI interactions * feat(frontend): disabled chatbox when has new human-input-card * fix(style): lint error fix * fix: sanitize hidden human input replies - Preserve IME composition safety for human input card Enter submits - Treat hidden human input responses as genuine user messages for sanitization - Keep hidden card replies in memory filtering while excluding malformed/internal hidden messages - Add regression coverage for card IME handling and hidden reply sanitization * fix: tighten human input response validation - Reject empty hidden human input response values - Remove invalid list ARIA role from human input card options - Add backend coverage for empty response payloads --------- Co-authored-by: Willem Jiang <willem.jiang@gmail.com>
224 lines
5.9 KiB
TypeScript
224 lines
5.9 KiB
TypeScript
import type { Message } from "@langchain/langgraph-sdk";
|
|
import { expect, test } from "@rstest/core";
|
|
|
|
import {
|
|
buildHumanInputResponseText,
|
|
createHumanInputOptionResponse,
|
|
createHumanInputTextResponse,
|
|
deriveHumanInputThreadState,
|
|
extractHumanInputRequest,
|
|
extractHumanInputResponse,
|
|
hasOpenHumanInputRequest,
|
|
shouldClearPendingHumanInputOnThreadError,
|
|
} from "@/core/messages/human-input";
|
|
|
|
const requestPayload = {
|
|
version: 1,
|
|
kind: "human_input_request",
|
|
source: "ask_clarification",
|
|
request_id: "clarification:call-abc",
|
|
tool_call_id: "call-abc",
|
|
clarification_type: "approach_choice",
|
|
question: "Which environment should I deploy to?",
|
|
context: "Need the target environment.",
|
|
input_mode: "choice_with_other",
|
|
options: [
|
|
{ id: "option-1", label: "development", value: "development" },
|
|
{ id: "option-2", label: "staging", value: "staging" },
|
|
],
|
|
};
|
|
|
|
test("extractHumanInputRequest reads a valid tool artifact payload", () => {
|
|
const message = {
|
|
type: "tool",
|
|
name: "ask_clarification",
|
|
content: "fallback",
|
|
artifact: {
|
|
human_input: requestPayload,
|
|
},
|
|
} as unknown as Message;
|
|
|
|
expect(extractHumanInputRequest(message)).toEqual(requestPayload);
|
|
});
|
|
|
|
test("extractHumanInputRequest rejects malformed artifacts", () => {
|
|
const message = {
|
|
type: "tool",
|
|
name: "ask_clarification",
|
|
content: "fallback",
|
|
artifact: {
|
|
human_input: {
|
|
...requestPayload,
|
|
options: [{ id: "option-1", label: "missing value" }],
|
|
},
|
|
},
|
|
} as unknown as Message;
|
|
|
|
expect(extractHumanInputRequest(message)).toBeNull();
|
|
});
|
|
|
|
test("extractHumanInputResponse reads valid human message metadata", () => {
|
|
const response = {
|
|
version: 1,
|
|
kind: "human_input_response",
|
|
source: "ask_clarification",
|
|
request_id: "clarification:call-abc",
|
|
response_kind: "option",
|
|
option_id: "option-2",
|
|
value: "staging",
|
|
};
|
|
const message = {
|
|
type: "human",
|
|
content: "For your clarification, my answer is: staging",
|
|
additional_kwargs: {
|
|
hide_from_ui: true,
|
|
human_input_response: response,
|
|
},
|
|
} as unknown as Message;
|
|
|
|
expect(extractHumanInputResponse(message)).toEqual(response);
|
|
});
|
|
|
|
test("derives answered card state from hidden human input responses", () => {
|
|
const response = {
|
|
version: 1,
|
|
kind: "human_input_response",
|
|
source: "ask_clarification",
|
|
request_id: "clarification:call-abc",
|
|
response_kind: "option",
|
|
option_id: "option-2",
|
|
value: "staging",
|
|
};
|
|
const state = deriveHumanInputThreadState([
|
|
{
|
|
type: "tool",
|
|
name: "ask_clarification",
|
|
content: "fallback",
|
|
artifact: {
|
|
human_input: requestPayload,
|
|
},
|
|
} as unknown as Message,
|
|
{
|
|
type: "human",
|
|
content: "For your clarification, my answer is: staging",
|
|
additional_kwargs: {
|
|
hide_from_ui: true,
|
|
human_input_response: response,
|
|
},
|
|
} as unknown as Message,
|
|
]);
|
|
|
|
expect(state.answeredResponses.get("clarification:call-abc")).toEqual(
|
|
response,
|
|
);
|
|
expect(state.latestOpenRequestId).toBeNull();
|
|
});
|
|
|
|
test("detects whether a thread has an open human input request", () => {
|
|
const requestMessage = {
|
|
type: "tool",
|
|
name: "ask_clarification",
|
|
content: "fallback",
|
|
artifact: {
|
|
human_input: requestPayload,
|
|
},
|
|
} as unknown as Message;
|
|
const responseMessage = {
|
|
type: "human",
|
|
content: "For your clarification, my answer is: staging",
|
|
additional_kwargs: {
|
|
hide_from_ui: true,
|
|
human_input_response: {
|
|
version: 1,
|
|
kind: "human_input_response",
|
|
source: "ask_clarification",
|
|
request_id: "clarification:call-abc",
|
|
response_kind: "option",
|
|
option_id: "option-2",
|
|
value: "staging",
|
|
},
|
|
},
|
|
} as unknown as Message;
|
|
|
|
expect(hasOpenHumanInputRequest([requestMessage])).toBe(true);
|
|
expect(hasOpenHumanInputRequest([requestMessage, responseMessage])).toBe(
|
|
false,
|
|
);
|
|
});
|
|
|
|
test("detects new thread errors that should unlock pending human input cards", () => {
|
|
const previousError = new Error("old failure");
|
|
const currentError = new Error("stream failed");
|
|
|
|
expect(
|
|
shouldClearPendingHumanInputOnThreadError({
|
|
currentError,
|
|
pendingRequestCount: 1,
|
|
previousError: undefined,
|
|
}),
|
|
).toBe(true);
|
|
expect(
|
|
shouldClearPendingHumanInputOnThreadError({
|
|
currentError,
|
|
pendingRequestCount: 0,
|
|
previousError: undefined,
|
|
}),
|
|
).toBe(false);
|
|
expect(
|
|
shouldClearPendingHumanInputOnThreadError({
|
|
currentError: previousError,
|
|
pendingRequestCount: 1,
|
|
previousError,
|
|
}),
|
|
).toBe(false);
|
|
expect(
|
|
shouldClearPendingHumanInputOnThreadError({
|
|
currentError: undefined,
|
|
pendingRequestCount: 1,
|
|
previousError: currentError,
|
|
}),
|
|
).toBe(false);
|
|
});
|
|
|
|
test("creates option and text responses for a request", () => {
|
|
const request = extractHumanInputRequest({
|
|
type: "tool",
|
|
name: "ask_clarification",
|
|
content: "fallback",
|
|
artifact: {
|
|
human_input: requestPayload,
|
|
},
|
|
} as unknown as Message);
|
|
|
|
expect(request).not.toBeNull();
|
|
const optionResponse = createHumanInputOptionResponse(
|
|
request!,
|
|
request!.options![1]!,
|
|
);
|
|
const textResponse = createHumanInputTextResponse(
|
|
request!,
|
|
"Use blue-green deployment",
|
|
);
|
|
|
|
expect(optionResponse).toEqual({
|
|
version: 1,
|
|
kind: "human_input_response",
|
|
source: "ask_clarification",
|
|
request_id: "clarification:call-abc",
|
|
response_kind: "option",
|
|
option_id: "option-2",
|
|
value: "staging",
|
|
});
|
|
expect(textResponse).toEqual({
|
|
version: 1,
|
|
kind: "human_input_response",
|
|
source: "ask_clarification",
|
|
request_id: "clarification:call-abc",
|
|
response_kind: "text",
|
|
value: "Use blue-green deployment",
|
|
});
|
|
expect(buildHumanInputResponseText(request!, optionResponse)).toBe(
|
|
'For your clarification "Which environment should I deploy to?", my answer is: staging',
|
|
);
|
|
});
|