@copilotkit/vue 2.0.0-rc.20 → 2.0.0-rc.21

package/src/v2/components/chat/__tests__/CopilotPopupView.test.ts

@@ -115,6 +115,25 @@ describe("CopilotPopupView", () => {
     expect(reopened.find("[data-copilot-popup]").exists()).toBe(false);
   });
 
+  it("stays open for a pointer down in a chat popover outside the panel", async () => {
+    const wrapper = mountPopupView({ clickOutsideToClose: true });
+    // Popovers, such as a reply rating's comment, render in a portal.
+    const popover = document.createElement("div");
+    popover.setAttribute("data-copilotkit-popover", "");
+    const field = document.createElement("textarea");
+    popover.append(field);
+    document.body.append(popover);
+
+    field.dispatchEvent(new Event("pointerdown", { bubbles: true }));
+    await nextTick();
+    vi.advanceTimersByTime(200);
+    await nextTick();
+
+    expect(wrapper.find("[data-copilot-popup]").exists()).toBe(true);
+    popover.remove();
+    wrapper.unmount();
+  });
+
   it("ignores outside-close detection when the toggle button is clicked and supports custom slots", async () => {
     const wrapper = mountPopupView(
       {

package/src/v2/components/chat/__tests__/CopilotSidebarView.position.test.ts

@@ -1,4 +1,4 @@
-import { describe, expect, it } from "vitest";
+import { afterEach, describe, expect, it } from "vitest";
 import { h } from "vue";
 import { mount } from "@vue/test-utils";
 import type { Message } from "@ag-ui/core";
@@ -22,21 +22,31 @@ function cssRule(selector: string): string {
   return stylesheet.slice(body, stylesheet.indexOf("}", body));
 }
 
+/** Mounted sidebars. Only one docked sidebar may own the page margin. */
+const mounted: { unmount: () => void }[] = [];
+afterEach(() => {
+  for (const wrapper of mounted.splice(0)) wrapper.unmount();
+});
+
 function mountSidebarView(props: Record<string, unknown> = {}) {
-  return mount(CopilotKitProvider, {
+  const wrapper = mount(CopilotKitProvider, {
     props: { runtimeUrl: "/api/copilotkit" },
     slots: {
       default: () =>
         h(CopilotSidebarView, { messages: sampleMessages, ...props }),
     },
   });
+  mounted.push(wrapper);
+  return wrapper;
 }
 
 function mountSidebar(props: Record<string, unknown> = {}) {
-  return mount(CopilotKitProvider, {
+  const wrapper = mount(CopilotKitProvider, {
     props: { agents__unsafe_dev_only: { default: new StateCapturingAgent() } },
     slots: { default: () => h(CopilotSidebar, props) },
   });
+  mounted.push(wrapper);
+  return wrapper;
 }
 
 describe("CopilotSidebarView position prop", () => {
@@ -87,12 +97,26 @@ describe("CopilotSidebarView position prop", () => {
     });
 
     it("makes room for the sidebar on the edge it docks to", () => {
-      const left = mountSidebarView({ position: "left", width: 400 });
-      expect(left.html()).toContain("margin-inline-start: 400px");
-      expect(left.html()).not.toContain("margin-inline-end");
+      const body = document.body.style;
+      mountSidebarView({ position: "left", width: 400 });
+      expect(body.marginInlineStart).toBe("400px");
+      expect(body.marginInlineEnd).toBe("");
+      mounted.pop()?.unmount();
+
+      mountSidebarView({ width: 400 });
+      expect(body.marginInlineEnd).toBe("400px");
+    });
+
+    it("gives the page its own margins back on unmount", () => {
+      const body = document.body.style;
+      body.marginInlineEnd = "16px";
+      mountSidebarView({ width: 400 });
+      expect(body.marginInlineEnd).toBe("400px");
+
+      mounted.pop()?.unmount();
 
-      const right = mountSidebarView({ width: 400 });
-      expect(right.html()).toContain("margin-inline-end: 400px");
+      expect(body.marginInlineEnd).toBe("16px");
+      body.marginInlineEnd = "";
     });
   });
 

package/src/v2/components/chat/__tests__/CopilotSidebarView.test.ts

@@ -91,7 +91,8 @@ describe("CopilotSidebarView", () => {
     const sidebar = wrapper.get("[data-copilot-sidebar]");
     expect(sidebar.attributes("aria-hidden")).toBe("false");
     expect(sidebar.attributes("style")).toContain("--sidebar-width: 612px");
-    expect(wrapper.html()).toContain("margin-inline-end: 612px");
+    expect(document.body.style.marginInlineEnd).toBe("612px");
+    wrapper.unmount();
   });
 
   it("applies explicit width and renders default header and toggle button", () => {

package/src/v2/components/chat/__tests__/StreamingMarkdownDefault.test.ts

@@ -0,0 +1,54 @@
+import { describe, it, expect } from "vitest";
+import { render, fireEvent } from "@testing-library/vue";
+import StreamingMarkdownDefault from "../StreamingMarkdownDefault.vue";
+
+function renderDefault(props: Record<string, unknown>) {
+  return render(StreamingMarkdownDefault, { props }).container;
+}
+
+describe("StreamingMarkdownDefault (vue)", () => {
+  it("renders nothing for empty content", () => {
+    expect(renderDefault({ content: "" }).innerHTML).toBe("<!--v-if-->");
+  });
+
+  it("renders fenced code with the shared code block class", () => {
+    const pre = renderDefault({ content: "```ts\nx\n```" }).querySelector(
+      "pre",
+    );
+    expect(pre?.classList.contains("cpk-markdown-code-block")).toBe(true);
+    expect(pre?.querySelector("code")?.getAttribute("data-code-info")).toBe(
+      "ts",
+    );
+  });
+
+  it("shows the caret only while streaming", () => {
+    const caret = "[data-streaming-markdown-caret]";
+    expect(
+      renderDefault({ content: "Hi", isStreaming: true }).querySelector(caret),
+    ).not.toBeNull();
+    expect(renderDefault({ content: "Hi" }).querySelector(caret)).toBeNull();
+  });
+
+  it("passes link and citation clicks to the callbacks", async () => {
+    const calls: string[] = [];
+    const container = renderDefault({
+      content:
+        "[link](https://example.com) cite [^ref]\n\n[^ref]: Ref https://example.org",
+      onLinkClick: (event: MouseEvent, url: string) => {
+        event.preventDefault();
+        calls.push(`link:${url}`);
+      },
+      onCitationClick: (event: MouseEvent, citation: { id: string }) => {
+        event.preventDefault();
+        calls.push(`cite:${citation.id}`);
+      },
+    });
+    await fireEvent.click(
+      container.querySelector('a[href="https://example.com"]')!,
+    );
+    await fireEvent.click(
+      container.querySelector('sup a[role="doc-noteref"]')!,
+    );
+    expect(calls).toEqual(["link:https://example.com", "cite:ref"]);
+  });
+});

package/src/v2/components/chat/audioRecorder.ts

@@ -1,11 +1,8 @@
-export type AudioRecorderState = "idle" | "recording" | "processing";
+import type { ɵAudioRecorderState } from "@copilotkit/core";
 
-export class AudioRecorderError extends Error {
-  constructor(message: string) {
-    super(message);
-    this.name = "AudioRecorderError";
-  }
-}
+export type AudioRecorderState = ɵAudioRecorderState;
+
+export { ɵAudioRecorderError as AudioRecorderError } from "@copilotkit/core";
 
 export interface CopilotChatAudioRecorderRef {
   state: AudioRecorderState;

package/src/v2/components/chat/copilotChatToolCallItemRender.ts

@@ -1,95 +1,46 @@
-import type { Message, ToolCall, ToolMessage } from "@ag-ui/core";
-import { contentToText } from "@ag-ui/core";
-import { DEFAULT_AGENT_ID } from "@copilotkit/shared";
-import { ToolCallStatus, ɵresolveToolCallRenderer } from "@copilotkit/core";
-import { partialJSONParse } from "@copilotkit/shared";
+import type { Message, ToolCall } from "@ag-ui/core";
+import {
+  ɵbuildToolCallRenderProps,
+  ɵfindToolMessage,
+  ɵresolveToolCallAgentId,
+  ɵresolveToolCallRenderer,
+} from "@copilotkit/core";
 import type { CopilotChatToolCallRenderSlotProps } from "./types";
 import type {
   VueToolCallRenderer,
   VueToolCallRendererRenderProps,
 } from "../../types";
 
-export function findToolMessage(
-  messages: Message[],
-  toolCallId: string,
-): ToolMessage | undefined {
-  return messages.find(
-    (message) =>
-      message.role === "tool" &&
-      (message as ToolMessage).toolCallId === toolCallId,
-  ) as ToolMessage | undefined;
-}
-
 export function getToolCallSlotName(toolName: string): `tool-call-${string}` {
   return `tool-call-${toolName}`;
 }
 
+/** Props for a `tool-call` / `tool-call-<name>` slot. */
 export function getToolCallRenderProps(
   toolCall: ToolCall,
   messages: Message[],
   executingToolCallIds: ReadonlySet<string>,
 ): CopilotChatToolCallRenderSlotProps {
-  const toolMessage = findToolMessage(messages, toolCall.id);
-  const parsedArgs = partialJSONParse(toolCall.function.arguments);
-
-  if (toolMessage) {
-    return {
-      name: toolCall.function.name,
-      args: parsedArgs,
-      status: ToolCallStatus.Complete,
-      result: contentToText(toolMessage.content),
-      toolCall,
-      toolMessage,
-    };
-  }
-
-  const isExecuting = executingToolCallIds.has(toolCall.id);
-  return {
-    name: toolCall.function.name,
-    args: parsedArgs,
-    status: isExecuting ? ToolCallStatus.Executing : ToolCallStatus.InProgress,
-    result: undefined,
+  const toolMessage = ɵfindToolMessage(messages, toolCall.id);
+  const { name, args, status, result } = ɵbuildToolCallRenderProps(
     toolCall,
-    toolMessage: undefined,
-  };
+    toolMessage,
+    { isExecuting: executingToolCallIds.has(toolCall.id) },
+  );
+  return { name, args, status, result, toolCall, toolMessage };
 }
 
+/** Props for a registered renderer's `render`. */
 export function getCoreRenderProps(
   toolCall: ToolCall,
   messages: Message[],
   executingToolCallIds: ReadonlySet<string>,
 ): VueToolCallRendererRenderProps<unknown> {
-  const toolMessage = findToolMessage(messages, toolCall.id);
-  const parsedArgs = partialJSONParse(toolCall.function.arguments);
-
-  if (toolMessage) {
-    return {
-      name: toolCall.function.name,
-      toolCallId: toolCall.id,
-      args: parsedArgs,
-      status: ToolCallStatus.Complete,
-      result: contentToText(toolMessage.content),
-    };
-  }
-
-  const isExecuting = executingToolCallIds.has(toolCall.id);
-  if (isExecuting) {
-    return {
-      name: toolCall.function.name,
-      toolCallId: toolCall.id,
-      args: parsedArgs,
-      status: ToolCallStatus.Executing,
-      result: undefined,
-    };
-  }
-
-  return {
-    name: toolCall.function.name,
-    toolCallId: toolCall.id,
-    args: parsedArgs && typeof parsedArgs === "object" ? parsedArgs : {},
-    status: ToolCallStatus.InProgress,
-    result: undefined,
-  };
+  return ɵbuildToolCallRenderProps(
+    toolCall,
+    ɵfindToolMessage(messages, toolCall.id),
+    { isExecuting: executingToolCallIds.has(toolCall.id) },
+  );
 }
 
 export function getToolCallMemoDeps(
@@ -97,13 +48,13 @@ export function getToolCallMemoDeps(
   messages: Message[],
   executingToolCallIds: ReadonlySet<string>,
   renderToolCalls: readonly VueToolCallRenderer<unknown>[],
-  agentId: string = DEFAULT_AGENT_ID,
+  agentId: string = ɵresolveToolCallAgentId(undefined, undefined),
 ): unknown[] {
   return [
     toolCall.id,
     toolCall.function.name,
     toolCall.function.arguments,
-    findToolMessage(messages, toolCall.id)?.content,
+    ɵfindToolMessage(messages, toolCall.id)?.content,
     executingToolCallIds.has(toolCall.id),
     ɵresolveToolCallRenderer(renderToolCalls, toolCall.function.name, agentId)
       ?.render,

package/src/v2/components/chat/tool-call-display-context.ts

@@ -1,5 +1,8 @@
 import type { ComputedRef, InjectionKey } from "vue";
-import type { ɵToolCallDisplayContextValue } from "@copilotkit/core";
+import type {
+  ɵToolCallDisplayContextValue,
+  ɵToolCallRowStatus,
+} from "@copilotkit/core";
 
 /**
  * Provided by the message view so each message's tool calls follow the view's
@@ -18,6 +21,8 @@ export const ToolCallDisplayContextKey: InjectionKey<
 export interface ToolCallGroupContextValue {
   appearance: "card" | "line" | "stack";
   failedIds: ReadonlySet<string>;
+  /** Each call's row status, by call id. */
+  statusById: ReadonlyMap<string, ɵToolCallRowStatus>;
   /** The agent may still finish the group's calls; see `isActive`. */
   active: boolean;
 }

package/src/v2/components/chat/tool-call-group-parts.ts

@@ -1,6 +1,8 @@
 import { defineComponent, h, onMounted, ref, watch } from "vue";
 import type { PropType } from "vue";
 import {
+  ɵTOOL_CALL_STATUS_ICONS,
+  ɵTOOL_CALL_STATUS_LABEL_KEYS,
   ɵcountFailedToolCalls,
   ɵformatLabel,
   ɵgetArgumentPreview,
@@ -11,13 +13,7 @@ import type {
   ToolCallEntry,
   ɵToolCallRowStatus,
 } from "@copilotkit/core";
-import {
-  IconCheck,
-  IconChevronRight,
-  IconCircle,
-  IconLoader2,
-  IconX,
-} from "../icons";
+import { CopilotIcon, IconChevronRight } from "../icons";
 import { useCopilotId } from "../ui/use-id";
 import { useChatLabels } from "./use-chat-labels";
 
@@ -29,16 +25,7 @@ export function toolCallStatusLabel(
   labels: Readonly<CopilotChatLabels>,
   status: ɵToolCallRowStatus,
 ) {
-  switch (status) {
-    case "running":
-      return labels.toolCallStatusRunningLabel;
-    case "done":
-      return labels.toolCallStatusDoneLabel;
-    case "failed":
-      return labels.toolCallStatusFailedLabel;
-    case "stopped":
-      return labels.toolCallStatusStoppedLabel;
-  }
+  return labels[ɵTOOL_CALL_STATUS_LABEL_KEYS[status]];
 }
 
 /**
@@ -83,22 +70,15 @@ export const ToolCallStatusIcon = defineComponent({
   },
   setup(props) {
     return () =>
-      h(
-        {
-          running: IconLoader2,
-          done: IconCheck,
-          failed: IconX,
-          stopped: IconCircle,
-        }[props.status],
-        {
-          "aria-hidden": "true",
-          class: [
-            "cpk-tool-call-status-icon",
-            props.status === "running" && "cpk-tool-call-status-icon-running",
-            props.status === "failed" && "cpk-tool-call-status-icon-failed",
-          ],
-        },
-      );
+      h(CopilotIcon, {
+        name: ɵTOOL_CALL_STATUS_ICONS[props.status],
+        "aria-hidden": "true",
+        class: [
+          "cpk-tool-call-status-icon",
+          props.status === "running" && "cpk-tool-call-status-icon-running",
+          props.status === "failed" && "cpk-tool-call-status-icon-failed",
+        ],
+      });
   },
 });
 

package/src/v2/components/chat/types.ts

@@ -21,7 +21,7 @@ import type {
   ToolCallEntry,
 } from "@copilotkit/core";
 import type { InterruptEvent } from "../../types";
-import type { AutoScrollMode } from "./normalize-auto-scroll";
+import type { ɵAutoScrollMode as AutoScrollMode } from "@copilotkit/core";
 
 export type CopilotChatInputMode = "input" | "transcribe" | "processing";
 export type { Attachment, AttachmentsConfig, AttachmentModality };

package/src/v2/components/chat/use-lightbox.ts

@@ -1,12 +1,7 @@
 import { nextTick, ref } from "vue";
+import { ɵmorphViewTransition } from "@copilotkit/core";
 import { useCopilotId } from "../ui/use-id";
 
-type DocWithVT = Document & {
-  startViewTransition?: (cb: () => void | Promise<void>) => {
-    finished: Promise<void>;
-  };
-};
-
 /**
  * Opens and closes a lightbox, using the View Transition API to morph the
  * thumbnail into the full-screen content, as React's `useLightbox`.
@@ -24,40 +19,27 @@ export function useLightbox() {
   const vtName = useCopilotId("cpk-lightbox").replace(/[^\w-]/g, "-");
 
   const openLightbox = () => {
-    const thumb = thumbnailRef.value;
-    const doc =
-      typeof document === "undefined" ? undefined : (document as DocWithVT);
-
-    if (doc?.startViewTransition && thumb) {
-      thumb.style.viewTransitionName = vtName;
-      doc.startViewTransition(async () => {
-        thumb.style.viewTransitionName = "";
+    ɵmorphViewTransition(
+      thumbnailRef.value,
+      vtName,
+      async () => {
         open.value = true;
         await nextTick();
-      });
-    } else {
-      open.value = true;
-    }
+      },
+      "open",
+    );
   };
 
   const closeLightbox = () => {
-    const thumb = thumbnailRef.value;
-    const doc =
-      typeof document === "undefined" ? undefined : (document as DocWithVT);
-
-    if (doc?.startViewTransition && thumb) {
-      const transition = doc.startViewTransition(async () => {
+    ɵmorphViewTransition(
+      thumbnailRef.value,
+      vtName,
+      async () => {
         open.value = false;
         await nextTick();
-        thumb.style.viewTransitionName = vtName;
-      });
-      const clear = () => {
-        thumb.style.viewTransitionName = "";
-      };
-      transition.finished.then(clear, clear);
-    } else {
-      open.value = false;
-    }
+      },
+      "close",
+    );
   };
 
   return { thumbnailRef, vtName, open, openLightbox, closeLightbox };

package/src/v2/hooks/__tests__/use-agent-error-state.test.ts

@@ -31,10 +31,10 @@ describe("useAgent error state", () => {
 
     const TestComponent = defineComponent({
       setup() {
-        const { agent } = useAgent({ agentId: "nonexistent" });
-        return { agent };
+        const { agent, isReady } = useAgent({ agentId: "nonexistent" });
+        return { agent, isReady };
       },
-      template: `<div data-testid="agent-id">{{ agent.agentId }}</div>`,
+      template: `<div data-testid="agent-id">{{ agent.agentId }}</div><div data-testid="ready">{{ isReady }}</div>`,
     });
 
     const Host = defineComponent({
@@ -59,6 +59,8 @@ describe("useAgent error state", () => {
     // Should render without crashing — agent is provisional
     const el = await screen.findByTestId("agent-id");
     expect(el.textContent).toBe("nonexistent");
+    // A provisional stand-in is not the real agent.
+    expect(screen.getByTestId("ready").textContent).toBe("false");
     expect(capturedErrors).toEqual([]);
   });
 });

package/src/v2/hooks/__tests__/use-agent-stability.test.ts

@@ -6,7 +6,23 @@ import type { AbstractAgent } from "@ag-ui/client";
 import { useCopilotKit } from "../../providers/useCopilotKit";
 import { MockStepwiseAgent } from "../../__tests__/utils/test-helpers";
 import { useAgent } from "../use-agent";
-import { CopilotKitCoreRuntimeConnectionStatus } from "@copilotkit/core";
+import {
+  CopilotKitCoreRuntimeConnectionStatus,
+  ProxiedCopilotRuntimeAgent,
+} from "@copilotkit/core";
+
+/** Core's `ɵruntimeInfo` snapshot, built from a fake core's runtime fields. */
+function runtimeInfoOf(core: {
+  runtimeConnectionStatus: CopilotKitCoreRuntimeConnectionStatus;
+  threadEndpoints?: unknown;
+  intelligence?: unknown;
+}) {
+  return {
+    status: core.runtimeConnectionStatus,
+    threadEndpoints: core.threadEndpoints,
+    intelligence: core.intelligence,
+  };
+}
 
 // Mock the CopilotKitProvider to control copilotkit state directly
 vi.mock("../../providers/useCopilotKit", () => ({
@@ -26,6 +42,7 @@ describe("useAgent stability during runtime connection", () => {
   type MockCopilotkit = {
     getAgent: ReturnType<typeof vi.fn>;
     runtimeUrl: string | undefined;
+    readonly ɵruntimeInfo: unknown;
     runtimeConnectionStatus: CopilotKitCoreRuntimeConnectionStatus;
     runtimeTransport: string;
     headers: Record<string, string>;
@@ -45,6 +62,9 @@ describe("useAgent stability during runtime connection", () => {
     copilotkitRef = ref({
       getAgent: vi.fn(() => undefined),
       runtimeUrl: "http://localhost:3000/api/copilotkit",
+      get ɵruntimeInfo() {
+        return runtimeInfoOf(this);
+      },
       runtimeConnectionStatus:
         CopilotKitCoreRuntimeConnectionStatus.Disconnected,
       runtimeTransport: "rest",
@@ -198,7 +218,6 @@ describe("useAgent stability during runtime connection", () => {
     // Phase 1: Disconnected — provisional created
     const { rerender } = render(AgentTracker, { props: { tick: 0 } });
     await nextTick();
-    const provisionalThreadId = agentInstances[0]!.threadId;
 
     // Phase 2: Connecting
     mockCopilotkit.runtimeConnectionStatus =
@@ -232,8 +251,10 @@ describe("useAgent stability during runtime connection", () => {
     // CopilotChat's connect guard ensures connect fires only once (when Connected),
     // so the agent reference change doesn't cause a duplicate connect.
     expect(agentInstances.length).toBe(2);
-    // First instance was the provisional
-    expect(agentInstances[0]!.threadId).toBe(provisionalThreadId);
+    // First instance was the provisional. The hand-off then syncs it with
+    // the registered agent, so its threadId follows the registered one.
+    expect(agentInstances[0]).toBeInstanceOf(ProxiedCopilotRuntimeAgent);
+    expect(agentInstances[0]!.threadId).toBe(registeredAgent.threadId);
     // Second instance is the registered agent
     expect(agentInstances[1]).toBe(registeredAgent);
   });

package/src/v2/hooks/__tests__/use-agent-throttle.test.ts

@@ -541,6 +541,8 @@ describe("useAgent throttleMs", () => {
   it("single notification within window does not trigger a trailing re-render", async () => {
     const renderCount = { current: 0 };
     mountHookComponent({ agent, throttleMs: 100, renderCount });
+    // The provider connects on mount, and the status change re-renders once.
+    await flushVue();
     const afterMount = renderCount.current;
     agent.setMessages([userMsg("1", "a")]);
     agent.notifyMessagesChanged();
@@ -692,8 +694,10 @@ describe("useAgent defaultThrottleMs from provider", () => {
         agent,
         defaultThrottleMs: value,
       });
+      // Core validates the value (the provider no longer logs its own copy).
       expect(errorSpy).toHaveBeenCalledWith(
-        expect.stringContaining("CopilotKitProvider: defaultThrottleMs"),
+        expect.stringContaining("CopilotKitCore.setDefaultThrottleMs"),
+        expect.any(Error),
       );
       agent.setMessages([userMsg("1", "a")]);
       agent.notifyMessagesChanged();

package/src/v2/hooks/__tests__/use-agent.test.ts

@@ -21,13 +21,15 @@ describe("useAgent", () => {
 
     const Child = defineComponent({
       setup() {
-        const { agent } = useAgent({ agentId: "test-agent" });
-        return () =>
+        const { agent, isReady } = useAgent({ agentId: "test-agent" });
+        return () => [
           h(
             "span",
             { "data-testid": "agent-id" },
             agent.value?.agentId ?? "none",
-          );
+          ),
+          h("span", { "data-testid": "ready" }, String(isReady.value)),
+        ];
       },
     });
 
@@ -38,6 +40,7 @@ describe("useAgent", () => {
     });
 
     expect(wrapper.find("[data-testid=agent-id]").text()).toBe("test-agent");
+    expect(wrapper.find("[data-testid=ready]").text()).toBe("true");
   });
 
   it("uses agentId from chat configuration when no agentId prop is provided", () => {

package/src/v2/hooks/__tests__/use-component.test.ts

@@ -106,6 +106,27 @@ describe("useComponent", () => {
     expect(forwardedDeps).toBe(deps);
   });
 
+  it("forwards followUp, as React and Angular do", () => {
+    const Harness = defineComponent({
+      setup() {
+        useComponent({
+          name: "showWeatherCard",
+          render: defineComponent({ template: `<div />` }),
+          followUp: false,
+        });
+        return {};
+      },
+      template: `<div />`,
+    });
+
+    render(Harness);
+
+    const [toolConfig] = mockUseFrontendTool.mock.calls[0] as [
+      { followUp?: boolean },
+    ];
+    expect(toolConfig.followUp).toBe(false);
+  });
+
   it("creates a render function that passes args into the component", () => {
     const DemoComponent = defineComponent({
       props: {