Проверьте React Hook, который использует Resize Observer - PullRequest
Новая
       8

Проверьте React Hook, который использует Resize Observer

0 голосов
/ 18 октября 2019

Я создал простой Hook, который использует ResizeObserver за кулисами для запуска обновления setState каждый раз при изменении размера элемента.

Это работает в браузере, но теперь у меня проблема в том, чточто я понятия не имею, как написать тесты для него. Я пробовал react-testing-library/hooks, но ловушка никогда не вызывается, и я думаю, что это из-за ResizeObserver.

Я пробовал с Jest, Enzyme, @ testing-library, но я не могу найти способ действительно запустить тест против него.

По сути, в тесте я создаю компонент 

function Component {
  const [ref, width] = myHook();

  return (
     <div ref={ref}>{width}</div>
  )
}

Затем устанавливаю, например:

window.innerWidth = 400 (я пытался изменить размер и вызватьподключить внутри функции act, но ничего). В этот момент ловушка прочитает ref.current.width и вернет значение width

Я ожидаю, что value изменится при изменении размера, но это не так. Однако этот точный компонент при использовании в браузере работает нормально. Как я могу убедиться, что ResizeObserver вызван? Я также импортировал полифилл, но ничего. Mocking ResizeObserver лишит меня возможности проверить ловушку, и я не могу вызвать ловушку вне React-функции! Любая помощь приветствуется, спасибо!

...