@copilotkit/vue 1.57.1

package/src/v2/components/chat/__tests__/CopilotChat.licenseWarning.test.ts

@@ -0,0 +1,138 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { defineComponent, h, provide, ref } from "vue";
+import { render, cleanup } from "@testing-library/vue";
+import CopilotKitProvider from "../../../providers/CopilotKitProvider.vue";
+import CopilotChatConfigurationProvider from "../../../providers/CopilotChatConfigurationProvider.vue";
+import {
+  LicenseContextKey,
+  type LicenseContextValue,
+} from "../../../providers/license-context";
+import { StateCapturingAgent } from "../../../__tests__/utils/agents";
+import CopilotChat from "../CopilotChat.vue";
+import CopilotSidebar from "../CopilotSidebar.vue";
+import CopilotPopup from "../CopilotPopup.vue";
+
+/**
+ * Vue parity tests for the inline feature warning surfaces on
+ * `CopilotChat`, `CopilotSidebar`, and `CopilotPopup`. Mirrors the React
+ * inline warning + console.warn behavior at:
+ *   packages/react-core/src/v2/components/chat/CopilotChat.tsx
+ *   packages/react-core/src/v2/components/chat/CopilotSidebar.tsx
+ *   packages/react-core/src/v2/components/chat/CopilotPopup.tsx
+ *
+ * The default `createLicenseContextValue(null)` is permissive
+ * (`checkFeature` always returns true), so the inline warning is never
+ * rendered in the default path. We test both the default path
+ * (no warning) and an explicit gated path (warning rendered + console
+ * warned) by overriding the injected license context.
+ */
+
+function makeLicenseRef(licensed: boolean) {
+  const value: LicenseContextValue = {
+    status: null,
+    license: null,
+    checkFeature: () => licensed,
+    getLimit: () => null,
+  };
+  return ref(value);
+}
+
+function mountWith(opts: {
+  licensed: boolean;
+  component: typeof CopilotChat | typeof CopilotSidebar | typeof CopilotPopup;
+}) {
+  // The CopilotKitProvider re-`provide`s `LicenseContextKey` with the
+  // permissive default. To override it for these tests, install our custom
+  // license ref on a wrapper rendered *inside* the provider.
+  const LicenseOverride = defineComponent({
+    setup(_, { slots }) {
+      provide(LicenseContextKey, makeLicenseRef(opts.licensed));
+      return () => slots.default?.();
+    },
+  });
+
+  const Host = defineComponent({
+    setup() {
+      return () =>
+        h(
+          CopilotKitProvider,
+          { agents__unsafe_dev_only: { default: new StateCapturingAgent() } },
+          {
+            default: () =>
+              h(LicenseOverride, null, {
+                default: () =>
+                  h(
+                    CopilotChatConfigurationProvider,
+                    { threadId: "test-thread" },
+                    {
+                      default: () => h(opts.component),
+                    },
+                  ),
+              }),
+          },
+        );
+    },
+  });
+  return render(Host);
+}
+
+let warnSpy: ReturnType<typeof vi.spyOn>;
+
+beforeEach(() => {
+  warnSpy = vi.spyOn(console, "warn").mockImplementation(() => {});
+});
+
+afterEach(() => {
+  cleanup();
+  vi.restoreAllMocks();
+});
+
+describe("CopilotChat license inline warning", () => {
+  it("does not render an inline warning under the default permissive license context", () => {
+    const view = mountWith({ licensed: true, component: CopilotChat });
+    expect(view.queryByTestId("copilot-inline-feature-warning")).toBeNull();
+  });
+
+  it('renders the "Chat" inline warning and console-warns when chat is unlicensed', () => {
+    const view = mountWith({ licensed: false, component: CopilotChat });
+    const warning = view.getByTestId("copilot-inline-feature-warning");
+    expect(warning.textContent).toContain("Chat");
+    expect(warnSpy).toHaveBeenCalledWith(
+      '[CopilotKit] Warning: "chat" feature is not licensed. Visit copilotkit.ai/pricing',
+    );
+  });
+});
+
+describe("CopilotSidebar license inline warning", () => {
+  it("does not render an inline warning under the default permissive license context", () => {
+    const view = mountWith({ licensed: true, component: CopilotSidebar });
+    expect(view.queryByTestId("copilot-inline-feature-warning")).toBeNull();
+  });
+
+  it('renders the "Sidebar" inline warning and console-warns when sidebar is unlicensed', () => {
+    const view = mountWith({ licensed: false, component: CopilotSidebar });
+    const warnings = view.getAllByTestId("copilot-inline-feature-warning");
+    // Sidebar wraps CopilotChat, so the wrapper warning + the chat warning
+    // both render. The sidebar warning is emitted first in DOM order.
+    expect(warnings[0]?.textContent).toContain("Sidebar");
+    expect(warnSpy).toHaveBeenCalledWith(
+      '[CopilotKit] Warning: "sidebar" feature is not licensed. Visit copilotkit.ai/pricing',
+    );
+  });
+});
+
+describe("CopilotPopup license inline warning", () => {
+  it("does not render an inline warning under the default permissive license context", () => {
+    const view = mountWith({ licensed: true, component: CopilotPopup });
+    expect(view.queryByTestId("copilot-inline-feature-warning")).toBeNull();
+  });
+
+  it('renders the "Popup" inline warning and console-warns when popup is unlicensed', () => {
+    const view = mountWith({ licensed: false, component: CopilotPopup });
+    const warnings = view.getAllByTestId("copilot-inline-feature-warning");
+    expect(warnings[0]?.textContent).toContain("Popup");
+    expect(warnSpy).toHaveBeenCalledWith(
+      '[CopilotKit] Warning: "popup" feature is not licensed. Visit copilotkit.ai/pricing',
+    );
+  });
+});

