desertthunder.dev
learn and share notes on atproto (wip) 馃
malfestio.stormlightlabs.org/
readability
solid
axum
atproto
srs
1import "fake-indexeddb/auto";
2import { cleanup, render, screen } from "@solidjs/testing-library";
3import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
4
5// Create a controllable mock store
6const mockState = { state: "idle" as string, pending: 0, conflicts: 0 };
7
8vi.mock(
9 "$lib/sync-store",
10 () => ({
11 syncStore: {
12 syncState: () => mockState.state,
13 pendingCount: () => mockState.pending,
14 conflictCount: () => mockState.conflicts,
15 },
16 }),
17);
18
19import { SyncIndicator } from "../SyncIndicator";
20
21describe("SyncIndicator", () => {
22 beforeEach(() => {
23 mockState.state = "idle";
24 mockState.pending = 0;
25 mockState.conflicts = 0;
26 });
27
28 afterEach(cleanup);
29
30 it("renders synced state by default", () => {
31 render(() => <SyncIndicator />);
32 expect(screen.getByText("Synced")).toBeInTheDocument();
33 });
34
35 it("renders syncing state with spinner", () => {
36 mockState.state = "syncing";
37 render(() => <SyncIndicator />);
38 expect(screen.getByText("Syncing...")).toBeInTheDocument();
39 });
40
41 it("renders error state", () => {
42 mockState.state = "error";
43 render(() => <SyncIndicator />);
44 expect(screen.getByText("Sync error")).toBeInTheDocument();
45 });
46
47 it("renders offline state", () => {
48 mockState.state = "offline";
49 render(() => <SyncIndicator />);
50 expect(screen.getByText("Offline")).toBeInTheDocument();
51 });
52
53 it("shows pending count when items are pending", () => {
54 mockState.pending = 3;
55 render(() => <SyncIndicator />);
56 expect(screen.getByText("3 pending")).toBeInTheDocument();
57 });
58
59 it("shows conflict count when conflicts exist", () => {
60 mockState.conflicts = 2;
61 render(() => <SyncIndicator />);
62 expect(screen.getByText("2 conflicts")).toBeInTheDocument();
63 });
64
65 it("hides pending badge when count is zero", () => {
66 mockState.pending = 0;
67 render(() => <SyncIndicator />);
68 expect(screen.queryByText(/pending/)).not.toBeInTheDocument();
69 });
70
71 it("hides conflict badge when count is zero", () => {
72 mockState.conflicts = 0;
73 render(() => <SyncIndicator />);
74 expect(screen.queryByText(/conflicts/)).not.toBeInTheDocument();
75 });
76});