reactjs – 如何在JEST中模拟$.ajax调用

前端之家收集整理的这篇文章主要介绍了reactjs – 如何在JEST中模拟$.ajax调用前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我是React&的新手JEST框架,我尝试在响应中执行ajax调用,如下所示,如果我收到成功数据,它将重定向到主页,否则会显示错误消息.
let params ={
    userName : this.state.userName,password : this.state.passWord
};

$.ajax({
    url: '/reactApp/login',dataType: 'json',contentType: 'application/json;',type: 'POST',data: JSON.stringify(params),success: function (successData) {
        if (typeof(Storage) !== "undefined") {
            localStorage.setItem('userProfile',JSON.stringify(successData));
            browserHistory.push('/reactApp/Home');
        } else {
            alert("The browser version is not supported.Please use Internet explorer 11,Chrome or firefox.")
        }
    }.bind(this),error: function(errorData){
        this.setState({
            errorMessage: errorData.message,errorDisplay: true,});
    }.bind(this);

反应代码正在工作,我试图在JEST中为ajax调用的上述代码编写一个单元测试,

jest.unmock('jquery');
  jest.unmock('./AjaxLogin');

  var $= require('jquery');
  const Login = TestUtils.renderIntoDocument(<AjaxLogin />);
  expect(Login).toBeDefined();
  var handleClick = jest.genMockFunction();

  var button = TestUtils.findRenderedDOMComponentWithTag(Login,'button');

  TestUtils.Simulate.click(button);

  Login.handleClick(); 
  expect($.ajax).toBeCalledWith({
     url: '/reactApp/login',data: JSON.stringify({userName : 'testing',password : 'password'}),success: jasmine.any(Function),error: jasmine.any(Function)
  });

当我运行此测试用例时,我收到以下错误消息,我不知道上面的代码有什么问题.

预期使用Object调用函数

谁能帮助我在单元测试脚本中找出问题.

unmock方法删除mock,所以你需要使用Jest mock方法.
Jest repo有几个例子描述了基本用法,包括如何模拟jquery以及如何使用react,因此值得一看.

猜你在找的Ajax相关文章