package/src/v2/components/chat/__tests__/CopilotChat.onError.test.ts

@@ -0,0 +1,85 @@
+import { describe, it, expect, vi } from "vitest";
+import { defineComponent } from "vue";
+import { CopilotKitCoreErrorCode } from "@copilotkit/core";
+import type { BaseEvent, RunAgentInput } from "@ag-ui/client";
+import { Observable, EMPTY } from "rxjs";
+import {
+  MockStepwiseAgent,
+  renderWithCopilotKit,
+} from "../../../__tests__/utils/test-helpers";
+import CopilotChat from "../CopilotChat.vue";
+
+/**
+ * Mock agent whose connect() always fails
+ */
+class FailingConnectAgent extends MockStepwiseAgent {
+  override run(input: RunAgentInput): Observable<BaseEvent> {
+    return super.run(input);
+  }
+
+  override connect(_input: RunAgentInput): Observable<BaseEvent> {
+    return new Observable((subscriber) => {
+      subscriber.error(new Error("connect failed"));
+    });
+  }
+}
+
+/**
+ * Mock agent whose connect() succeeds (returns empty observable)
+ */
+class HealthyConnectAgent extends MockStepwiseAgent {
+  override run(input: RunAgentInput): Observable<BaseEvent> {
+    return super.run(input);
+  }
+
+  override connect(_input: RunAgentInput): Observable<BaseEvent> {
+    return EMPTY;
+  }
+}
+
+function createHost(chatOnError: (event: unknown) => void) {
+  return defineComponent({
+    components: { CopilotChat },
+    setup() {
+      return { chatOnError };
+    },
+    template: `
+      <CopilotChat :welcome-screen="false" :on-error="chatOnError" />
+    `,
+  });
+}
+
+describe("CopilotChat onError", () => {
+  it("connectAgent failure fires onError on CopilotChat and does not crash", async () => {
+    const agent = new FailingConnectAgent();
+    const chatOnError = vi.fn();
+
+    renderWithCopilotKit({
+      agent,
+      children: createHost(chatOnError),
+    });
+
+    // Wait for the connectAgent error to propagate
+    await vi.waitFor(() => {
+      expect(chatOnError).toHaveBeenCalled();
+    });
+
+    // Check that AGENT_CONNECT_FAILED is among the errors
+    const allCodes = chatOnError.mock.calls.map((call) => call[0].code);
+    expect(allCodes).toContain(CopilotKitCoreErrorCode.AGENT_CONNECT_FAILED);
+  });
+
+  it("onError on CopilotChat does not fire for a healthy agent", async () => {
+    const agent = new HealthyConnectAgent();
+    const chatOnError = vi.fn();
+
+    renderWithCopilotKit({
+      agent,
+      children: createHost(chatOnError),
+    });
+
+    // No errors should fire for a healthy agent
+    await new Promise((resolve) => setTimeout(resolve, 50));
+    expect(chatOnError).not.toHaveBeenCalled();
+  });
+});

package/src/v2/components/chat/__tests__/CopilotChat.slots.e2e.test.ts

