@n8n/chat 0.5.2 → 0.6.0

package/__tests__/index.spec.mjs

@@ -1,172 +0,0 @@
-import { fireEvent, waitFor } from "@testing-library/vue";
-import {
-  createFetchResponse,
-  createGetLatestMessagesResponse,
-  createSendMessageResponse,
-  getChatInputSendButton,
-  getChatInputTextarea,
-  getChatMessage,
-  getChatMessageByText,
-  getChatMessages,
-  getChatMessageTyping,
-  getChatWindowToggle,
-  getChatWindowWrapper,
-  getChatWrapper,
-  getGetStartedButton,
-  getMountingTarget
-} from "@n8n/chat/__tests__/utils";
-import { createChat } from "@n8n/chat/index";
-describe("createChat()", () => {
-  let app;
-  afterEach(() => {
-    vi.clearAllMocks();
-    app.unmount();
-  });
-  describe("mode", () => {
-    it("should create fullscreen chat app with default options", () => {
-      const fetchSpy = vi.spyOn(window, "fetch");
-      fetchSpy.mockImplementationOnce(createFetchResponse(createGetLatestMessagesResponse()));
-      app = createChat({
-        mode: "fullscreen"
-      });
-      expect(getMountingTarget()).toBeVisible();
-      expect(getChatWrapper()).toBeVisible();
-      expect(getChatWindowWrapper()).not.toBeInTheDocument();
-    });
-    it("should create window chat app with default options", () => {
-      const fetchSpy = vi.spyOn(window, "fetch");
-      fetchSpy.mockImplementationOnce(createFetchResponse(createGetLatestMessagesResponse()));
-      app = createChat({
-        mode: "window"
-      });
-      expect(getMountingTarget()).toBeDefined();
-      expect(getChatWindowWrapper()).toBeVisible();
-      expect(getChatWrapper()).not.toBeVisible();
-    });
-    it("should open window chat app using toggle button", async () => {
-      const fetchSpy = vi.spyOn(window, "fetch");
-      fetchSpy.mockImplementationOnce(createFetchResponse(createGetLatestMessagesResponse()));
-      app = createChat();
-      expect(getMountingTarget()).toBeVisible();
-      expect(getChatWindowWrapper()).toBeVisible();
-      const trigger = getChatWindowToggle();
-      await fireEvent.click(trigger);
-      expect(getChatWrapper()).toBeVisible();
-    });
-  });
-  describe("loadPreviousMessages", () => {
-    it("should load previous messages on mount", async () => {
-      const fetchSpy = vi.spyOn(global, "fetch");
-      fetchSpy.mockImplementation(createFetchResponse(createGetLatestMessagesResponse()));
-      app = createChat({
-        mode: "fullscreen",
-        showWelcomeScreen: true
-      });
-      const getStartedButton = getGetStartedButton();
-      await fireEvent.click(getStartedButton);
-      expect(fetchSpy.mock.calls[0][1]).toEqual(
-        expect.objectContaining({
-          method: "POST",
-          headers: {
-            "Content-Type": "application/json"
-          },
-          body: expect.stringContaining('"action":"loadPreviousSession"'),
-          mode: "cors",
-          cache: "no-cache"
-        })
-      );
-    });
-  });
-  describe("initialMessages", () => {
-    it.each(["fullscreen", "window"])(
-      "should show initial default messages in %s mode",
-      async (mode) => {
-        const fetchSpy = vi.spyOn(window, "fetch");
-        fetchSpy.mockImplementationOnce(createFetchResponse(createGetLatestMessagesResponse()));
-        const initialMessages = ["Hello tester!", "How are you?"];
-        app = createChat({
-          mode,
-          initialMessages
-        });
-        if (mode === "window") {
-          const trigger = getChatWindowToggle();
-          await fireEvent.click(trigger);
-        }
-        expect(getChatMessages().length).toBe(initialMessages.length);
-        expect(getChatMessageByText(initialMessages[0])).toBeInTheDocument();
-        expect(getChatMessageByText(initialMessages[1])).toBeInTheDocument();
-      }
-    );
-  });
-  describe("sendMessage", () => {
-    it.each(["window", "fullscreen"])(
-      "should send a message and render a text message in %s mode",
-      async (mode) => {
-        const input = "Hello User World!";
-        const output = "Hello Bot World!";
-        const fetchSpy = vi.spyOn(window, "fetch");
-        fetchSpy.mockImplementationOnce(createFetchResponse(createGetLatestMessagesResponse)).mockImplementationOnce(createFetchResponse(createSendMessageResponse(output)));
-        app = createChat({
-          mode
-        });
-        if (mode === "window") {
-          const trigger = getChatWindowToggle();
-          await fireEvent.click(trigger);
-        }
-        expect(getChatMessageTyping()).not.toBeInTheDocument();
-        expect(getChatMessages().length).toBe(2);
-        await waitFor(() => expect(getChatInputTextarea()).toBeInTheDocument());
-        const textarea = getChatInputTextarea();
-        const sendButton = getChatInputSendButton();
-        await fireEvent.update(textarea, input);
-        expect(sendButton).not.toBeDisabled();
-        await fireEvent.click(sendButton);
-        expect(fetchSpy.mock.calls[1][1]).toEqual(
-          expect.objectContaining({
-            method: "POST",
-            headers: {
-              "Content-Type": "application/json"
-            },
-            body: expect.stringMatching(/"action":"sendMessage"/),
-            mode: "cors",
-            cache: "no-cache"
-          })
-        );
-        expect(fetchSpy.mock.calls[1][1]?.body).toContain(`"${input}"`);
-        expect(getChatMessages().length).toBe(3);
-        expect(getChatMessageByText(input)).toBeInTheDocument();
-        expect(getChatMessageTyping()).toBeVisible();
-        await waitFor(() => expect(getChatMessageTyping()).not.toBeInTheDocument());
-        expect(getChatMessageByText(output)).toBeInTheDocument();
-      }
-    );
-    it.each(["fullscreen", "window"])(
-      "should send a message and render a code markdown message in %s mode",
-      async (mode) => {
-        const input = "Teach me javascript!";
-        const output = '# Code\n```js\nconsole.log("Hello World!");\n```';
-        const fetchSpy = vi.spyOn(window, "fetch");
-        fetchSpy.mockImplementationOnce(createFetchResponse(createGetLatestMessagesResponse)).mockImplementationOnce(createFetchResponse(createSendMessageResponse(output)));
-        app = createChat({
-          mode
-        });
-        if (mode === "window") {
-          const trigger = getChatWindowToggle();
-          await fireEvent.click(trigger);
-        }
-        await waitFor(() => expect(getChatInputTextarea()).toBeInTheDocument());
-        const textarea = getChatInputTextarea();
-        const sendButton = getChatInputSendButton();
-        await fireEvent.update(textarea, input);
-        await fireEvent.click(sendButton);
-        expect(getChatMessageByText(input)).toBeInTheDocument();
-        expect(getChatMessages().length).toBe(3);
-        await waitFor(() => expect(getChatMessageTyping()).not.toBeInTheDocument());
-        const lastMessage = getChatMessage(-1);
-        expect(lastMessage).toBeInTheDocument();
-        expect(lastMessage.querySelector("h1")).toHaveTextContent("Code");
-        expect(lastMessage.querySelector("code")).toHaveTextContent('console.log("Hello World!");');
-      }
-    );
-  });
-});

