reactjs - Jest : setTimeout is being called too many times

Question

我正在测试 react使用 setTimeout 的组件. 问题是Jest是说 setTimeout被调用，即使它显然不是。 有一个setTimeout当鼠标悬停在组件上时，从 ui 中删除一些东西，另一个暂停计时器。

我尝试添加 console.log()哪里setTimeout是并且控制台日志永远不会被调用，这意味着应用程序中的 setTimeout 没有被调用。

//app
const App = (props) => {
  const [show, setShow] = useState(true);
  const date = useRef(Date.now());
  const remaining = useRef(props.duration);

  let timeout;
  useEffect(() => {
    console.log('Should not run');
    if (props.duration) {
      timeout = setTimeout(() => {
        setShow(false)
      }, props.duration);
    }
  }, [props.duration]);

  const pause = () => {
    remaining.current -= Date.now() - date.current;
    clearTimeout(timeout);
  }

  const play = () => {
    date.current = Date.now();
    clearTimeout(timeout);
    console.log('should not run');
    timeout = setTimeout(() => {
      setIn(false);
    }, remaining.current);
  }

  return (
    <div onMouseOver={pause} onMouseLeave={play}>
      { show &&
        props.content
      }
    </div>
  )
}

//test
it('Should not setTimeout when duration is false', () => {
  render(<Toast content="" duration={false} />);
  //setTimeout is called once but does not come from App
  expect(setTimeout).toHaveBeenCalledTimes(0);
});

it('Should pause the timer when pauseOnHover is true', () => {
    const { container } = render(<Toast content="" pauseOnHover={true} />);

  fireEvent.mouseOver(container.firstChild);
  expect(clearTimeout).toHaveBeenCalledTimes(1);
  fireEvent.mouseLeave(container.firstChild);

  //setTimeout is called 3 times but does not come from App
  expect(setTimeout).toHaveBeenCalledTimes(1);
});

所以在第一次测试中，setTimeout不应该被调用，但我收到它被调用一次。在第二个测试中，setTimeout应该被调用一次，但被调用了 3 次。 该应用程序运行良好，我只是不明白 jest 发生了什么|暗示 setTimeout被称为比它更多。

Answer 1

我在第一次 Jest 测试中遇到完全相同的问题，总是调用 setTimeout一次(没有我的组件触发它)。通过记录这个“未知”的参数 setTimeout调用，我发现它是用 _flushCallback 调用的函数和延迟 0 .

查看 react-test-renderer 的存储库显示 _flushCallback函数定义 here . Scheduler哪里_flushCallback是明确声明它使用 setTimeout 的一部分当它在非 DOM 环境中运行时(在进行 Jest 测试时就是这种情况)。

我不知道如何正确地继续研究这个，就目前而言，这似乎是对次数的测试setTimeout被称为不可靠。