@@ -0,0 +1,141 @@
+import { describe, expect, it, vi } from "vitest";
+import { flushPromises } from "@vue/test-utils";
+import { h } from "vue";
+import CopilotChat from "../CopilotChat.vue";
+import { renderWithCopilotKit } from "../../../__tests__/utils/mount";
+import { StateCapturingAgent } from "../../../__tests__/utils/agents";
+import { getThreadClone } from "../../../hooks/use-agent";
+
+describe("CopilotChat.slots.e2e", () => {
+  it("supports full chat-view override with callback payload", async () => {
+    const agent = new StateCapturingAgent([], "default");
+    const onSubmitSpy = vi.fn();
+
+    const { wrapper, getCore } = renderWithCopilotKit(
+      () =>
+        h(
+          CopilotChat,
+          {
+            welcomeScreen: false,
+            onSubmitMessage: onSubmitSpy,
+          },
+          {
+            "chat-view": ({ messages, isRunning, onSubmitMessage }: any) =>
+              h("div", { "data-testid": "custom-chat-view" }, [
+                h("span", { "data-testid": "slot-running" }, String(isRunning)),
+                h(
+                  "span",
+                  { "data-testid": "slot-message-count" },
+                  String(messages.length),
+                ),
+                h(
+                  "button",
+                  {
+                    "data-testid": "slot-submit",
+                    onClick: () => void onSubmitMessage("From custom slot"),
+                  },
+                  "submit",
+                ),
+              ]),
+          },
+        ),
+      { agents: { default: agent } },
+    );
+
+    expect(wrapper.find("[data-testid='custom-chat-view']").exists()).toBe(
+      true,
+    );
+    expect(wrapper.get("[data-testid='slot-message-count']").text()).toBe("0");
+
+    await wrapper.get("[data-testid='slot-submit']").trigger("click");
+    await flushPromises();
+
+    expect(onSubmitSpy).toHaveBeenCalledWith("From custom slot");
+  });
+
+  it("forwards message-view and welcome-message slots", async () => {
+    const agent = new StateCapturingAgent([], "default");
+
+    const { wrapper } = renderWithCopilotKit(
+      () =>
+        h(
+          CopilotChat,
+          {
+            welcomeScreen: false,
+          },
+          {
+            "message-view": ({ messages }: any) =>
+              h(
+                "div",
+                { "data-testid": "custom-message-view" },
+                String(messages.length),
+              ),
+            "welcome-message": () =>
+              h(
+                "div",
+                { "data-testid": "custom-welcome-message" },
+                "Welcome slot",
+              ),
+          },
+        ),
+      { agents: { default: agent } },
+    );
+
+    expect(wrapper.get("[data-testid='custom-message-view']").text()).toBe("0");
+
+    const welcome = renderWithCopilotKit(
+      () =>
+        h(
+          CopilotChat,
+          { welcomeScreen: true },
+          {
+            "welcome-message": () =>
+              h(
+                "div",
+                { "data-testid": "custom-welcome-message" },
+                "Welcome slot",
+              ),
+          },
+        ),
+      { agents: { default: new StateCapturingAgent([], "default") } },
+    );
+    expect(
+      welcome.wrapper.find("[data-testid='custom-welcome-message']").exists(),
+    ).toBe(true);
+  });
+
+  it("resolves explicit agentId and threadId props over inherited config", async () => {
+    const defaultAgent = new StateCapturingAgent([], "default");
+    const customAgent = new StateCapturingAgent([], "custom-agent");
+
+    const { wrapper, getCore } = renderWithCopilotKit(
+      () =>
+        h(CopilotChat, {
+          agentId: "custom-agent",
+          threadId: "explicit-thread",
+          welcomeScreen: false,
+        }),
+      {
+        agents: {
+          default: defaultAgent,
+          "custom-agent": customAgent,
+        },
+        configProps: {
+          agentId: "default",
+          threadId: "inherited-thread",
+        },
+      },
+    );
+
+    const textarea = wrapper.get("textarea");
+    await textarea.setValue("hello");
+    await textarea.trigger("keydown", { key: "Enter" });
+    await flushPromises();
+
+    const registryAgent = getCore().getAgent("custom-agent");
+    const resolvedAgent = getThreadClone(registryAgent, "explicit-thread");
+    expect(defaultAgent.messages).toHaveLength(0);
+    expect(resolvedAgent?.threadId).toBe("explicit-thread");
+    expect(resolvedAgent?.messages.some((m) => m.role === "user")).toBe(true);
+  });
+});