homeio

1/* @vitest-environment jsdom */
2
3import { render, screen, waitFor } from "@testing-library/react";
4import { act } from "react";
5import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
6
7const { statusState, terms } = vi.hoisted(() => ({
8  statusState: { isLoading: false, data: { interactive: true } as { interactive: boolean } | undefined },
9  terms: [] as Array<{
10    written: string[];
11    onDataHandler: ((data: string) => void) | null;
12  }>,
13}));
14
15vi.mock("xterm/css/xterm.css", () => ({}));
16vi.mock("@/modules/shell/hooks/useTerminalStatus", () => ({
17  useTerminalStatus: () => statusState,
18}));
19vi.mock("@/modules/shell/components/command-terminal", () => ({
20  CommandTerminal: ({ commandRequest }: { commandRequest: { command: string } | null }) => (
21    <div>Command terminal {commandRequest?.command ?? ""}</div>
22  ),
23}));
24vi.mock("xterm", () => ({
25  Terminal: class {
26    cols = 120;
27    rows = 30;
28    written: string[] = [];
29    onDataHandler: ((data: string) => void) | null = null;
30    constructor() {
31      terms.push(this);
32    }
33    loadAddon() {}
34    open() {}
35    focus() {}
36    reset() {}
37    dispose() {}
38    getSelection() {
39      return "";
40    }
41    attachCustomKeyEventHandler() {}
42    write(data: string) {
43      this.written.push(data);
44    }
45    onData(handler: (data: string) => void) {
46      this.onDataHandler = handler;
47      return { dispose() {} };
48    }
49  },
50}));
51vi.mock("xterm-addon-fit", () => ({ FitAddon: class { fit() {} } }));
52vi.mock("xterm-addon-web-links", () => ({ WebLinksAddon: class {} }));
53
54class FakeSocket {
55  static OPEN = 1;
56  static instances: FakeSocket[] = [];
57  readyState = 0;
58  sent: string[] = [];
59  onopen: (() => void) | null = null;
60  onmessage: ((event: { data: string }) => void) | null = null;
61  onclose: (() => void) | null = null;
62  constructor(public url: string) {
63    FakeSocket.instances.push(this);
64  }
65  send(data: string) {
66    this.sent.push(data);
67  }
68  close() {}
69  open() {
70    this.readyState = FakeSocket.OPEN;
71    this.onopen?.();
72  }
73}
74
75import {
76  parseServerControlMessage,
77  Terminal,
78  terminalSocketUrl,
79} from "@/modules/shell/components/terminal";
80
81describe("Terminal", () => {
82  beforeEach(() => {
83    statusState.isLoading = false;
84    statusState.data = { interactive: true };
85    terms.length = 0;
86    FakeSocket.instances = [];
87    vi.stubGlobal("WebSocket", FakeSocket);
88    vi.stubGlobal(
89      "ResizeObserver",
90      class {
91        observe() {}
92        disconnect() {}
93      },
94    );
95  });
96
97  afterEach(() => {
98    vi.unstubAllGlobals();
99  });
100
101  it("opens a real shell over the WebSocket and shows its output", async () => {
102    render(<Terminal />);
103
104    await waitFor(() => expect(FakeSocket.instances).toHaveLength(1));
105    const socket = FakeSocket.instances[0];
106    expect(socket.url).toBe("ws://localhost:3000/api/terminal");
107
108    act(() => socket.open());
109    expect(socket.sent).toContain(JSON.stringify({ type: "resize", cols: 120, rows: 30 }));
110
111    act(() => socket.onmessage?.({ data: "root@home:~# " }));
112    expect(terms[0].written).toContain("root@home:~# ");
113
114    terms[0].onDataHandler?.("ls\r");
115    expect(socket.sent).toContain(JSON.stringify({ type: "input", data: "ls\r" }));
116  });
117
118  it("drops into the container's shell for Open in Terminal", async () => {
119    render(<Terminal attachRequest={{ id: 1, container: "jellyfin" }} />);
120
121    await waitFor(() => expect(FakeSocket.instances).toHaveLength(1));
122    act(() => FakeSocket.instances[0].open());
123
124    expect(FakeSocket.instances[0].sent).toContain(
125      JSON.stringify({ type: "attach", target: "jellyfin" }),
126    );
127  });
128
129  it("offers a new session after the shell exits", async () => {
130    render(<Terminal />);
131    await waitFor(() => expect(FakeSocket.instances).toHaveLength(1));
132    act(() => FakeSocket.instances[0].open());
133
134    act(() => FakeSocket.instances[0].onclose?.());
135    expect(terms[0].written.join("")).toContain("Press Enter to start a new one");
136
137    act(() => terms[0].onDataHandler?.("\r"));
138    expect(FakeSocket.instances).toHaveLength(2);
139  });
140
141  it("falls back to the command terminal where the shell is unavailable", () => {
142    statusState.data = { interactive: false };
143
144    render(<Terminal attachRequest={{ id: 1, container: "jellyfin" }} />);
145
146    expect(
147      screen.getByText('Command terminal docker exec jellyfin /bin/sh -c "pwd && ls"'),
148    ).toBeTruthy();
149    expect(FakeSocket.instances).toHaveLength(0);
150  });
151});
152
153describe("parseServerControlMessage", () => {
154  it("reads the server's own notices", () => {
155    expect(
156      parseServerControlMessage('{"type":"error","code":"unauthorized","message":"Unauthorized"}'),
157    ).toEqual({ type: "error", code: "unauthorized", message: "Unauthorized" });
158  });
159
160  it("treats everything else as shell output", () => {
161    expect(parseServerControlMessage("total 4\r\n")).toBeNull();
162    expect(parseServerControlMessage('{"type":"other"}')).toBeNull();
163    expect(parseServerControlMessage('{"type": broken')).toBeNull();
164  });
165});
166
167describe("terminalSocketUrl", () => {
168  it("uses wss behind https", () => {
169    expect(terminalSocketUrl({ protocol: "https:", host: "home.example.com" })).toBe(
170      "wss://home.example.com/api/terminal",
171    );
172  });
173});
174