peanut
bdb4fd8c8e
- 新增 MarkdownPreview 组件，支持 AI 测试输出 Markdown 渲染 - Coze 适配器优化：支持流式响应、工作流接口调用、SSE事件处理 - Dify 适配器优化：支持停止接口、流式聊天、SSE事件解析 - web-admin 添加 markdown-it 和 highlight.js 依赖 - AI 配置列表页面优化测试对话框输出显示 Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
63 lines
2.5 KiB
Markdown
63 lines
2.5 KiB
Markdown
# AI Test Output Rendering Fix Implementation Plan
|
|
|
|
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
|
|
|
**Goal:** Make AI endpoint tests stream parsed正文 and render Markdown in the web-admin test dialogs.
|
|
|
|
**Architecture:** Normalize provider stream deltas in backend adapters, add a frontend SSE/display fallback, and replace raw `<pre>` output blocks with a reusable Markdown preview. Keep request shapes and existing AI runtime APIs unchanged.
|
|
|
|
**Tech Stack:** Spring Boot, Fastjson2, Vue 3, Element Plus, markdown-it.
|
|
|
|
---
|
|
|
|
### Task 1: Backend Stream Text Normalization
|
|
|
|
**Files:**
|
|
- Modify: `backend-single/src/main/java/com/emotion/service/ai/CozeProviderAdapter.java`
|
|
- Modify: `backend-single/src/main/java/com/emotion/service/ai/DifyProviderAdapter.java`
|
|
|
|
- [x] Add a private helper that parses JSON string wrappers and returns `output`, `answer`, `content`, `text`, `result`, `data.*`, or `outputs.*`.
|
|
- [x] Call the helper before returning every extracted delta string.
|
|
- [x] Keep non-JSON Markdown/plain text unchanged.
|
|
|
|
### Task 2: Frontend Stream Parsing Fallback
|
|
|
|
**Files:**
|
|
- Modify: `web-admin/src/api/aiconfig.ts`
|
|
|
|
- [x] Add a `normalizeAiText` helper mirroring backend wrapper extraction.
|
|
- [x] Apply it before appending `delta.content` in `fetchSseStream`.
|
|
- [x] Preserve the current callback signature.
|
|
|
|
### Task 3: Markdown Preview Component
|
|
|
|
**Files:**
|
|
- Modify: `web-admin/package.json`
|
|
- Modify: `web-admin/package-lock.json`
|
|
- Create: `web-admin/src/components/MarkdownPreview.vue`
|
|
|
|
- [x] Add `markdown-it` and its TypeScript types.
|
|
- [x] Create a scoped Markdown renderer with safe defaults (`html: false`, `breaks: true`, `linkify: true`).
|
|
- [x] Style headings, paragraphs, lists, code blocks, tables, and blockquotes for the existing dark admin theme.
|
|
|
|
### Task 4: Test Dialog Output UX
|
|
|
|
**Files:**
|
|
- Modify: `web-admin/src/views/aiconfig/AiRoutingList.vue`
|
|
|
|
- [x] Import and use `MarkdownPreview`.
|
|
- [x] Replace raw test `<pre>` blocks with scrollable output panels.
|
|
- [x] Parse non-stream and stream result output before display.
|
|
- [x] Auto-scroll output panels when stream text updates.
|
|
|
|
### Task 5: Verification
|
|
|
|
**Commands:**
|
|
- `cd web-admin && npm run build`
|
|
- `cd backend-single && mvn test`
|
|
- `git diff --check`
|
|
|
|
- [x] Build passes.
|
|
- [x] Backend tests pass.
|
|
- [x] Diff check has no new whitespace errors beyond existing line-ending warnings.
|