Как тестировать React-хуки?

Хук нельзя вызвать вне компонента, поэтому его тестируют либо через компонент, либо через renderHook из Testing Library.

renderHook

import { act, renderHook } from '@testing-library/react';

test('counter', () => {
  const { result } = renderHook(() => useCounter(1));

  expect(result.current.count).toBe(1);

  act(() => result.current.increment());

  expect(result.current.count).toBe(2);
});

Правила

• Любое обновление состояния оборачивается в act, иначе будет предупреждение и устаревший результат.
• Хуку, который зависит от контекста, передают wrapper с нужным провайдером.
• Асинхронные эффекты ждут через waitFor.

Когда проще через компонент

Если хук тесно связан с разметкой (формы, фокус), надёжнее протестировать компонент, который его использует: так проверяется то, что видит пользователь.

Коротко для собеседования

Используем renderHook и act для изолированного хука, а в сложных случаях проверяем его через компонент.