nandi/oripublic Fork 0
f5c963af3c1597c0274ce4a99705dbd92a7d1cba
Commits
Clone
git clone https://git.rickub.com/nandi/ori.git
git clone ssh://git@rickub.com/nandi/ori.git

Host key fingerprint (ed25519): SHA256:iycHnxEyq0Q7uyVpB7JlznP0G7JrTPXLYRcAU5CSLhc — verify it before your first connect.

forked from bots-garden/ori

Workspace.test.tsx · 67 lines · 1.9 KBTypeScript Blame HistoryRaw
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
import {
	act,
	fireEvent,
	render,
	screen,
	waitFor,
} from "@testing-library/react";
import { beforeEach, describe, expect, it, vi } from "vitest";
import {
	DEFAULT_FILE_TREE_WIDTH,
	resetWorkspace,
	setFileTreeWidth,
	toggleWorkspace,
	useWorkspace,
} from "../workspace";
import { Workspace } from "./Workspace";

vi.mock("../api", () => ({
	listFiles: vi.fn().mockResolvedValue({ path: "/w", entries: [] }),
	readFile: vi.fn().mockResolvedValue({ path: "/w/x", content: "" }),
	writeFile: vi.fn().mockResolvedValue(undefined),
	rawFileUrl: (path: string) => `/api/raw?path=${encodeURIComponent(path)}`,
}));

// The real terminal drags xterm and a WebSocket along; a stub is enough here.
vi.mock("./TerminalPane", () => ({
	TerminalPane: () => <div data-testid="terminal-pane" />,
}));

/** Waits for the (mocked) file listing to settle so React stays quiet. */
function treeLoaded() {
	return waitFor(() => expect(screen.queryByText("loading…")).toBeNull());
}

describe("Workspace", () => {
	beforeEach(() => {
		localStorage.clear();
		resetWorkspace();
		toggleWorkspace();
	});

	it("applies the file tree width as a CSS custom property", async () => {
		render(<Workspace />);
		await treeLoaded();
		const panel = screen.getByRole("complementary", { name: "workspace" });
		expect(panel.style.getPropertyValue("--filetree-width")).toBe(
			`${DEFAULT_FILE_TREE_WIDTH}px`,
		);

		act(() => setFileTreeWidth(360));
		expect(panel.style.getPropertyValue("--filetree-width")).toBe("360px");
	});

	it("resizes the file tree from the handle and restores it on double-click", async () => {
		render(<Workspace />);
		await treeLoaded();
		const handle = screen.getByRole("separator", {
			name: "Resize the file tree",
		});

		fireEvent.keyDown(handle, { key: "End" });
		expect(useWorkspace.getState().fileTreeWidth).toBe(800);

		fireEvent.doubleClick(handle);
		expect(useWorkspace.getState().fileTreeWidth).toBe(DEFAULT_FILE_TREE_WIDTH);
	});
});