reactjs - 使用带有 react 的 sinon 假计时器以使用 useEffect 强制帧上的特定时间

Question

我正在尝试将 SinonFakeTimers与一个名为remotion渲染动画组件视频的库一起使用。我正在使用framer-motion它使用基于时间的持续时间值来制作动画。它使用performanceAPI 来保持一切同步。

这在浏览器环境中效果很好，但是由于我要渲染，所以我的帧渲染时间不是实时的。我想伪造时间，以便framer-motion认为已经过去了一帧的时间。

FakeTimers 与 一起工作shouldAdvanceTime: true，所以我猜下面的解决方案应该可以工作。

这就是我正在尝试的，但帧渲染永远不会继续。我猜可能会有一些干扰以某种方式阻止反应渲染，但我无法弄清楚。该clock.tick功能似乎不起作用。

import FakeTimers from '@sinonjs/fake-timers';

export const RemotionVideo: React.FC = () => {
    var clock = FakeTimers.install();

    const frame = useCurrentFrame();
    useEffect(() => {
        console.log('The frame changed to ' + frame);
        clock.tick(33);
    }, [frame]);