package/__tests__/setup.js

@@ -1,3 +0,0 @@
-"use strict";
-
-require("@testing-library/jest-dom");

package/__tests__/setup.mjs

@@ -1 +0,0 @@
-import "@testing-library/jest-dom";

package/__tests__/utils/create.d.ts

@@ -1,5 +0,0 @@
-import { createChat } from '@n8n/chat/index';
-export declare function createTestChat(options?: Parameters<typeof createChat>[0]): {
-    unmount: () => void;
-    container: Element;
-};

package/__tests__/utils/create.js

@@ -1,16 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.createTestChat = createTestChat;
-var _index = require("@n8n/chat/index");
-function createTestChat(options = {}) {
-  const app = (0, _index.createChat)(options);
-  const container = app._container;
-  const unmount = () => app.unmount();
-  return {
-    unmount,
-    container
-  };
-}

package/__tests__/utils/create.mjs

@@ -1,10 +0,0 @@
-import { createChat } from "@n8n/chat/index";
-export function createTestChat(options = {}) {
-  const app = createChat(options);
-  const container = app._container;
-  const unmount = () => app.unmount();
-  return {
-    unmount,
-    container
-  };
-}

package/__tests__/utils/fetch.d.ts

@@ -1,3 +0,0 @@
-export declare function createFetchResponse<T>(data: T): () => Promise<Response>;
-export declare const createGetLatestMessagesResponse: (data?: LoadPreviousSessionResponse) => LoadPreviousSessionResponse;
-export declare const createSendMessageResponse: (output: SendMessageResponse) => SendMessageResponse;

