Skip to content

Commit cd0287f

Browse files
committed
✅ write new tests
1 parent a6fbad6 commit cd0287f

File tree

2 files changed

+158
-101
lines changed

2 files changed

+158
-101
lines changed

Diff for: package.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,8 @@
5858
"@types/react-dom": "^18.3.0",
5959
"@vitest/coverage-v8": "^2.0.3",
6060
"@vitest/ui": "^2.0.5",
61-
"jsdom": "^24.1.1",
61+
"fake-indexeddb": "^6.0.0",
62+
"jsdom": "^25.0.1",
6263
"np": "^7.6.3",
6364
"prettier": "^3.3.3",
6465
"react": "^18.3.1",

Diff for: test.ts

+156-100
Original file line numberDiff line numberDiff line change
@@ -1,141 +1,197 @@
1+
import "fake-indexeddb/auto";
2+
13
import { describe, expect, test } from "vitest";
24
import { act, renderHook } from "@testing-library/react";
3-
import useDb from "./index.js";
5+
import useDb, { type UseDbOptions } from "./index.js";
46

57
describe("use-db", () => {
6-
test("defaultValue accepts lazy initializer (like useState)", () => {
7-
const { result } = renderHook(() =>
8-
useDb("todos", {
9-
defaultValue: () => ["first", "second"],
10-
}),
11-
);
12-
13-
const [todos] = result.current;
14-
expect(todos).toStrictEqual(["first", "second"]);
15-
});
8+
describe("optimistic", () => {
9+
test("defaultValue accepts lazy initializer (like useState)", () => {
10+
const key = crypto.randomUUID();
11+
const { result } = renderHook(() =>
12+
useDb(key, {
13+
defaultValue: () => ["first", "second"],
14+
}),
15+
);
1616

17-
test("initial state is written into the state", () => {
18-
const { result } = renderHook(() =>
19-
useDb("todos", { defaultValue: ["first", "second"] }),
20-
);
17+
const [todos] = result.current;
18+
expect(todos).toStrictEqual(["first", "second"]);
19+
});
2120

22-
const [todos] = result.current;
23-
expect(todos).toStrictEqual(["first", "second"]);
24-
});
21+
test("initial state is written into the state", () => {
22+
const key = crypto.randomUUID();
23+
const { result } = renderHook(() =>
24+
useDb(key, {
25+
defaultValue: ["first", "second"],
26+
}),
27+
);
2528

26-
test("updates state", () => {
27-
const { result } = renderHook(() =>
28-
useDb("todos", { defaultValue: ["first", "second"] }),
29-
);
29+
const [todos] = result.current;
30+
expect(todos).toStrictEqual(["first", "second"]);
31+
});
32+
33+
test("updates state", () => {
34+
const key = crypto.randomUUID();
35+
const { result } = renderHook(() =>
36+
useDb(key, {
37+
defaultValue: ["first", "second"],
38+
}),
39+
);
3040

31-
act(() => {
32-
const setTodos = result.current[1];
41+
act(() => {
42+
const setTodos = result.current[1];
43+
setTodos(["third", "forth"]);
44+
});
3345

34-
setTodos(["third", "forth"]);
46+
const [todos] = result.current;
47+
expect(todos).toStrictEqual(["third", "forth"]);
3548
});
3649

37-
const [todos] = result.current;
38-
expect(todos).toStrictEqual(["third", "forth"]);
39-
});
50+
test("updates state with callback function", () => {
51+
const key = crypto.randomUUID();
52+
const { result } = renderHook(() =>
53+
useDb(key, {
54+
defaultValue: ["first", "second"],
55+
}),
56+
);
4057

41-
test("updates state with callback function", () => {
42-
const { result } = renderHook(() =>
43-
useDb("todos", { defaultValue: ["first", "second"] }),
44-
);
58+
act(() => {
59+
const setTodos = result.current[1];
4560

46-
act(() => {
47-
const setTodos = result.current[1];
61+
setTodos((value) => [...value, "third", "forth"]);
62+
});
4863

49-
setTodos((value) => [...value, "third", "forth"]);
64+
const [todos] = result.current;
65+
expect(todos).toStrictEqual(["first", "second", "third", "forth"]);
5066
});
5167

52-
const [todos] = result.current;
53-
expect(todos).toStrictEqual(["first", "second", "third", "forth"]);
54-
});
68+
test("removes item from state", () => {
69+
const key = crypto.randomUUID();
70+
const { result } = renderHook(() =>
71+
useDb(key, {
72+
defaultValue: ["first", "second"],
73+
}),
74+
);
75+
76+
{
77+
act(() => {
78+
const setTodos = result.current[1];
79+
setTodos(["third", "forth"]);
80+
});
81+
const [todos] = result.current;
82+
expect(todos).toStrictEqual(["third", "forth"]);
83+
}
84+
85+
{
86+
act(() => {
87+
const removeItem = result.current[2];
88+
removeItem();
89+
});
90+
const [todos] = result.current;
91+
expect(todos).toStrictEqual(["first", "second"]);
92+
}
93+
});
5594

56-
test("removes item from state", () => {
57-
const { result } = renderHook(() =>
58-
useDb("todos", { defaultValue: ["first", "second"] }),
59-
);
95+
test("persists state across hook re-renders", () => {
96+
const key = crypto.randomUUID();
97+
const { result, rerender } = renderHook(() =>
98+
useDb(key, {
99+
defaultValue: ["first", "second"],
100+
}),
101+
);
60102

61-
{
62103
act(() => {
63104
const setTodos = result.current[1];
64-
setTodos(["third", "forth"]);
105+
setTodos(["third", "fourth"]);
65106
});
107+
108+
rerender();
109+
66110
const [todos] = result.current;
67-
expect(todos).toStrictEqual(["third", "forth"]);
68-
}
111+
expect(todos).toStrictEqual(["third", "fourth"]);
112+
});
113+
114+
test("handles complex objects", () => {
115+
const complexObject = {
116+
nested: { array: [1, 2, 3], value: "test" },
117+
};
118+
const key = crypto.randomUUID();
119+
const { result } = renderHook(() =>
120+
useDb(key, { defaultValue: complexObject }),
121+
);
122+
123+
const [storedObject] = result.current;
124+
expect(storedObject).toEqual(complexObject);
69125

70-
{
71126
act(() => {
72-
const removeItem = result.current[2];
73-
removeItem();
127+
const setObject = result.current[1];
128+
setObject((prev) => ({
129+
...prev,
130+
nested: { ...prev.nested, value: "updated" },
131+
}));
74132
});
75-
const [todos] = result.current;
76-
expect(todos).toStrictEqual(["first", "second"]);
77-
}
78-
});
79133

80-
test("persists state across hook re-renders", () => {
81-
const { result, rerender } = renderHook(() =>
82-
useDb("persistentTodos", { defaultValue: ["first", "second"] }),
83-
);
84-
85-
act(() => {
86-
const setTodos = result.current[1];
87-
setTodos(["third", "fourth"]);
134+
const [updatedObject] = result.current;
135+
expect(updatedObject).toEqual({
136+
nested: { array: [1, 2, 3], value: "updated" },
137+
});
88138
});
89139

90-
rerender();
140+
const key = crypto.randomUUID();
141+
test("handles undefined as a valid state", () => {
142+
const { result } = renderHook(() => useDb(key));
91143

92-
const [todos] = result.current;
93-
expect(todos).toStrictEqual(["third", "fourth"]);
94-
});
144+
const [initialState] = result.current;
145+
expect(initialState).toBeUndefined();
95146

96-
test("handles complex objects", () => {
97-
const complexObject = { nested: { array: [1, 2, 3], value: "test" } };
98-
const { result } = renderHook(() =>
99-
useDb("complexObject", { defaultValue: complexObject }),
100-
);
101-
102-
const [storedObject] = result.current;
103-
expect(storedObject).toEqual(complexObject);
104-
105-
act(() => {
106-
const setObject = result.current[1];
107-
setObject((prev) => ({
108-
...prev,
109-
nested: { ...prev.nested, value: "updated" },
110-
}));
111-
});
147+
act(() => {
148+
const setState = result.current[1];
149+
setState("defined");
150+
});
112151

113-
const [updatedObject] = result.current;
114-
expect(updatedObject).toEqual({
115-
nested: { array: [1, 2, 3], value: "updated" },
152+
const [definedState] = result.current;
153+
expect(definedState).toBe("defined");
154+
155+
act(() => {
156+
const setState = result.current[1];
157+
setState(undefined);
158+
});
159+
160+
const [finalState] = result.current;
161+
expect(finalState).toBeUndefined();
116162
});
117163
});
118164

119-
test("handles undefined as a valid state", () => {
120-
const { result } = renderHook(() => useDb("undefinedState"));
165+
describe("non-optimistic", () => {
166+
test("initial state is written into the state", () => {
167+
const key = crypto.randomUUID();
168+
const { result } = renderHook(() =>
169+
useDb(key, {
170+
optimistic: false,
171+
defaultValue: ["first", "second"],
172+
}),
173+
);
121174

122-
const [initialState] = result.current;
123-
expect(initialState).toBeUndefined();
124-
125-
act(() => {
126-
const setState = result.current[1];
127-
setState("defined");
175+
const [todos] = result.current;
176+
expect(todos).toStrictEqual(["first", "second"]);
128177
});
129178

130-
const [definedState] = result.current;
131-
expect(definedState).toBe("defined");
179+
test("updates state", async () => {
180+
const key = crypto.randomUUID();
181+
const { result } = renderHook(() =>
182+
useDb(key, {
183+
optimistic: false,
184+
defaultValue: ["first", "second"],
185+
}),
186+
);
132187

133-
act(() => {
134-
const setState = result.current[1];
135-
setState(undefined);
136-
});
188+
await act(() => {
189+
const setTodos = result.current[1];
190+
return setTodos(["third", "forth"]);
191+
});
137192

138-
const [finalState] = result.current;
139-
expect(finalState).toBeUndefined();
193+
const [todos] = result.current;
194+
expect(todos).toStrictEqual(["third", "forth"]);
195+
});
140196
});
141197
});

0 commit comments

Comments
 (0)