Не проходит тест кастомного react хука
Необходимо протестировать кастомный хук, но тест не проходит, так как, видимо,нет доступа к tasks. Как решить эту проблему, если в реальности в браузере всё работает?
import { useEffect, useState } from "react";
import { ITask } from "../types/task.interface";
const useTasks = () => {
const [tasks, setTasks] = useState<ITask[]>([]);
const addNewTask = (value: string) => {
const newTask: ITask = {
id: tasks[0] ? tasks[tasks.length - 1].id + 1 : 0,
isDone: false,
title: value,
};
setTasks([...tasks, newTask]);
};
useEffect(() => {
const tasks = JSON.parse(localStorage.getItem("tasks") as string);
setTasks(tasks);
}, []);
useEffect(() => {
localStorage.setItem("tasks", JSON.stringify(tasks));
}, [tasks]);
return {
addNewTask
};
};
export default useTasks;
Тест:
import { act, renderHook } from "@testing-library/react";
import useTasks from "./useTasks";
describe("useTasks", () => {
test("should add a new task", () => {
const { result } = renderHook(() => useTasks());
act(() => {
result.current.addNewTask("New Task");
});
expect(result.current.tasks.length).toBe(1);
expect(result.current.tasks[0].title).toBe("New Task");
});
});
Пробовал менять tasks[0] на tasks.length > 0, ошибка такая же. Также, если из хука возвращаю tasks, то все равно не работает.
Источник: Stack Overflow на русском