@yh-ui/components 0.1.21 → 0.1.23

package/dist/ai-sender/__tests__/ai-sender.test.cjs

@@ -1,511 +0,0 @@
-"use strict";
-
-var _vitest = require("vitest");
-var _testUtils = require("@vue/test-utils");
-var _vue = require("vue");
-var _aiSender = _interopRequireDefault(require("../src/ai-sender.vue"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-(0, _vitest.describe)("YhAiSender", () => {
-  (0, _vitest.beforeEach)(() => {
-    _vitest.vi.useFakeTimers();
-  });
-  (0, _vitest.afterEach)(() => {
-    _vitest.vi.useRealTimers();
-  });
-  (0, _vitest.it)("should render with base class", () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default);
-    (0, _vitest.expect)(wrapper.find(".yh-ai-sender").exists()).toBe(true);
-  });
-  (0, _vitest.it)("should render textarea", () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default);
-    (0, _vitest.expect)(wrapper.find("textarea").exists()).toBe(true);
-  });
-  (0, _vitest.it)("should render send button", () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default);
-    (0, _vitest.expect)(wrapper.find(".yh-ai-sender__send-btn").exists()).toBe(true);
-  });
-  (0, _vitest.it)("should display modelValue in textarea", () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: "hello"
-      }
-    });
-    (0, _vitest.expect)(wrapper.find("textarea").element.value).toBe("hello");
-  });
-  (0, _vitest.it)("should emit update:modelValue on input", async () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: ""
-      }
-    });
-    await wrapper.find("textarea").setValue("new text");
-    const emitted = wrapper.emitted("update:modelValue");
-    (0, _vitest.expect)(emitted).toBeTruthy();
-    (0, _vitest.expect)(emitted[emitted.length - 1][0]).toBe("new text");
-  });
-  (0, _vitest.it)("should emit change on input", async () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: ""
-      }
-    });
-    await wrapper.find("textarea").setValue("changed");
-    (0, _vitest.expect)(wrapper.emitted("change")).toBeTruthy();
-  });
-  (0, _vitest.it)("should apply is-disabled class when disabled=true", () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        disabled: true
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".yh-ai-sender").classes()).toContain("is-disabled");
-  });
-  (0, _vitest.it)("should disable textarea when disabled=true", () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        disabled: true
-      }
-    });
-    (0, _vitest.expect)(wrapper.find("textarea").element.disabled).toBe(true);
-  });
-  (0, _vitest.it)("should apply is-loading class when loading=true", () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        loading: true
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".yh-ai-sender").classes()).toContain("is-loading");
-  });
-  (0, _vitest.it)("should disable textarea when loading=true", () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        loading: true
-      }
-    });
-    (0, _vitest.expect)(wrapper.find("textarea").element.disabled).toBe(true);
-  });
-  (0, _vitest.it)("should emit send when button clicked with text", async () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: "Hello"
-      }
-    });
-    await wrapper.find(".yh-ai-sender__send-btn").trigger("click");
-    (0, _vitest.expect)(wrapper.emitted("send")).toBeTruthy();
-    (0, _vitest.expect)(wrapper.emitted("send")[0][0]).toBe("Hello");
-  });
-  (0, _vitest.it)("should NOT emit send when textarea is empty", async () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: ""
-      }
-    });
-    await wrapper.find(".yh-ai-sender__send-btn").trigger("click");
-    (0, _vitest.expect)(wrapper.emitted("send")).toBeFalsy();
-  });
-  (0, _vitest.it)("should NOT emit send when disabled", async () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: "text",
-        disabled: true
-      }
-    });
-    await wrapper.find(".yh-ai-sender__send-btn").trigger("click");
-    (0, _vitest.expect)(wrapper.emitted("send")).toBeFalsy();
-  });
-  (0, _vitest.it)("should NOT emit send when loading", async () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: "text",
-        loading: true
-      }
-    });
-    await wrapper.find(".yh-ai-sender__send-btn").trigger("click");
-    (0, _vitest.expect)(wrapper.emitted("send")).toBeFalsy();
-  });
-  (0, _vitest.it)("should emit send on Enter (without Shift)", async () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: "Hello"
-      }
-    });
-    await wrapper.find("textarea").trigger("keydown", {
-      key: "Enter",
-      shiftKey: false
-    });
-    (0, _vitest.expect)(wrapper.emitted("send")).toBeTruthy();
-  });
-  (0, _vitest.it)("should NOT emit send on Shift+Enter", async () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: "Hello"
-      }
-    });
-    await wrapper.find("textarea").trigger("keydown", {
-      key: "Enter",
-      shiftKey: true
-    });
-    (0, _vitest.expect)(wrapper.emitted("send")).toBeFalsy();
-  });
-  (0, _vitest.it)("should clear value after send", async () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: "Hello"
-      }
-    });
-    await wrapper.find(".yh-ai-sender__send-btn").trigger("click");
-    await (0, _vue.nextTick)();
-    const emitted = wrapper.emitted("update:modelValue");
-    (0, _vitest.expect)(emitted[emitted.length - 1][0]).toBe("");
-  });
-  (0, _vitest.it)("should show clear button when clearable=true and has text", () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: "text",
-        clearable: true
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".yh-ai-sender__clear-btn").exists()).toBe(true);
-  });
-  (0, _vitest.it)("should NOT show clear button when clearable=true but empty", () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: "",
-        clearable: true
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".yh-ai-sender__clear-btn").exists()).toBe(false);
-  });
-  (0, _vitest.it)("should emit clear when clear button clicked", async () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: "text",
-        clearable: true
-      }
-    });
-    await wrapper.find(".yh-ai-sender__clear-btn").trigger("click");
-    (0, _vitest.expect)(wrapper.emitted("clear")).toBeTruthy();
-  });
-  (0, _vitest.it)("should show word limit when showWordLimit=true and maxLength set", () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: "hi",
-        showWordLimit: true,
-        maxLength: 100
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".yh-ai-sender__word-limit").exists()).toBe(true);
-    (0, _vitest.expect)(wrapper.find(".yh-ai-sender__word-limit").text()).toContain("100");
-  });
-  (0, _vitest.it)("should apply is-focused on textarea focus", async () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default);
-    await wrapper.find("textarea").trigger("focus");
-    (0, _vitest.expect)(wrapper.find(".yh-ai-sender").classes()).toContain("is-focused");
-  });
-  (0, _vitest.it)("should remove is-focused on textarea blur", async () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default);
-    await wrapper.get("textarea").trigger("focus");
-    await wrapper.get("textarea").trigger("blur");
-    _vitest.vi.advanceTimersByTime(400);
-    await (0, _vue.nextTick)();
-    (0, _vitest.expect)(wrapper.find(".yh-ai-sender").classes()).not.toContain("is-focused");
-  });
-  (0, _vitest.it)("should render prefix slot", () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      slots: {
-        prefix: '<div class="custom-prefix">P</div>'
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".custom-prefix").exists()).toBe(true);
-  });
-  (0, _vitest.it)("should render actions slot", () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      slots: {
-        actions: '<button class="custom-action">Extra</button>'
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".custom-action").exists()).toBe(true);
-  });
-  (0, _vitest.it)("should render submit slot overriding default send button", () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      slots: {
-        submit: '<button class="custom-submit">Go</button>'
-      }
-    });
-    (0, _vitest.expect)(wrapper.find(".custom-submit").exists()).toBe(true);
-  });
-  (0, _vitest.it)("should update when modelValue prop changes", async () => {
-    const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-      props: {
-        modelValue: "old"
-      }
-    });
-    await wrapper.setProps({
-      modelValue: "new text"
-    });
-    await (0, _vue.nextTick)();
-    (0, _vitest.expect)(wrapper.find("textarea").element.value).toBe("new text");
-  });
-  (0, _vitest.describe)("Slash Commands", () => {
-    const commands = [{
-      key: "help",
-      label: "Help"
-    }, {
-      key: "settings",
-      label: "Settings",
-      prompt: "Show Settings "
-    }];
-    (0, _vitest.it)("should show slash commands panel when triggering /", async () => {
-      const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-        props: {
-          commands
-        }
-      });
-      const textarea = wrapper.get("textarea");
-      await textarea.setValue("/h");
-      textarea.element.selectionStart = 2;
-      await textarea.trigger("input");
-      await (0, _vue.nextTick)();
-      (0, _vitest.expect)(wrapper.find(".yh-ai-sender__command-panel").exists()).toBe(true);
-      (0, _vitest.expect)(wrapper.findAll(".yh-ai-sender__command-item").length).toBe(1);
-    });
-    (0, _vitest.it)("should navigate and select command with keyboard", async () => {
-      const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-        props: {
-          commands
-        }
-      });
-      const textarea = wrapper.find("textarea");
-      await textarea.setValue("/");
-      textarea.element.selectionStart = 1;
-      await textarea.trigger("input");
-      (0, _vitest.expect)(wrapper.find(".yh-ai-sender__command-panel").exists()).toBe(true);
-      await textarea.trigger("keydown", {
-        key: "ArrowDown"
-      });
-      await textarea.trigger("keydown", {
-        key: "ArrowUp"
-      });
-      await textarea.trigger("keydown", {
-        key: "Enter"
-      });
-      (0, _vitest.expect)(wrapper.emitted("command")[0][0]).toEqual(commands[0]);
-      (0, _vitest.expect)(textarea.element.value).toBe("/help ");
-    });
-    (0, _vitest.it)("should select command via mouse click", async () => {
-      const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-        props: {
-          commands
-        }
-      });
-      const textarea = wrapper.find("textarea");
-      await textarea.setValue("/");
-      textarea.element.selectionStart = 1;
-      await textarea.trigger("input");
-      await wrapper.find(".yh-ai-sender__command-item").trigger("click");
-      (0, _vitest.expect)(wrapper.emitted("command")).toBeTruthy();
-    });
-    (0, _vitest.it)("should hide commands on Escape", async () => {
-      const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-        props: {
-          commands
-        }
-      });
-      const textarea = wrapper.find("textarea");
-      await textarea.setValue("/");
-      textarea.element.selectionStart = 1;
-      await textarea.trigger("input");
-      await textarea.trigger("keydown", {
-        key: "Escape"
-      });
-      (0, _vitest.expect)(wrapper.find(".yh-ai-sender__command-panel").exists()).toBe(false);
-    });
-    (0, _vitest.it)("should ignore slash followed by space", async () => {
-      const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-        props: {
-          commands
-        }
-      });
-      const textarea = wrapper.find("textarea");
-      await textarea.setValue("/ ");
-      textarea.element.selectionStart = 2;
-      await textarea.trigger("input");
-      (0, _vitest.expect)(wrapper.find(".yh-ai-sender__command-panel").exists()).toBe(false);
-    });
-    (0, _vitest.it)("should hide commands on blur after delay", async () => {
-      const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-        props: {
-          commands
-        }
-      });
-      const textarea = wrapper.find("textarea");
-      await textarea.setValue("/");
-      textarea.element.selectionStart = 1;
-      await textarea.trigger("input");
-      await textarea.trigger("blur");
-      _vitest.vi.advanceTimersByTime(400);
-      await (0, _vue.nextTick)();
-      (0, _vitest.expect)(wrapper.find(".yh-ai-sender__command-panel").exists()).toBe(false);
-    });
-  });
-  (0, _vitest.describe)("Attachments", () => {
-    (0, _vitest.it)("should render attachments and emit remove event", async () => {
-      const attachments = [{
-        id: "1",
-        name: "img.png",
-        type: "image/png",
-        url: "img.png"
-      }, {
-        id: "2",
-        name: "doc.pdf",
-        type: "application/pdf",
-        url: "doc.pdf",
-        status: "uploading",
-        progress: 50
-      }];
-      const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-        props: {
-          attachments
-        }
-      });
-      const items = wrapper.findAll(".yh-ai-sender__attachment-item");
-      (0, _vitest.expect)(items.length).toBe(2);
-      (0, _vitest.expect)(wrapper.find(".yh-ai-sender__progress-bar").exists()).toBe(true);
-      await wrapper.find(".yh-ai-sender__attachment-remove").trigger("click");
-      (0, _vitest.expect)(wrapper.emitted("remove-attachment")[0][0]).toEqual(attachments[0]);
-    });
-  });
-  (0, _vitest.describe)("Drag and Drop", () => {
-    (0, _vitest.it)("should handle dragenter, dragover, dragleave and drop", async () => {
-      const wrapper = (0, _testUtils.mount)(_aiSender.default);
-      const container = wrapper.find(".yh-ai-sender");
-      await container.trigger("dragenter");
-      (0, _vitest.expect)(wrapper.find(".yh-ai-sender__drag-overlay").exists()).toBe(true);
-      await container.trigger("dragover");
-      (0, _vitest.expect)(wrapper.find(".yh-ai-sender__drag-overlay").exists()).toBe(true);
-      const leaveEvent = new DragEvent("dragleave", {
-        clientX: -10,
-        clientY: -10
-      });
-      Object.defineProperty(leaveEvent, "currentTarget", {
-        value: {
-          getBoundingClientRect: () => ({
-            left: 0,
-            right: 100,
-            top: 0,
-            bottom: 100
-          })
-        }
-      });
-      await container.trigger("dragleave", leaveEvent);
-      await (0, _vue.nextTick)();
-      await container.trigger("dragover");
-      const file = new File([""], "test.png", {
-        type: "image/png"
-      });
-      const dropEvent = {
-        dataTransfer: {
-          files: [file]
-        },
-        preventDefault: _vitest.vi.fn()
-      };
-      await container.trigger("drop", dropEvent);
-      (0, _vitest.expect)(wrapper.emitted("upload")).toBeTruthy();
-      (0, _vitest.expect)(wrapper.emitted("upload")[0][0]).toEqual([file]);
-      const leaveOutside = new DragEvent("dragleave", {
-        clientX: -10,
-        clientY: -10
-      });
-      Object.defineProperty(leaveOutside, "currentTarget", {
-        value: {
-          getBoundingClientRect: () => ({
-            left: 0,
-            right: 100,
-            top: 0,
-            bottom: 100
-          })
-        }
-      });
-      await container.trigger("dragleave", leaveOutside);
-      (0, _vitest.expect)(wrapper.vm.isDragging).toBe(false);
-    });
-    (0, _vitest.it)("should ignore drag events when disabled or loading", async () => {
-      const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-        props: {
-          disabled: true
-        }
-      });
-      const container = wrapper.find(".yh-ai-sender");
-      await container.trigger("dragenter");
-      (0, _vitest.expect)(wrapper.find(".yh-ai-sender__drag-overlay").exists()).toBe(false);
-      await container.trigger("dragover");
-      (0, _vitest.expect)(wrapper.find(".yh-ai-sender__drag-overlay").exists()).toBe(false);
-      await container.trigger("drop");
-      (0, _vitest.expect)(wrapper.emitted("upload")).toBeFalsy();
-    });
-  });
-  (0, _vitest.describe)("Edge Cases", () => {
-    (0, _vitest.it)("should handle Enter key scenarios", async () => {
-      const wrapper = (0, _testUtils.mount)(_aiSender.default);
-      const textarea = wrapper.find("textarea");
-      const preventDefault = _vitest.vi.fn();
-      await textarea.trigger("keydown", {
-        key: "Enter",
-        preventDefault
-      });
-      (0, _vitest.expect)(preventDefault).toHaveBeenCalled();
-      (0, _vitest.expect)(wrapper.emitted("send")).toBeFalsy();
-      const wrapper2 = (0, _testUtils.mount)(_aiSender.default, {
-        props: {
-          modelValue: "   "
-        }
-      });
-      const preventDef2 = _vitest.vi.fn();
-      await wrapper2.find("textarea").trigger("keydown", {
-        key: "Enter",
-        preventDefault: preventDef2
-      });
-      (0, _vitest.expect)(preventDef2).toHaveBeenCalled();
-    });
-    (0, _vitest.it)("should handle slash command boundary cases", async () => {
-      const wrapper = (0, _testUtils.mount)(_aiSender.default, {
-        props: {
-          modelValue: "abc/"
-        }
-      });
-      const textarea = wrapper.find("textarea");
-      await textarea.trigger("input");
-      (0, _vitest.expect)(wrapper.vm.showCommands).toBe(false);
-    });
-  });
-  (0, _vitest.describe)("aiSenderEmits", () => {
-    (0, _vitest.it)("should validate send event", async () => {
-      const {
-        aiSenderEmits
-      } = await Promise.resolve().then(() => require("../src/ai-sender.cjs"));
-      (0, _vitest.expect)(aiSenderEmits.send("hello")).toBe(true);
-      (0, _vitest.expect)(aiSenderEmits.send("")).toBe(true);
-    });
-    (0, _vitest.it)("should pass-through other event validators", async () => {
-      const {
-        aiSenderEmits
-      } = await Promise.resolve().then(() => require("../src/ai-sender.cjs"));
-      (0, _vitest.expect)(aiSenderEmits["update:modelValue"]("text")).toBe(true);
-      (0, _vitest.expect)(aiSenderEmits.change("text")).toBe(true);
-      (0, _vitest.expect)(aiSenderEmits.command({
-        key: "a",
-        label: "b"
-      })).toBe(true);
-      (0, _vitest.expect)(aiSenderEmits.blur(new FocusEvent("blur"))).toBe(true);
-      (0, _vitest.expect)(aiSenderEmits.focus(new FocusEvent("focus"))).toBe(true);
-      (0, _vitest.expect)(aiSenderEmits.clear()).toBe(true);
-      (0, _vitest.expect)(aiSenderEmits["remove-attachment"]({
-        id: "1",
-        name: "f",
-        type: "doc",
-        url: "doc"
-      })).toBe(true);
-      (0, _vitest.expect)(aiSenderEmits.upload([new File([""], "test.png")])).toBe(true);
-    });
-  });
-});