@copilotkit/vue 1.57.1

package/src/v2/providers/__tests__/CopilotChatConfigurationProvider.test.ts

@@ -0,0 +1,309 @@
+import { describe, expect, it } from "vitest";
+import { mount } from "@vue/test-utils";
+import { defineComponent, h, nextTick } from "vue";
+import { DEFAULT_AGENT_ID } from "@copilotkit/shared";
+import CopilotChatConfigurationProvider from "../CopilotChatConfigurationProvider.vue";
+import { useCopilotChatConfiguration } from "../useCopilotChatConfiguration";
+import { CopilotChatDefaultLabels } from "../types";
+
+function makeDisplay() {
+  return defineComponent({
+    setup() {
+      const config = useCopilotChatConfiguration();
+      return () =>
+        h("div", [
+          h(
+            "span",
+            { "data-testid": "agent" },
+            config.value?.agentId ?? "no-config",
+          ),
+          h(
+            "span",
+            { "data-testid": "thread" },
+            config.value?.threadId ?? "no-config",
+          ),
+          h(
+            "span",
+            { "data-testid": "placeholder" },
+            config.value?.labels.chatInputPlaceholder ?? "no-config",
+          ),
+          h(
+            "span",
+            { "data-testid": "copy" },
+            config.value?.labels.assistantMessageToolbarCopyMessageLabel ??
+              "no-config",
+          ),
+          h(
+            "span",
+            { "data-testid": "modal" },
+            String(config.value?.isModalOpen),
+          ),
+          h(
+            "span",
+            { "data-testid": "explicit" },
+            String(config.value?.hasExplicitThreadId ?? "no-config"),
+          ),
+        ]);
+    },
+  });
+}
+
+describe("CopilotChatConfigurationProvider", () => {
+  it("provides default values", () => {
+    const Display = makeDisplay();
+    const wrapper = mount(CopilotChatConfigurationProvider, {
+      props: { threadId: "thread-1" },
+      slots: { default: () => h(Display) },
+    });
+
+    expect(wrapper.find("[data-testid=agent]").text()).toBe(DEFAULT_AGENT_ID);
+    expect(wrapper.find("[data-testid=thread]").text()).toBe("thread-1");
+    expect(wrapper.find("[data-testid=placeholder]").text()).toBe(
+      CopilotChatDefaultLabels.chatInputPlaceholder,
+    );
+  });
+
+  it("accepts custom agentId and merges labels", () => {
+    const Display = makeDisplay();
+    const wrapper = mount(CopilotChatConfigurationProvider, {
+      props: {
+        threadId: "thread-1",
+        agentId: "agent-custom",
+        labels: { chatInputPlaceholder: "Custom Placeholder" },
+      },
+      slots: { default: () => h(Display) },
+    });
+
+    expect(wrapper.find("[data-testid=agent]").text()).toBe("agent-custom");
+    expect(wrapper.find("[data-testid=placeholder]").text()).toBe(
+      "Custom Placeholder",
+    );
+    expect(wrapper.find("[data-testid=copy]").text()).toBe(
+      CopilotChatDefaultLabels.assistantMessageToolbarCopyMessageLabel,
+    );
+  });
+
+  it("returns null from hook without provider", () => {
+    const Display = makeDisplay();
+    const wrapper = mount(Display);
+
+    expect(wrapper.find("[data-testid=agent]").text()).toBe("no-config");
+    expect(wrapper.find("[data-testid=thread]").text()).toBe("no-config");
+    expect(wrapper.find("[data-testid=placeholder]").text()).toBe("no-config");
+  });
+
+  it("uses nested provider precedence", () => {
+    const Display = makeDisplay();
+    const wrapper = mount(CopilotChatConfigurationProvider, {
+      props: {
+        threadId: "outer-thread",
+        agentId: "outer-agent",
+        labels: { chatInputPlaceholder: "Outer" },
+      },
+      slots: {
+        default: () =>
+          h(
+            CopilotChatConfigurationProvider,
+            {
+              threadId: "inner-thread",
+              agentId: "inner-agent",
+              labels: { chatInputPlaceholder: "Inner" },
+            },
+            { default: () => h(Display) },
+          ),
+      },
+    });
+
+    expect(wrapper.find("[data-testid=agent]").text()).toBe("inner-agent");
+    expect(wrapper.find("[data-testid=thread]").text()).toBe("inner-thread");
+    expect(wrapper.find("[data-testid=placeholder]").text()).toBe("Inner");
+  });
+
+  it("creates and mutates modal state when isModalDefaultOpen is provided", async () => {
+    const Toggle = defineComponent({
+      setup() {
+        const config = useCopilotChatConfiguration();
+        const close = () => config.value?.setModalOpen?.(false);
+        return () =>
+          h("div", [
+            h(
+              "span",
+              { "data-testid": "modal" },
+              String(config.value?.isModalOpen),
+            ),
+            h("button", { "data-testid": "close", onClick: close }, "close"),
+          ]);
+      },
+    });
+
+    const wrapper = mount(CopilotChatConfigurationProvider, {
+      props: {
+        threadId: "thread-1",
+        isModalDefaultOpen: true,
+      },
+      slots: { default: () => h(Toggle) },
+    });
+
+    expect(wrapper.find("[data-testid=modal]").text()).toBe("true");
+    await wrapper.find("[data-testid=close]").trigger("click");
+    await nextTick();
+    expect(wrapper.find("[data-testid=modal]").text()).toBe("false");
+  });
+
+  it("creates modal state when isModalDefaultOpen is passed through template bindings", () => {
+    const Display = makeDisplay();
+    const TemplateWrapper = defineComponent({
+      components: { CopilotChatConfigurationProvider, Display },
+      template: `
+        <CopilotChatConfigurationProvider
+          thread-id="thread-1"
+          :is-modal-default-open="true"
+        >
+          <Display />
+        </CopilotChatConfigurationProvider>
+      `,
+    });
+
+    const wrapper = mount(TemplateWrapper);
+
+    expect(wrapper.find("[data-testid=modal]").text()).toBe("true");
+  });
+
+  describe("hasExplicitThreadId", () => {
+    it("infers true when threadId is supplied and hasExplicitThreadId is omitted", () => {
+      const Display = makeDisplay();
+      const wrapper = mount(CopilotChatConfigurationProvider, {
+        props: { threadId: "thread-1" },
+        slots: { default: () => h(Display) },
+      });
+
+      expect(wrapper.find("[data-testid=explicit]").text()).toBe("true");
+    });
+
+    it("infers false when neither threadId nor hasExplicitThreadId is supplied", () => {
+      const Display = makeDisplay();
+      const wrapper = mount(CopilotChatConfigurationProvider, {
+        props: {},
+        slots: { default: () => h(Display) },
+      });
+
+      expect(wrapper.find("[data-testid=explicit]").text()).toBe("false");
+    });
+
+    it("respects hasExplicitThreadId=false even when threadId is present", () => {
+      const Display = makeDisplay();
+      const wrapper = mount(CopilotChatConfigurationProvider, {
+        props: { threadId: "thread-1", hasExplicitThreadId: false },
+        slots: { default: () => h(Display) },
+      });
+
+      expect(wrapper.find("[data-testid=explicit]").text()).toBe("false");
+    });
+
+    it("explicit parent overrides non-explicit child", () => {
+      const Display = makeDisplay();
+      const wrapper = mount(CopilotChatConfigurationProvider, {
+        props: { threadId: "outer-thread" },
+        slots: {
+          default: () =>
+            h(
+              CopilotChatConfigurationProvider,
+              { threadId: "inner-thread", hasExplicitThreadId: false },
+              { default: () => h(Display) },
+            ),
+        },
+      });
+
+      expect(wrapper.find("[data-testid=explicit]").text()).toBe("true");
+    });
+
+    it("propagates explicitness through a multi-level provider chain", () => {
+      const Display = makeDisplay();
+      const wrapper = mount(CopilotChatConfigurationProvider, {
+        props: { threadId: "level-1" },
+        slots: {
+          default: () =>
+            h(
+              CopilotChatConfigurationProvider,
+              {},
+              {
+                default: () =>
+                  h(
+                    CopilotChatConfigurationProvider,
+                    {},
+                    { default: () => h(Display) },
+                  ),
+              },
+            ),
+        },
+      });
+
+      expect(wrapper.find("[data-testid=explicit]").text()).toBe("true");
+    });
+
+    it("non-explicit parent does not prevent an explicit child from being explicit", () => {
+      const Display = makeDisplay();
+      const wrapper = mount(CopilotChatConfigurationProvider, {
+        props: {},
+        slots: {
+          default: () =>
+            h(
+              CopilotChatConfigurationProvider,
+              { threadId: "child-thread" },
+              { default: () => h(Display) },
+            ),
+        },
+      });
+
+      expect(wrapper.find("[data-testid=explicit]").text()).toBe("true");
+    });
+  });
+
+  it("inherits modal state from parent when child does not define isModalDefaultOpen", async () => {
+    const ChildDisplay = defineComponent({
+      setup() {
+        const config = useCopilotChatConfiguration();
+        return () =>
+          h(
+            "span",
+            { "data-testid": "child-modal" },
+            String(config.value?.isModalOpen),
+          );
+      },
+    });
+
+    const ParentToggle = defineComponent({
+      setup() {
+        const config = useCopilotChatConfiguration();
+        const close = () => config.value?.setModalOpen?.(false);
+        return () =>
+          h("div", [
+            h(
+              "button",
+              { "data-testid": "close-parent", onClick: close },
+              "close",
+            ),
+            h(
+              CopilotChatConfigurationProvider,
+              { threadId: "child" },
+              { default: () => h(ChildDisplay) },
+            ),
+          ]);
+      },
+    });
+
+    const wrapper = mount(CopilotChatConfigurationProvider, {
+      props: {
+        threadId: "parent",
+        isModalDefaultOpen: true,
+      },
+      slots: { default: () => h(ParentToggle) },
+    });
+
+    expect(wrapper.find("[data-testid=child-modal]").text()).toBe("true");
+    await wrapper.find("[data-testid=close-parent]").trigger("click");
+    await nextTick();
+    await nextTick();
+    expect(wrapper.find("[data-testid=child-modal]").text()).toBe("false");
+  });
+});

