useEffect 中的 Jest 測試函數調用

Question

我有以下測試：

  it("should call runValidation when listen_to is set", async () => {
    const updatedProps = {
      item: {
        ...props.item,
        attributes: {
          ...props.item.attributes,
        },
      },
      validation: {
        ...props.validation,
        setValue: jest.fn(),
        runValidation: jest.fn(),
        listenFieldValues: jest.fn(),
      },
    };

    const spyOnValidation = jest.spyOn(
      updatedProps.validation,
      "runValidation"
    );

    render(<Average item={updatedProps.item} validation={props.validation} />);

    expect(spyOnValidation).toHaveBeenCalled();
  });

這是與之相關的用戶界面：

export const Average = ({ item, validation }: ComponentProps): JSX.Element => {
  const { attributes, name } = item;

  const hide_cents = attributes?.hide_cents;
  const [price, setPrice] = useState<number>(Number(item.value || 0));

  useEffect(() => {
    if (attributes?.listen_to) {
      console.log("validation: ", validation);
      setupListenData({ item, validation, callback: setPrice });
      validation.runValidation();
    }
  }, [item, attributes, validation]);
...

我正在嘗試測試在useEffect內部調用了validation.runValidation()但測試失敗：調用次數 0

我也嘗試過使用waitFor但無論有多少次haveBeenCalledTimes(3) or haveBeenCalledTimes(100)測試都通過了

Answer 1

您是否嘗試在此測試中創建一個模擬函數，然后將模擬函數分配給updatedProps.validation.runValidation ，然后您只期望調用模擬函數？

  it("should call runValidation when listen_to is set", () => {
    const mockRunValidation = jest.fn();
    const updatedProps = {
      item: {
        ...props.item,
        attributes: {
          ...props.item.attributes,
        },
      },
      validation: {
        ...props.validation,
        setValue: jest.fn(),
        runValidation: mockRunValidation,
        listenFieldValues: jest.fn(),
      },
    };
    render(<Average item={updatedProps.item} validation={props.validation} />);

    expect(mockRunValidation).toHaveBeenCalled();
  });