package/__tests__/utils/fetch.js

@@ -1,20 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.createFetchResponse = createFetchResponse;
-exports.createSendMessageResponse = exports.createGetLatestMessagesResponse = void 0;
-function createFetchResponse(data) {
-  return async () => ({
-    json: async () => new Promise(resolve => resolve(data))
-  });
-}
-const createGetLatestMessagesResponse = (data = []) => ({
-  data
-});
-exports.createGetLatestMessagesResponse = createGetLatestMessagesResponse;
-const createSendMessageResponse = output => ({
-  output
-});
-exports.createSendMessageResponse = createSendMessageResponse;

package/__tests__/utils/fetch.mjs

@@ -1,9 +0,0 @@
-export function createFetchResponse(data) {
-  return async () => ({
-    json: async () => new Promise((resolve) => resolve(data))
-  });
-}
-export const createGetLatestMessagesResponse = (data = []) => ({ data });
-export const createSendMessageResponse = (output) => ({
-  output
-});

package/__tests__/utils/index.js

@@ -1,38 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _create = require("./create");
-Object.keys(_create).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _create[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _create[key];
-    }
-  });
-});
-var _fetch = require("./fetch");
-Object.keys(_fetch).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _fetch[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _fetch[key];
-    }
-  });
-});
-var _selectors = require("./selectors");
-Object.keys(_selectors).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _selectors[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _selectors[key];
-    }
-  });
-});

package/__tests__/utils/index.mjs

@@ -1,3 +0,0 @@
-export * from "./create.mjs";
-export * from "./fetch.mjs";
-export * from "./selectors.mjs";

package/__tests__/utils/selectors.d.ts

@@ -1,12 +0,0 @@
-export declare function getMountingTarget(target?: any): any;
-export declare function getChatWindowWrapper(): Element | null;
-export declare function getChatWindowToggle(): Element | null;
-export declare function getChatWrapper(): Element | null;
-export declare function getChatMessages(): NodeListOf<Element>;
-export declare function getChatMessage(index: number): Element;
-export declare function getChatMessageByText(text: string): HTMLElement | null;
-export declare function getChatMessageTyping(): Element | null;
-export declare function getGetStartedButton(): Element | null;
-export declare function getChatInput(): Element | null;
-export declare function getChatInputTextarea(): Element | null;
-export declare function getChatInputSendButton(): Element | null;

package/__tests__/utils/selectors.js

@@ -1,58 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getChatInput = getChatInput;
-exports.getChatInputSendButton = getChatInputSendButton;
-exports.getChatInputTextarea = getChatInputTextarea;
-exports.getChatMessage = getChatMessage;
-exports.getChatMessageByText = getChatMessageByText;
-exports.getChatMessageTyping = getChatMessageTyping;
-exports.getChatMessages = getChatMessages;
-exports.getChatWindowToggle = getChatWindowToggle;
-exports.getChatWindowWrapper = getChatWindowWrapper;
-exports.getChatWrapper = getChatWrapper;
-exports.getGetStartedButton = getGetStartedButton;
-exports.getMountingTarget = getMountingTarget;
-var _vue = require("@testing-library/vue");
-var _constants = require("@n8n/chat/constants");
-function getMountingTarget(target = _constants.defaultMountingTarget) {
-  return document.querySelector(target);
-}
-function getChatWindowWrapper() {
-  return document.querySelector(".chat-window-wrapper");
-}
-function getChatWindowToggle() {
-  return document.querySelector(".chat-window-toggle");
-}
-function getChatWrapper() {
-  return document.querySelector(".chat-wrapper");
-}
-function getChatMessages() {
-  return document.querySelectorAll(".chat-message:not(.chat-message-typing)");
-}
-function getChatMessage(index) {
-  const messages = getChatMessages();
-  return index < 0 ? messages[messages.length + index] : messages[index];
-}
-function getChatMessageByText(text) {
-  return _vue.screen.queryByText(text, {
-    selector: ".chat-message:not(.chat-message-typing) .chat-message-markdown p"
-  });
-}
-function getChatMessageTyping() {
-  return document.querySelector(".chat-message-typing");
-}
-function getGetStartedButton() {
-  return document.querySelector(".chat-get-started .chat-button");
-}
-function getChatInput() {
-  return document.querySelector(".chat-input");
-}
-function getChatInputTextarea() {
-  return document.querySelector(".chat-input textarea");
-}
-function getChatInputSendButton() {
-  return document.querySelector(".chat-input .chat-input-send-button");
-}