package/src/v2/providers/__tests__/CopilotKitProvider.debug.test.ts

@@ -0,0 +1,295 @@
+import { cleanup, render } from "@testing-library/vue";
+import { defineComponent, nextTick } from "vue";
+import type { Component, PropType } from "vue";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import type { DebugConfig } from "@copilotkit/shared";
+import CopilotKitProvider from "../CopilotKitProvider.vue";
+import { useCopilotKit } from "../useCopilotKit";
+import type { CopilotKitCoreVue } from "../../lib/vue-core";
+
+let consoleErrorSpy: ReturnType<typeof vi.spyOn>;
+let consoleWarnSpy: ReturnType<typeof vi.spyOn>;
+
+function renderProvider(args: {
+  child: Component;
+  debug?: DebugConfig;
+  runtimeUrl?: string;
+  credentials?: RequestCredentials;
+  headers?: Record<string, string>;
+  properties?: Record<string, unknown>;
+  agents__unsafe_dev_only?: Record<string, unknown>;
+  defaultThrottleMs?: number;
+}) {
+  const Host = defineComponent({
+    components: {
+      CopilotKitProvider,
+      ChildComponent: args.child,
+    },
+    props: {
+      runtimeUrl: { type: String, required: false },
+      debug: {
+        type: [Boolean, Object] as PropType<DebugConfig | undefined>,
+        required: false,
+        default: undefined,
+      },
+      credentials: {
+        type: String as PropType<RequestCredentials | undefined>,
+        required: false,
+        default: undefined,
+      },
+      headers: {
+        type: Object as PropType<Record<string, string> | undefined>,
+        required: false,
+        default: undefined,
+      },
+      properties: {
+        type: Object as PropType<Record<string, unknown> | undefined>,
+        required: false,
+        default: undefined,
+      },
+      agents__unsafe_dev_only: {
+        type: Object as PropType<Record<string, unknown> | undefined>,
+        required: false,
+        default: undefined,
+      },
+      defaultThrottleMs: {
+        type: Number,
+        required: false,
+        default: undefined,
+      },
+    },
+    template: `
+      <CopilotKitProvider
+        :runtime-url="runtimeUrl"
+        :debug="debug"
+        :credentials="credentials"
+        :headers="headers"
+        :properties="properties"
+        :agents__unsafe_dev_only="agents__unsafe_dev_only"
+        :default-throttle-ms="defaultThrottleMs"
+      >
+        <ChildComponent />
+      </CopilotKitProvider>
+    `,
+  });
+
+  return render(Host, {
+    props: {
+      runtimeUrl: args.runtimeUrl ?? "/api/copilotkit",
+      debug: args.debug,
+      credentials: args.credentials,
+      headers: args.headers,
+      properties: args.properties,
+      agents__unsafe_dev_only: args.agents__unsafe_dev_only,
+      defaultThrottleMs: args.defaultThrottleMs,
+    },
+  });
+}
+
+function createCoreCollector(): {
+  child: Component;
+  getCore: () => CopilotKitCoreVue;
+  getInstances: () => CopilotKitCoreVue[];
+} {
+  const instances: CopilotKitCoreVue[] = [];
+  const Collector = defineComponent({
+    setup() {
+      const { copilotkit } = useCopilotKit();
+      instances.push(copilotkit.value);
+      return () => null;
+    },
+  });
+  return {
+    child: Collector,
+    getCore: () => {
+      if (instances.length === 0) {
+        throw new Error("CopilotKit core not captured yet");
+      }
+      return instances[instances.length - 1]!;
+    },
+    getInstances: () => instances,
+  };
+}
+
+describe("CopilotKitProvider debug", () => {
+  beforeEach(() => {
+    consoleErrorSpy = vi.spyOn(console, "error").mockImplementation(() => {});
+    consoleWarnSpy = vi.spyOn(console, "warn").mockImplementation(() => {});
+  });
+
+  afterEach(() => {
+    cleanup();
+    consoleErrorSpy.mockRestore();
+    consoleWarnSpy.mockRestore();
+  });
+
+  describe("initial threading", () => {
+    it("threads debug=true through to copilotkit.debug on mount", async () => {
+      const { child, getCore } = createCoreCollector();
+
+      renderProvider({ child, debug: true });
+      await nextTick();
+
+      expect(getCore().debug).toBe(true);
+    });
+
+    it("preserves the exact object config shape on the core instance", async () => {
+      const { child, getCore } = createCoreCollector();
+      const debugConfig: DebugConfig = {
+        events: true,
+        lifecycle: false,
+        verbose: true,
+      };
+
+      renderProvider({ child, debug: debugConfig });
+      await nextTick();
+
+      expect(getCore().debug).toEqual({
+        events: true,
+        lifecycle: false,
+        verbose: true,
+      });
+    });
+
+    it("leaves copilotkit.debug undefined when debug prop is omitted", async () => {
+      const { child, getCore } = createCoreCollector();
+
+      renderProvider({ child });
+      await nextTick();
+
+      expect(getCore().debug).toBeUndefined();
+    });
+  });
+
+  describe("runtime sync", () => {
+    it("updates copilotkit.debug when the prop changes after mount", async () => {
+      const { child, getCore } = createCoreCollector();
+
+      const view = renderProvider({ child, debug: false });
+      await nextTick();
+      expect(getCore().debug).toBe(false);
+
+      await view.rerender({
+        runtimeUrl: "/api/copilotkit",
+        debug: { events: true, lifecycle: true, verbose: true },
+      });
+      await nextTick();
+
+      expect(getCore().debug).toEqual({
+        events: true,
+        lifecycle: true,
+        verbose: true,
+      });
+    });
+
+    it("does not recreate the CopilotKitCoreVue instance when debug changes", async () => {
+      const { child, getInstances } = createCoreCollector();
+
+      const view = renderProvider({ child, debug: false });
+      await nextTick();
+      const initialInstance = getInstances()[0];
+      expect(initialInstance).toBeDefined();
+
+      await view.rerender({
+        runtimeUrl: "/api/copilotkit",
+        debug: true,
+      });
+      await nextTick();
+
+      await view.rerender({
+        runtimeUrl: "/api/copilotkit",
+        debug: { events: false, lifecycle: true },
+      });
+      await nextTick();
+
+      for (const instance of getInstances()) {
+        expect(instance).toBe(initialInstance);
+      }
+    });
+
+    it("calls setDebug on the stable core instance for each prop change", async () => {
+      const { child, getCore } = createCoreCollector();
+
+      const view = renderProvider({ child, debug: false });
+      await nextTick();
+
+      const core = getCore();
+      const setDebugSpy = vi.spyOn(core, "setDebug");
+
+      await view.rerender({
+        runtimeUrl: "/api/copilotkit",
+        debug: true,
+      });
+      await nextTick();
+
+      expect(setDebugSpy).toHaveBeenCalledWith(true);
+    });
+  });
+
+  describe("clearing behavior", () => {
+    it("clears the core debug config when debug changes from truthy to undefined", async () => {
+      const { child, getCore } = createCoreCollector();
+
+      const view = renderProvider({
+        child,
+        debug: { events: true, lifecycle: true },
+      });
+      await nextTick();
+      expect(getCore().debug).toEqual({ events: true, lifecycle: true });
+
+      await view.rerender({
+        runtimeUrl: "/api/copilotkit",
+        debug: undefined,
+      });
+      await nextTick();
+
+      expect(getCore().debug).toBeUndefined();
+    });
+  });
+
+  describe("regression safety", () => {
+    it("does not affect neighboring runtime config prop-sync behavior", async () => {
+      const { child, getCore } = createCoreCollector();
+
+      const view = renderProvider({
+        child,
+        runtimeUrl: "/api/copilotkit",
+        credentials: "include",
+        headers: { "X-Init": "1" },
+        properties: { initial: true },
+        agents__unsafe_dev_only: {},
+        defaultThrottleMs: 100,
+        debug: false,
+      });
+      await nextTick();
+
+      const core = getCore();
+      const setRuntimeUrlSpy = vi.spyOn(core, "setRuntimeUrl");
+      const setHeadersSpy = vi.spyOn(core, "setHeaders");
+      const setCredentialsSpy = vi.spyOn(core, "setCredentials");
+      const setPropertiesSpy = vi.spyOn(core, "setProperties");
+      const setAgentsSpy = vi.spyOn(core, "setAgents__unsafe_dev_only");
+      const setDefaultThrottleSpy = vi.spyOn(core, "setDefaultThrottleMs");
+      const setDebugSpy = vi.spyOn(core, "setDebug");
+
+      await view.rerender({
+        runtimeUrl: "/api/copilotkit/v2",
+        credentials: "same-origin",
+        headers: { "X-Updated": "1" },
+        properties: { initial: true, added: 42 },
+        agents__unsafe_dev_only: {},
+        defaultThrottleMs: 200,
+        debug: true,
+      });
+      await nextTick();
+
+      expect(setRuntimeUrlSpy).toHaveBeenCalledWith("/api/copilotkit/v2");
+      expect(setHeadersSpy).toHaveBeenCalled();
+      expect(setCredentialsSpy).toHaveBeenCalledWith("same-origin");
+      expect(setPropertiesSpy).toHaveBeenCalled();
+      expect(setAgentsSpy).toHaveBeenCalled();
+      expect(setDefaultThrottleSpy).toHaveBeenCalledWith(200);
+      expect(setDebugSpy).toHaveBeenCalledWith(true);
+    });
+  });
+});

