0

I'm using react-intersection-observer in this component, when this element is inView, doSomething will be called. It is expected to trigger doSomething every time this element is seen by the user.

const Component = () => {
  const { ref, inView } = useInView();

  useEffect(() => {
        if(inView) {
            doSomething();
        }
    }, [inView])

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

This works as expected, however, I don't know how to properly write this test case.

(useInView as jest.Mock).mockImplementation(() => ({inView: true}));
render(<Component />);
expect(doSomething).toHaveBeenCalledTimes(1); // Test passed

(useInView as jest.Mock).mockImplementation(() => ({inView: false}));
(useInView as jest.Mock).mockImplementation(() => ({inView: true}));
expect(doSomething).toHaveBeenCalledTimes(2); // Test failed
Lin Du
  • 88,126
  • 95
  • 281
  • 483
wtf512
  • 4,487
  • 9
  • 33
  • 55

0 Answers0