package/__tests__/utils/selectors.mjs

@@ -1,41 +0,0 @@
-import { screen } from "@testing-library/vue";
-import { defaultMountingTarget } from "@n8n/chat/constants";
-export function getMountingTarget(target = defaultMountingTarget) {
-  return document.querySelector(target);
-}
-export function getChatWindowWrapper() {
-  return document.querySelector(".chat-window-wrapper");
-}
-export function getChatWindowToggle() {
-  return document.querySelector(".chat-window-toggle");
-}
-export function getChatWrapper() {
-  return document.querySelector(".chat-wrapper");
-}
-export function getChatMessages() {
-  return document.querySelectorAll(".chat-message:not(.chat-message-typing)");
-}
-export function getChatMessage(index) {
-  const messages = getChatMessages();
-  return index < 0 ? messages[messages.length + index] : messages[index];
-}
-export function getChatMessageByText(text) {
-  return screen.queryByText(text, {
-    selector: ".chat-message:not(.chat-message-typing) .chat-message-markdown p"
-  });
-}
-export function getChatMessageTyping() {
-  return document.querySelector(".chat-message-typing");
-}
-export function getGetStartedButton() {
-  return document.querySelector(".chat-get-started .chat-button");
-}
-export function getChatInput() {
-  return document.querySelector(".chat-input");
-}
-export function getChatInputTextarea() {
-  return document.querySelector(".chat-input textarea");
-}
-export function getChatInputSendButton() {
-  return document.querySelector(".chat-input .chat-input-send-button");
-}

package/api/generic.d.ts

@@ -1,6 +0,0 @@
-export declare function authenticatedFetch<T>(...args: Parameters<typeof fetch>): Promise<T>;
-export declare function get<T>(url: string, query?: object, options?: RequestInit): Promise<T>;
-export declare function post<T>(url: string, body?: object, options?: RequestInit): Promise<T>;
-export declare function put<T>(url: string, body?: object, options?: RequestInit): Promise<T>;
-export declare function patch<T>(url: string, body?: object, options?: RequestInit): Promise<T>;
-export declare function del<T>(url: string, body?: object, options?: RequestInit): Promise<T>;

package/api/generic.js

@@ -1,68 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.authenticatedFetch = authenticatedFetch;
-exports.del = del;
-exports.get = get;
-exports.patch = patch;
-exports.post = post;
-exports.put = put;
-async function getAccessToken() {
-  return "";
-}
-async function authenticatedFetch(...args) {
-  const accessToken = await getAccessToken();
-  const response = await fetch(args[0], {
-    ...args[1],
-    mode: "cors",
-    cache: "no-cache",
-    headers: {
-      "Content-Type": "application/json",
-      ...(accessToken ? {
-        authorization: `Bearer ${accessToken}`
-      } : {}),
-      ...args[1]?.headers
-    }
-  });
-  return await response.json();
-}
-async function get(url, query = {}, options = {}) {
-  let resolvedUrl = url;
-  if (Object.keys(query).length > 0) {
-    resolvedUrl = `${resolvedUrl}?${new URLSearchParams(query).toString()}`;
-  }
-  return authenticatedFetch(resolvedUrl, {
-    ...options,
-    method: "GET"
-  });
-}
-async function post(url, body = {}, options = {}) {
-  return authenticatedFetch(url, {
-    ...options,
-    method: "POST",
-    body: JSON.stringify(body)
-  });
-}
-async function put(url, body = {}, options = {}) {
-  return authenticatedFetch(url, {
-    ...options,
-    method: "PUT",
-    body: JSON.stringify(body)
-  });
-}
-async function patch(url, body = {}, options = {}) {
-  return authenticatedFetch(url, {
-    ...options,
-    method: "PATCH",
-    body: JSON.stringify(body)
-  });
-}
-async function del(url, body = {}, options = {}) {
-  return authenticatedFetch(url, {
-    ...options,
-    method: "DELETE",
-    body: JSON.stringify(body)
-  });
-}

package/api/generic.mjs

