Testy integracyjneCustom HookPowr贸t do lekcji
Custom hook useDarkMode umo偶liwia zapisywanie wyboru trybu graficznego (ciemny lub jasny ) do localStorage.
Twoim zadaniem jest napisanie testu integracyjnego, kt贸ry sprawdzi, 偶e custom hook poprawnie ustawia i odczytuje dane do localStorage. Napisz dwa testy - jeden, kt贸ry sprawdzi czy hook poprawnie inicjalizuje dane, oraz drugi, kt贸ry sprawdzi czy dane s膮 aktualizowane po wywo艂aniu funkcji toggleDarkMode.
Zgodnie z dobrymi praktykami nazywaj testy po angielsku!
W kodzie testu znajdziesz ju偶 wszystkie potrzebne importy. Mo偶esz skupi膰 si臋 wi臋c na pisaniu test贸w przy pomocy Jesta i react-testing-library.
Tw贸j kod 馃捇
import React, { useState, useEffect } from "react"; export function useDarkMode() { const [isDarkMode, setIsDarkMode] = useState(false); useEffect(() => { // Check if dark mode is already enabled in local storage const storedDarkMode = window.localStorage.getItem("darkMode"); if (storedDarkMode) { setIsDarkMode(JSON.parse(storedDarkMode)); } }, []); const toggleDarkMode = () => { const newDarkModeState = !isDarkMode; setIsDarkMode(newDarkModeState); // Update dark mode preference in local storage window.localStorage.setItem( "darkMode", JSON.stringify(newDarkModeState) ); }; return [isDarkMode, toggleDarkMode]; }
Tests