Question

我正在尝试在此处创建简单的刷新器组件

Refresher.js

import { useEffect } from 'react';

const Refresher = ({ onRefresh }) => {
  useEffect(() => {
    const id = setInterval(onRefresh, 60000);
    return () => {
      clearInterval(id);
    };
  }, [onRefresh]);

  return null;
};

export default Refresher;

但是，当我尝试使用jest.useFakeTimers()对其进行测试时，它不起作用了。 jest.runOnlyPendingTimers()

之后也不会调用存根

import React from 'react';
import renderer from 'react-test-renderer';
import Refresher from '../Refresher';

describe('Refresher', () => {
  test('should refresh the result every 60 seconds', () => {
    jest.useFakeTimers();

    const onRefreshSpy = jest.fn();

    const refresher = renderer.create(<Refresher onRefresh={onRefreshSpy} />);

    expect(onRefreshSpy).not.toHaveBeenCalled();
    jest.runOnlyPendingTimers();
    refresher.update(); // Trying force update here

    expect(onRefreshSpy).toHaveBeenCalled();
  });
});

如果没有记错的话，如果组件没有更新，则间隔将不会运行，因此我尝试使用refresher.update()，但似乎并没有真正起作用。

有人知道如何在这里修复测试吗？

Answer 1

您只需要模拟useLayoutEffect而不是useEffect。参见问题here

df['A'] = df['A'].str.extract('(^[^:]*(:.*)$|.*)')
print(df)
          A
0  12:30:45
1  10:44:09
2      8888

使用useEffect和jest.useFakeTimer（）

1 个答案: