微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

当 React 被 jest 模拟时,Enzyme.mount 为 react-final-form 组件抛出“TypeError: form.subscribe is not a function”

如何解决当 React 被 jest 模拟时,Enzyme.mount 为 react-final-form 组件抛出“TypeError: form.subscribe is not a function”

我在我的测试中安装了一个 react-final-form,并且 useRef 也应该被模拟。 测试失败并显示错误“[TypeError: form.subscribe is not a function]”。 如果 React 没有被模拟,则测试通过。

我无法删除对 useRef 的嘲讽,但看起来它破坏了测试。有人知道如何修复它,或者知道解决方法吗?

import React,{ useRef } from "react";
import { Form } from "react-final-form";

export const FormComponent = () => {
  const handleSubmitClick = () => console.log("submit");
  const inputRef = useRef(null);

  return (
    <Form onSubmit={handleSubmitClick}>
      {({ handleSubmit }) => (
        <form onSubmit={handleSubmit}>
          <input ref={inputRef} type="text" />
          <button type="submit">Submit</button>
        </form>
      )}
    </Form>
  );
};

import React,{useRef} from 'react';
import { configure,mount } from "enzyme";
import Adapter from "@wojtekmaj/enzyme-adapter-react-17";
import { FormComponent } from "./FormComponent";

configure({ adapter: new Adapter() });

// I quess this cause some problem during component mounting
jest.mock("react",() => ({
  ...jest.requireActual("react"),useRef: jest.fn()
}));

describe("FormComponent test",() => {
  it("should render form",() => {
    (useRef).mockReturnValue({
      current: {}
    });    
    const form = mount(<FormComponent />);

    console.log("Form",form.debug());
  });
});

任何想法都会非常有帮助)

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。