Reactjs 基于选择器和挂钩的反应酶测试表

Reactjs 基于选择器和挂钩的反应酶测试表,reactjs,typescript,enzyme,react-testing-library,Reactjs,Typescript,Enzyme,React Testing Library,我正在尝试测试一个表单,并检查是否已触发对redux的调度 我在这里共享组件和测试。(无法在沙箱上运行它) 所以在那个测试中,我没有点击按钮(键入submit)并更改禁用的类型(我设法更新了值) 我如何以一种简单的方式测试表单,以及如何检查我的redux登录操作是否已启动 我的测试: it.only('should click on the button ', async () => { const useSelectorSpy = jest.spyOn(redux, 'u

我正在尝试测试一个表单,并检查是否已触发对redux的调度 我在这里共享组件和测试。(无法在沙箱上运行它)

所以在那个测试中,我没有点击按钮(键入submit)并更改禁用的类型(我设法更新了值)

我如何以一种简单的方式测试表单,以及如何检查我的redux登录操作是否已启动

我的测试:

  it.only('should click on the button  ', async () => {
    const useSelectorSpy = jest.spyOn(redux, 'useSelector');
    const useDispatchSpy = jest.spyOn(redux, 'useDispatch');
    useDispatchSpy.mockImplementation(() => (cb: any) => cb);
    useSelectorSpy.mockReturnValue({
      authenticated: false,
      isLoading: false,
      authError: false
    });
    const wrapper = mountWithIntl(<Login />);
    let usernameTextFiled = findComponentByProperty(wrapper, 'username-textfield').first();
    let passwordTextfiled = findComponentByProperty(wrapper, 'password-textfield').first();

    act(() => {
      usernameTextFiled.props().onChange?.({
        currentTarget: {
          // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
          // @ts-ignore
          value: 'ttt'
        }
      });
      passwordTextfiled.props().onChange?.({
        currentTarget: {
          // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
          // @ts-ignore
          value: 'password'
        }
      });
    });

    wrapper.update();
    usernameTextFiled = findComponentByProperty(wrapper, 'username-textfield').first();
    let loginButton = findComponentByProperty(wrapper, 'submit-button').first();

     // this is work
     expect(loginButton.prop('disabled')).toEqual(false);

    const form = wrapper.find('form').at(0);
    await submitForm(form ,loginButton);
    loginButton = findComponentByProperty(wrapper, 'submit-button').first();
    wrapper.update();
    loginButton = findComponentByProperty(wrapper, 'submit-button').first();

     expect(loginButton.prop('disabled')).toBe(true);
export const submitForm = async (nativeFormWrapper: any, button) => {
  await act(async () => {
    nativeFormWrapper.simulate('submit', { preventDefault: () => {} });

    button.props().onSubmit?.({
        preventDefault: () => {}
    });
  });
};