desertthunder.dev
learn and share notes on atproto (wip) 馃
malfestio.stormlightlabs.org/
readability
solid
axum
atproto
srs
1import type { Note } from "$lib/model";
2import { cleanup, render, screen } from "@solidjs/testing-library";
3import { afterEach, describe, expect, it, vi } from "vitest";
4import { NotesGraph } from "../NotesGraph";
5
6vi.mock("@solidjs/router", () => ({ useNavigate: () => vi.fn() }));
7
8const mockNotes: Note[] = [{
9 id: "note-1",
10 owner_did: "did:plc:test",
11 title: "First Note",
12 body: "Content with [[Second Note]] link",
13 tags: ["test"],
14 visibility: { type: "Private" },
15 created_at: "2026-01-01T00:00:00Z",
16 updated_at: "2026-01-01T00:00:00Z",
17}, {
18 id: "note-2",
19 owner_did: "did:plc:test",
20 title: "Second Note",
21 body: "This links to [[First Note]]",
22 tags: ["test", "linked"],
23 visibility: { type: "Private" },
24 created_at: "2026-01-01T00:00:00Z",
25 updated_at: "2026-01-01T00:00:00Z",
26}, {
27 id: "note-3",
28 owner_did: "did:plc:test",
29 title: "Orphan Note",
30 body: "No wikilinks here",
31 tags: [],
32 visibility: { type: "Private" },
33 created_at: "2026-01-01T00:00:00Z",
34 updated_at: "2026-01-01T00:00:00Z",
35}];
36
37describe("NotesGraph", () => {
38 afterEach(cleanup);
39
40 it("renders the graph container", () => {
41 render(() => <NotesGraph notes={mockNotes} />);
42 expect(screen.getByTestId("notes-graph")).toBeInTheDocument();
43 });
44
45 it("renders SVG element", () => {
46 render(() => <NotesGraph notes={mockNotes} />);
47 const container = screen.getByTestId("notes-graph");
48 const svg = container.querySelector("svg");
49 expect(svg).toBeInTheDocument();
50 });
51
52 it("creates nodes group", () => {
53 render(() => <NotesGraph notes={mockNotes} />);
54 const container = screen.getByTestId("notes-graph");
55 const nodesGroup = container.querySelector(".nodes");
56 expect(nodesGroup).toBeInTheDocument();
57 });
58
59 it("creates links group", () => {
60 render(() => <NotesGraph notes={mockNotes} />);
61 const container = screen.getByTestId("notes-graph");
62 const linksGroup = container.querySelector(".links");
63 expect(linksGroup).toBeInTheDocument();
64 });
65
66 it("renders with custom dimensions", () => {
67 render(() => <NotesGraph notes={mockNotes} width={1200} height={800} />);
68 const container = screen.getByTestId("notes-graph");
69 expect(container).toBeInTheDocument();
70 });
71
72 it("handles empty notes array", () => {
73 render(() => <NotesGraph notes={[]} />);
74 expect(screen.getByTestId("notes-graph")).toBeInTheDocument();
75 });
76
77 it("highlights current note when provided", () => {
78 render(() => <NotesGraph notes={mockNotes} currentNoteId="note-1" />);
79 expect(screen.getByTestId("notes-graph")).toBeInTheDocument();
80 });
81});