Polish WebUI streaming and provider settings

webui/src/tests/markdown-text.test.tsx

@@ -0,0 +1,82 @@
+import { act, render, screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+
+import { MarkdownText } from "@/components/MarkdownText";
+
+const rendererSpy = vi.hoisted(() => vi.fn());
+
+vi.mock("@/components/MarkdownTextRenderer", () => ({
+  default: ({
+    children,
+    highlightCode,
+  }: {
+    children: string;
+    highlightCode?: boolean;
+  }) => {
+    rendererSpy({ children, highlightCode });
+    return (
+      <div
+        data-testid="markdown-renderer"
+        data-highlight-code={String(highlightCode)}
+      >
+        {children}
+      </div>
+    );
+  },
+}));
+
+describe("MarkdownText", () => {
+  it("throttles streaming markdown commits and flushes before final highlighting", async () => {
+    rendererSpy.mockClear();
+    vi.useFakeTimers();
+    try {
+      const { rerender } = render(
+        <MarkdownText streaming>hello</MarkdownText>,
+      );
+
+      await act(async () => {
+        await Promise.resolve();
+        await Promise.resolve();
+      });
+
+      expect(screen.getByTestId("markdown-renderer")).toHaveTextContent("hello");
+      expect(screen.getByTestId("markdown-renderer")).toHaveAttribute(
+        "data-highlight-code",
+        "false",
+      );
+      expect(rendererSpy).toHaveBeenCalledTimes(1);
+
+      rerender(<MarkdownText streaming>hello world</MarkdownText>);
+      expect(screen.getByTestId("markdown-renderer")).toHaveTextContent("hello");
+      expect(rendererSpy).toHaveBeenCalledTimes(1);
+
+      act(() => {
+        vi.advanceTimersByTime(79);
+      });
+      expect(screen.getByTestId("markdown-renderer")).toHaveTextContent("hello");
+      expect(rendererSpy).toHaveBeenCalledTimes(1);
+
+      act(() => {
+        vi.advanceTimersByTime(1);
+      });
+      await act(async () => {
+        await Promise.resolve();
+      });
+
+      expect(screen.getByTestId("markdown-renderer")).toHaveTextContent("hello world");
+      expect(rendererSpy).toHaveBeenCalledTimes(2);
+
+      rerender(<MarkdownText streaming>hello world!!!</MarkdownText>);
+      expect(screen.getByTestId("markdown-renderer")).toHaveTextContent("hello world");
+
+      rerender(<MarkdownText>hello world!!!</MarkdownText>);
+      expect(screen.getByTestId("markdown-renderer")).toHaveTextContent("hello world!!!");
+      expect(screen.getByTestId("markdown-renderer")).toHaveAttribute(
+        "data-highlight-code",
+        "true",
+      );
+    } finally {
+      vi.useRealTimers();
+    }
+  });
+});