努力模拟自定义反应钩子

时间:2021-05-10 11:26:09

标签: reactjs jestjs react-hooks enzyme

我想知道是否有人可以帮助我解决我在这里出错的地方...

尝试模拟自定义钩子,但 jest/enzyme 未记录对该函数的任何调用。

我的测试:

const mockHandleEditProtection = jest.fn();
const mockUseEditProtection = jest.fn(() => [null, mockHandleEditProtection]);

jest.mock('../../common/useEditProtection', () => ({
  __esModule: true,
  default: () => mockUseEditProtection,
}));

describe('my test', () => {
  const wrapper = mount(<AComponent proposal={mockProposalDataWithEnrichedValues}/>)
  it('should call useEditProtection with proposal object', () => {
      expect(mockUseEditProtection).toBeCalledWith(mockProposalDataWithEnrichedValues);
  });

  it('should call edit protection when edit button is clicked', () => {
    wrapper.find(TableCell).at(4).find(Button).at(0).simulate('click');
    expect(mockHandleEditProtection).toBeCalled();
  });
})

如何在组件中使用钩子的基本示例...

const AComponent = ({proposal}) => {
    const [EditWarning, editProtection] = useEditProtection(proposal);
    return <div>
        {EditWarning}
        <button onClick={editProtection}>Edit</button>
    </div>
};

我很困惑为什么它不起作用,所以感谢任何指针!

0 个答案:

没有答案