diff options
| -rw-r--r-- | src/features/chat/ui.test.ts | 34 | ||||
| -rw-r--r-- | src/features/chat/ui/ChatView.svelte | 2 |
2 files changed, 35 insertions, 1 deletions
diff --git a/src/features/chat/ui.test.ts b/src/features/chat/ui.test.ts index c4793a0..aebb97c 100644 --- a/src/features/chat/ui.test.ts +++ b/src/features/chat/ui.test.ts @@ -155,6 +155,40 @@ describe("ChatView", () => { expect(log).toBeInTheDocument(); expect(log.children).toHaveLength(0); }); + + it("thinking <details> stays open across a streaming update", async () => { + const initial: RenderedChunk[] = [ + { + seq: null, + role: "assistant", + chunk: { type: "thinking", text: "Let me think..." }, + provisional: true, + }, + ]; + + const { rerender } = render(ChatView, { props: { chunks: initial } }); + + const details = screen.getByText("Thinking").closest("details"); + expect(details).not.toBeNull(); + expect(details).not.toHaveAttribute("open"); + if (details) details.open = true; + expect(details).toHaveAttribute("open"); + + const updated: RenderedChunk[] = [ + { + seq: null, + role: "assistant", + chunk: { type: "thinking", text: "Let me think... step by step" }, + provisional: true, + }, + ]; + await rerender({ chunks: updated }); + + const detailsAfter = screen.getByText("Thinking").closest("details"); + expect(detailsAfter).not.toBeNull(); + expect(detailsAfter).toHaveAttribute("open"); + expect(detailsAfter).toHaveTextContent("Let me think... step by step"); + }); }); describe("Composer", () => { diff --git a/src/features/chat/ui/ChatView.svelte b/src/features/chat/ui/ChatView.svelte index a7c39cc..ce66798 100644 --- a/src/features/chat/ui/ChatView.svelte +++ b/src/features/chat/ui/ChatView.svelte @@ -5,7 +5,7 @@ </script> <div class="chat-transcript" role="log" aria-live="polite"> - {#each chunks as rendered (rendered)} + {#each chunks as rendered, i (rendered.seq != null ? `c${rendered.seq}` : `p${i}`)} <article class="message message--{rendered.role}" class:message--provisional={rendered.provisional} |