package/src/v2/providers/__tests__/CopilotKitProvider.license.test.ts

@@ -0,0 +1,110 @@
+import { cleanup, render, waitFor } from "@testing-library/vue";
+import { defineComponent, h } from "vue";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import CopilotKitProvider from "../CopilotKitProvider.vue";
+
+/**
+ * These tests verify that the license banner is driven by the server-reported
+ * licenseStatus field in the /info response — not by client-side token
+ * verification. Mirrors React's `CopilotKitProvider.license.test.tsx`.
+ */
+
+function mockFetchWithLicenseStatus(licenseStatus?: string) {
+  return vi.fn().mockResolvedValue({
+    ok: true,
+    status: 200,
+    headers: new Headers(),
+    json: async () => ({
+      version: "1.0.0",
+      agents: {},
+      audioFileTranscriptionEnabled: false,
+      mode: "intelligence",
+      licenseStatus,
+    }),
+  });
+}
+
+const Child = defineComponent({
+  setup() {
+    return () => h("div", "child");
+  },
+});
+
+function renderProvider(opts?: { publicApiKey?: string }) {
+  const Host = defineComponent({
+    components: { CopilotKitProvider, Child },
+    template: `
+      <CopilotKitProvider runtime-url="/api" :public-api-key="publicApiKey">
+        <Child />
+      </CopilotKitProvider>
+    `,
+    setup() {
+      return { publicApiKey: opts?.publicApiKey };
+    },
+  });
+
+  return render(Host);
+}
+
+describe("CopilotKitProvider license (server-driven)", () => {
+  beforeEach(() => {
+    vi.spyOn(console, "warn").mockImplementation(() => {});
+    vi.spyOn(console, "error").mockImplementation(() => {});
+  });
+
+  afterEach(() => {
+    cleanup();
+    vi.unstubAllGlobals();
+    vi.restoreAllMocks();
+  });
+
+  it("shows no_license banner when server reports 'none'", async () => {
+    vi.stubGlobal("fetch", mockFetchWithLicenseStatus("none"));
+
+    const view = renderProvider();
+    await waitFor(() => {
+      expect(view.queryByText(/Powered by CopilotKit/)).not.toBeNull();
+    });
+  });
+
+  it("shows expired banner when server reports 'expired'", async () => {
+    vi.stubGlobal("fetch", mockFetchWithLicenseStatus("expired"));
+
+    const view = renderProvider();
+    await waitFor(() => {
+      expect(view.queryByText(/expired/i)).not.toBeNull();
+    });
+  });
+
+  it("shows invalid banner when server reports 'invalid'", async () => {
+    vi.stubGlobal("fetch", mockFetchWithLicenseStatus("invalid"));
+
+    const view = renderProvider();
+    await waitFor(() => {
+      expect(
+        view.queryByText(/Invalid CopilotKit license token/i),
+      ).not.toBeNull();
+    });
+  });
+
+  it("shows no banner when server reports 'valid'", async () => {
+    vi.stubGlobal("fetch", mockFetchWithLicenseStatus("valid"));
+
+    const view = renderProvider();
+    await waitFor(() => {
+      expect(view.queryByText(/Powered by CopilotKit/)).toBeNull();
+      expect(view.queryByText(/expired/i)).toBeNull();
+      expect(view.queryByText(/Invalid/i)).toBeNull();
+    });
+  });
+
+  it("shows no banner when licenseStatus is absent (non-intelligence mode)", async () => {
+    vi.stubGlobal("fetch", mockFetchWithLicenseStatus(undefined));
+
+    const view = renderProvider();
+    await waitFor(() => {
+      expect(view.queryByText(/Powered by CopilotKit/)).toBeNull();
+      expect(view.queryByText(/expired/i)).toBeNull();
+    });
+  });
+});