@copilotkit/vue 2.0.0-rc.3 → 2.0.0-rc.31

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

@@ -347,6 +347,32 @@ describe("useInterrupt", () => {
     expect(wrapper.get("[data-testid=interrupt-state]").text()).toBe("idle");
   });
 
+  it("treats a throwing enabled predicate as disabled instead of crashing", async () => {
+    vi.spyOn(console, "error").mockImplementation(() => {});
+    const wrapper = mountHarness({
+      enabled: () => {
+        throw new Error("predicate");
+      },
+    });
+    emitInterrupt("hidden");
+    await nextTick();
+    expect(wrapper.get("[data-testid=interrupt-state]").text()).toBe("idle");
+  });
+
+  it("shows the interrupt with a null result when the handler throws synchronously", async () => {
+    vi.spyOn(console, "error").mockImplementation(() => {});
+    const wrapper = mountHarness({
+      handler: () => {
+        throw new Error("handler");
+      },
+    });
+    emitInterrupt("visible");
+    await nextTick();
+    expect(wrapper.get("[data-testid=interrupt-state]").text()).toBe(
+      "no-result:visible",
+    );
+  });
+
   it("keeps the latest interrupt when multiple interrupts arrive within one run", async () => {
     const wrapper = mountHarness({ renderInChat: false });
 
@@ -412,6 +438,77 @@ describe("useInterrupt", () => {
       handlers.onRunFinalized?.();
     }
 
+    it("picks up the agent's pending interrupts when it mounts", async () => {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      (mockAgent as any).pendingInterrupts = [INT];
+      const wrapper = mountStandardHarness();
+      await nextTick();
+      expect(wrapper.find("[data-testid=active]").exists()).toBe(true);
+    });
+
+    it("appends a tool result for a frontend tool-call interrupt before resuming", async () => {
+      const addMessage = vi.fn();
+      Object.assign(mockAgent, { messages: [], addMessage });
+      const TOOL_INT: Interrupt = {
+        id: "tool-int",
+        reason: "tool_call",
+        toolCallId: "call-1",
+      };
+      const wrapper = mountStandardHarness();
+      fireStandardInterrupt([TOOL_INT]);
+      await nextTick();
+
+      await wrapper.get("[data-testid=resolve-btn]").trigger("click");
+
+      expect(addMessage).toHaveBeenCalledWith(
+        expect.objectContaining({
+          role: "tool",
+          toolCallId: "call-1",
+          content: JSON.stringify({ ok: true }),
+        }),
+      );
+      expect(runAgentMock).toHaveBeenCalledWith({
+        agent: mockAgent,
+        resume: [
+          {
+            interruptId: "tool-int",
+            status: "resolved",
+            payload: { ok: true },
+          },
+        ],
+      });
+    });
+
+    it("resumes when the only expired interrupt was cancelled", async () => {
+      const EXPIRED: Interrupt = {
+        id: "old",
+        reason: "confirmation",
+        expiresAt: "2000-01-01T00:00:00.000Z",
+      };
+      let api: ReturnType<typeof useInterrupt> | undefined;
+      mount(
+        defineComponent({
+          setup() {
+            api = useInterrupt({ renderInChat: false });
+            return () => null;
+          },
+        }),
+      );
+      fireStandardInterrupt([EXPIRED, INT]);
+      await nextTick();
+
+      await api!.cancel("old");
+      await api!.resolve("yes", INT.id);
+
+      expect(runAgentMock).toHaveBeenCalledWith({
+        agent: mockAgent,
+        resume: [
+          { interruptId: "old", status: "cancelled" },
+          { interruptId: INT.id, status: "resolved", payload: "yes" },
+        ],
+      });
+    });
+
     it("resolveInterrupt resumes with a resolved ResumeEntry", async () => {
       runAgentMock.mockResolvedValue({ result: undefined, newMessages: [] });
       const wrapper = mountStandardHarness();

package/src/v2/hooks/__tests__/use-render-activity-message.test.ts

@@ -0,0 +1,106 @@
+import {
+  afterEach,
+  beforeEach,
+  describe,
+  expect,
+  expectTypeOf,
+  it,
+  vi,
+} from "vitest";
+import { defineComponent, h, toRaw } from "vue";
+import { z } from "zod";
+import type { ActivityMessage } from "@ag-ui/core";
+import { useRenderActivityMessage } from "../use-render-activity-message";
+import type {
+  VueActivityMessageRenderer,
+  VueActivityMessageRendererProps,
+} from "../../types";
+import { renderWithCopilotKit } from "../../__tests__/utils/mount";
+
+const ProgressRenderer = defineComponent({
+  props: { content: { type: Object, required: true } },
+  setup: () => () => null,
+});
+
+const progressSchema = z.object({
+  label: z.string(),
+  percent: z.number().default(0),
+});
+
+// A zod schema is a Standard Schema, so it fits the `content` field, and the
+// renderer's content type is the schema's output type.
+const progressRenderer = {
+  activityType: "progress",
+  content: progressSchema,
+  render: ProgressRenderer,
+} satisfies VueActivityMessageRenderer<z.output<typeof progressSchema>>;
+
+function activityMessage(content: Record<string, unknown>): ActivityMessage {
+  return {
+    id: "activity-1",
+    role: "activity",
+    activityType: "progress",
+    content,
+  };
+}
+
+function renderWithProgressRenderer() {
+  let helpers: ReturnType<typeof useRenderActivityMessage> | undefined;
+  const Probe = defineComponent({
+    setup() {
+      helpers = useRenderActivityMessage();
+      return () => null;
+    },
+  });
+
+  renderWithCopilotKit(() => h(Probe), {
+    providerProps: { renderActivityMessages: [progressRenderer] },
+  });
+
+  if (!helpers) throw new Error("useRenderActivityMessage did not run");
+  return helpers;
+}
+
+describe("useRenderActivityMessage", () => {
+  let consoleWarnSpy: ReturnType<typeof vi.spyOn>;
+
+  beforeEach(() => {
+    consoleWarnSpy = vi.spyOn(console, "warn").mockImplementation(() => {});
+  });
+
+  afterEach(() => {
+    consoleWarnSpy.mockRestore();
+  });
+
+  it("types a zod content schema's output as the render props content", () => {
+    type Props = VueActivityMessageRendererProps<
+      z.output<typeof progressSchema>
+    >;
+    expectTypeOf<Props["content"]>().toEqualTypeOf<{
+      label: string;
+      percent: number;
+    }>();
+  });
+
+  it("passes the zod schema's parsed output to the renderer", () => {
+    const { renderActivityMessage } = renderWithProgressRenderer();
+
+    const result = renderActivityMessage(activityMessage({ label: "Upload" }));
+
+    // The provider stores renderers in reactive state, so compare the raw value.
+    expect(toRaw(result?.renderer)).toBe(ProgressRenderer);
+    expect(result?.props.content).toEqual({ label: "Upload", percent: 0 });
+  });
+
+  it("returns null and warns when the content fails the schema", () => {
+    const { renderActivityMessage } = renderWithProgressRenderer();
+
+    const result = renderActivityMessage(activityMessage({ label: 42 }));
+
+    expect(result).toBeNull();
+    expect(consoleWarnSpy).toHaveBeenCalledWith(
+      "[CopilotKit] Failed to parse content for activity message 'progress':",
+      expect.any(Array),
+    );
+  });
+});

package/src/v2/hooks/__tests__/use-render-tool.test.ts

@@ -93,7 +93,7 @@ describe("useRenderTool", () => {
     expect(typeof renderer?.render).toBe("function");
   });
 
-  it("registers wildcard renderer and defaults parameters schema to z.any", () => {
+  it("registers wildcard renderer and defaults parameters to a schema that accepts any value", () => {
     const core = createMockCore();
     mockUseCopilotKit.mockReturnValue({ copilotkit: { value: core } });
 
@@ -118,11 +118,8 @@ describe("useRenderTool", () => {
     const renderer = core.renderToolCalls.find((item) => item.name === "*");
     expect(renderer).toBeDefined();
     expect(typeof renderer?.render).toBe("function");
-    const wildcardArgs = renderer?.args as
-      | { safeParse: (v: unknown) => { success: boolean } }
-      | undefined;
-    expect(wildcardArgs).toBeDefined();
-    expect(wildcardArgs!.safeParse({ arbitrary: true }).success).toBe(true);
+    const result = renderer?.args["~standard"].validate({ arbitrary: true });
+    expect(result).toEqual({ value: { arbitrary: true } });
   });
 
   it("accepts a Vue component renderer", () => {

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

@@ -4,6 +4,19 @@ import type { Ref } from "vue";
 import { describe, expect, it, beforeEach, vi } from "vitest";
 import { useCopilotKit } from "../../providers/useCopilotKit";
 
+/** 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,
+  };
+}
+
 type ThreadRecord = {
   id: string;
   organizationId: string;
@@ -54,7 +67,8 @@ function compareThreadsByActivity(left: ThreadRecord, right: ThreadRecord) {
   return rightKey.localeCompare(leftKey);
 }
 
-vi.mock("@copilotkit/core", () => {
+vi.mock("@copilotkit/core", async (importOriginal) => {
+  const actual = await importOriginal<typeof import("@copilotkit/core")>();
   class MockChannel {
     topic: string;
     left = false;
@@ -118,6 +132,16 @@ vi.mock("@copilotkit/core", () => {
     private listeners = new Set<() => void>();
     private socket: MockSocket | null = null;
 
+    readonly selectors = {
+      threads: (state: ThreadState) => state.threads,
+      isLoading: (state: ThreadState) => state.isLoading,
+      error: (state: ThreadState) => state.error,
+      fetchMoreError: (state: ThreadState) => state.fetchMoreError,
+      hasNextPage: (state: ThreadState) => state.hasNextPage,
+      isFetchingNextPage: (state: ThreadState) => state.isFetchingNextPage,
+      isMutating: (state: ThreadState) => state.isMutating,
+    };
+
     start(): void {}
 
     stop(): void {
@@ -317,6 +341,10 @@ vi.mock("@copilotkit/core", () => {
       return this.state;
     }
 
+    getServerState(): ThreadState {
+      return { ...this.state, threads: [] };
+    }
+
     select<T>(selector: (state: ThreadState) => T) {
       return {
         subscribe: (callback: () => void) => {
@@ -357,6 +385,8 @@ vi.mock("@copilotkit/core", () => {
     ɵselectHasNextPage: select((state) => state.hasNextPage),
     ɵselectIsFetchingNextPage: select((state) => state.isFetchingNextPage),
     ɵselectIsMutating: select((state) => state.isMutating),
+    // The real view model, driving the mock store above.
+    ɵThreadsController: actual.ɵThreadsController,
   };
 });
 
@@ -394,6 +424,7 @@ const supportedThreadEndpoints: ThreadEndpointRuntimeInfo = {
 
 type MockCopilotKit = {
   runtimeUrl: string | undefined;
+  readonly ɵruntimeInfo: unknown;
   runtimeConnectionStatus: CopilotKitCoreRuntimeConnectionStatus;
   headers: Record<string, string>;
   /**
@@ -417,6 +448,9 @@ function setupCopilotKit(
 ) {
   const copilotkit = ref<MockCopilotKit>({
     runtimeUrl,
+    get ɵruntimeInfo() {
+      return runtimeInfoOf(this);
+    },
     runtimeConnectionStatus,
     headers: { Authorization: "Bearer test-token" },
     ɵheadersGeneration: 0,
@@ -965,6 +999,9 @@ describe("useThreads", () => {
       // exactly one list fetch (+ one subscribe after it lands).
       copilotkit.value = {
         ...copilotkit.value,
+        get ɵruntimeInfo() {
+          return runtimeInfoOf(this);
+        },
         runtimeConnectionStatus:
           CopilotKitCoreRuntimeConnectionStatus.Connected,
         intelligence: { wsUrl: "ws://localhost:4000/client" },
@@ -1020,6 +1057,9 @@ describe("useThreads", () => {
 
       copilotkit.value = {
         ...copilotkit.value,
+        get ɵruntimeInfo() {
+          return runtimeInfoOf(this);
+        },
         runtimeConnectionStatus:
           CopilotKitCoreRuntimeConnectionStatus.Disconnected,
       };
@@ -1216,8 +1256,9 @@ describe("useThreads", () => {
 
       expect(fetchMock).not.toHaveBeenCalled();
       expect(getResult().threads.value).toEqual([]);
-      const lastDispatched = getDispatchedContexts().at(-1);
-      expect(lastDispatched).toBeNull();
+      // Nothing was ever sent, so nothing is cleared either (no extra
+      // queued list fetch).
+      expect(getDispatchedContexts()).toEqual([]);
       // A disabled consumer must not be stuck in a permanent loading state:
       // preConnectLoading must factor in `enabled`, otherwise isLoading would
       // stay true forever since hasDispatchedContext never gets set.
@@ -1240,7 +1281,7 @@ describe("useThreads", () => {
       // Disabled: inert, not loading, no fetch.
       expect(getResult().isLoading.value).toBe(false);
       expect(fetchMock).not.toHaveBeenCalled();
-      expect(getDispatchedContexts().at(-1)).toBeNull();
+      expect(getDispatchedContexts().filter(Boolean)).toEqual([]);
 
       // Re-enable: the pre-connect loading indicator must re-arm (i.e.
       // hasDispatchedContext was reset to false on disable) so consumers see
@@ -1343,8 +1384,9 @@ describe("useThreads", () => {
 
       expect(fetchMock).not.toHaveBeenCalled();
       expect(getResult().threads.value).toEqual([]);
-      const lastDispatched = getDispatchedContexts().at(-1);
-      expect(lastDispatched).toBeNull();
+      // Nothing was ever sent, so nothing is cleared either (no extra
+      // queued list fetch).
+      expect(getDispatchedContexts()).toEqual([]);
       expect(getResult().error.value?.message).toBe(
         "Thread endpoints are not available on this CopilotKit runtime",
       );

package/src/v2/hooks/__tests__/zod-regression.test.ts

@@ -4,7 +4,7 @@
  *
  * Covers:
  * 1. useRenderTool with complex Zod schemas
- * 2. defineToolCallRenderer with Zod (named + wildcard default z.any())
+ * 2. defineToolCallRenderer with Zod (named + wildcard default schema)
  * 3. useComponent with Zod schemas
  * 4. The registered schema object is the original Zod instance (identity check)
  */
@@ -134,7 +134,7 @@ describe("useRenderTool Zod regression", () => {
     const schema = z.object({
       action: z.discriminatedUnion("type", [
         z.object({ type: z.literal("search"), query: z.string() }),
-        z.object({ type: z.literal("navigate"), url: z.string().url() }),
+        z.object({ type: z.literal("navigate"), url: z.url() }),
       ]),
     });
 
@@ -196,14 +196,15 @@ describe("useRenderTool Zod regression", () => {
 });
 
 describe("defineToolCallRenderer Zod regression", () => {
-  it("wildcard tool defaults to z.any() for args", () => {
+  it("wildcard tool defaults to a schema that accepts any value", () => {
     const renderer = defineToolCallRenderer({
       name: "*",
       render: () => "wildcard",
     });
 
     expect(renderer.name).toBe("*");
-    expect((renderer.args as any)["~standard"].vendor).toBe("zod");
+    const result = renderer.args["~standard"].validate({ city: "Paris" });
+    expect(result).toEqual({ value: { city: "Paris" } });
   });
 
   it("named tool with Zod args preserves schema identity", () => {

package/src/v2/hooks/use-agent-context.ts

@@ -1,14 +1,10 @@
 import { computed, toValue, watch } from "vue";
 import type { MaybeRefOrGetter } from "vue";
+import { ɵserializeContextValue } from "@copilotkit/core";
+import type { ɵJsonSerializable } from "@copilotkit/core";
 import { useCopilotKit } from "../providers/useCopilotKit";
 
-export type JsonSerializable =
-  | string
-  | number
-  | boolean
-  | null
-  | JsonSerializable[]
-  | { [key: string]: JsonSerializable };
+export type JsonSerializable = ɵJsonSerializable;
 
 export interface AgentContextInput {
   description: MaybeRefOrGetter<string>;
@@ -35,9 +31,7 @@ export function useAgentContext(context: AgentContextInput): void {
   const resolvedValue = computed(() => toValue(context.value));
 
   const stringValue = computed(() =>
-    typeof resolvedValue.value === "string"
-      ? resolvedValue.value
-      : JSON.stringify(resolvedValue.value),
+    ɵserializeContextValue(resolvedValue.value),
   );
 
   watch(