@@ -1,54 +0,0 @@
-async function getAccessToken() {
-  return "";
-}
-export async function authenticatedFetch(...args) {
-  const accessToken = await getAccessToken();
-  const response = await fetch(args[0], {
-    ...args[1],
-    mode: "cors",
-    cache: "no-cache",
-    headers: {
-      "Content-Type": "application/json",
-      ...accessToken ? { authorization: `Bearer ${accessToken}` } : {},
-      ...args[1]?.headers
-    }
-  });
-  return await response.json();
-}
-export async function get(url, query = {}, options = {}) {
-  let resolvedUrl = url;
-  if (Object.keys(query).length > 0) {
-    resolvedUrl = `${resolvedUrl}?${new URLSearchParams(
-      query
-    ).toString()}`;
-  }
-  return authenticatedFetch(resolvedUrl, { ...options, method: "GET" });
-}
-export async function post(url, body = {}, options = {}) {
-  return authenticatedFetch(url, {
-    ...options,
-    method: "POST",
-    body: JSON.stringify(body)
-  });
-}
-export async function put(url, body = {}, options = {}) {
-  return authenticatedFetch(url, {
-    ...options,
-    method: "PUT",
-    body: JSON.stringify(body)
-  });
-}
-export async function patch(url, body = {}, options = {}) {
-  return authenticatedFetch(url, {
-    ...options,
-    method: "PATCH",
-    body: JSON.stringify(body)
-  });
-}
-export async function del(url, body = {}, options = {}) {
-  return authenticatedFetch(url, {
-    ...options,
-    method: "DELETE",
-    body: JSON.stringify(body)
-  });
-}

package/api/index.js

@@ -1,27 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _generic = require("./generic");
-Object.keys(_generic).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _generic[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _generic[key];
-    }
-  });
-});
-var _message = require("./message");
-Object.keys(_message).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _message[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _message[key];
-    }
-  });
-});

package/api/index.mjs

@@ -1,2 +0,0 @@
-export * from "./generic.mjs";
-export * from "./message.mjs";

package/api/message.d.ts

@@ -1,3 +0,0 @@
-import type { ChatOptions } from '@n8n/chat/types';
-export declare function loadPreviousSession(sessionId: string, options: ChatOptions): Promise<any>;
-export declare function sendMessage(message: string, sessionId: string, options: ChatOptions): Promise<any>;

package/api/message.js

@@ -1,33 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.loadPreviousSession = loadPreviousSession;
-exports.sendMessage = sendMessage;
-var _generic = require("@n8n/chat/api/generic");
-async function loadPreviousSession(sessionId, options) {
-  const method = options.webhookConfig?.method === "POST" ? _generic.post : _generic.get;
-  return method(`${options.webhookUrl}`, {
-    action: "loadPreviousSession",
-    [options.chatSessionKey]: sessionId,
-    ...(options.metadata ? {
-      metadata: options.metadata
-    } : {})
-  }, {
-    headers: options.webhookConfig?.headers
-  });
-}
-async function sendMessage(message, sessionId, options) {
-  const method = options.webhookConfig?.method === "POST" ? _generic.post : _generic.get;
-  return method(`${options.webhookUrl}`, {
-    action: "sendMessage",
-    [options.chatSessionKey]: sessionId,
-    [options.chatInputKey]: message,
-    ...(options.metadata ? {
-      metadata: options.metadata
-    } : {})
-  }, {
-    headers: options.webhookConfig?.headers
-  });
-}

package/api/message.mjs

@@ -1,30 +0,0 @@
-import { get, post } from "@n8n/chat/api/generic";
-export async function loadPreviousSession(sessionId, options) {
-  const method = options.webhookConfig?.method === "POST" ? post : get;
-  return method(
-    `${options.webhookUrl}`,
-    {
-      action: "loadPreviousSession",
-      [options.chatSessionKey]: sessionId,
-      ...options.metadata ? { metadata: options.metadata } : {}
-    },
-    {
-      headers: options.webhookConfig?.headers
-    }
-  );
-}
-export async function sendMessage(message, sessionId, options) {
-  const method = options.webhookConfig?.method === "POST" ? post : get;
-  return method(
-    `${options.webhookUrl}`,
-    {
-      action: "sendMessage",
-      [options.chatSessionKey]: sessionId,
-      [options.chatInputKey]: message,
-      ...options.metadata ? { metadata: options.metadata } : {}
-    },
-    {
-      headers: options.webhookConfig?.headers
-    }
-  );
-}