首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

当使用react- test -library在表单中提交时,如何测试已调用的函数?

当使用react-test-library在表单中提交时,可以通过以下步骤来测试已调用的函数:

  1. 导入所需的测试工具和库:
代码语言:txt
复制
import { render, fireEvent } from '@testing-library/react';
import YourComponent from './YourComponent';
  1. 创建一个mock函数来模拟已调用的函数:
代码语言:txt
复制
const mockFunction = jest.fn();
  1. 渲染组件并获取表单元素:
代码语言:txt
复制
const { getByTestId } = render(<YourComponent onSubmit={mockFunction} />);
const submitButton = getByTestId('submit-button');
  1. 模拟用户操作并触发表单提交:
代码语言:txt
复制
fireEvent.click(submitButton);
  1. 断言已调用的函数是否被调用:
代码语言:txt
复制
expect(mockFunction).toHaveBeenCalled();

完整的测试代码示例:

代码语言:txt
复制
import { render, fireEvent } from '@testing-library/react';
import YourComponent from './YourComponent';

test('should call the onSubmit function when the form is submitted', () => {
  const mockFunction = jest.fn();
  const { getByTestId } = render(<YourComponent onSubmit={mockFunction} />);
  const submitButton = getByTestId('submit-button');

  fireEvent.click(submitButton);

  expect(mockFunction).toHaveBeenCalled();
});

这样,当使用react-test-library在表单中提交时,你就可以测试已调用的函数了。请注意,上述示例中的YourComponent是一个自定义组件,你需要根据实际情况进行替换。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

领券