假Ajax请求 [英] Fake Ajax request

问题描述

为了检查提交一个Ajax请求，当用户提交表单，我用茉莉花来实现以下测试（1）。

该测试顺利通过，但看着JavaScript控制台我得到以下错误 500（内部服务器错误）。

由于我不关心服务器的响应，我的问题是：结果
1）如果我或者我应该不会在意这个错误。结果
2）将是更好假Ajax请求，以避免内部服务器错误？如果是，如何在我的环境？

---

（1）

 定义（[
    backendController
]，功能（backendController）{
    //一些code
    描述（当按钮处理解雇'，函数（）{
        beforeEach（函数（）{
            spyOn（backendController，'submitRequest1'）andCallThrough（）。
            this.view =新的MyView的（{
                EL：$（'＆LT; D​​IV＆GT;＆LT;形式＆GT;＆LT;输入类型=提交值=提交/＆GT;＆LT; /表＆GT;＆LT; / DIV＆GT;'）
            }）;
            。this.view $ el.find（形式）提交（）;
        }）;
        它（'backendController.submitRequest1应该叫'，函数（）{
            期待（backendController.submitRequest1）.toHaveBeenCalled（）;
        }）;
    }）;
}）;
 

---

（2）

  // backendController对象
返回{
    submitRequest1：功能（消息）{
        返回$阿贾克斯（{
            网址：'someUrl'，
            输入：POST，
            数据类型：JSON，
            数据：{
                消息：消息
            }
        }）。完成（功能（）{
            //一些code
        }）;
    }
}
 

---

（3）

  //在MyView的submitForm
submitForm：函数（事件）{
    。事件preventDefault（）;    VAR formElement = event.currentTarget;    如果（formElement.checkValidity＆放大器;＆放大器;！formElement.checkValidity（））{
        this.onError（）;
    }其他{
        backendController。 。submitRequest1（一些数据）来完成（this.onSuccess）.fail（this.onError）;
    }
}
 

解决方案

您测试说的backendController.submitRequest1应该叫的，所以你只关心方法被调用。所以，只是不 andCallThrough（），你就可以自由的烦恼。

更新

也许你不得不 preventDefault（）在提交事件的这样：

  spyOn（backendController，'submitRequest1'）andCallFak​​e（函数（五）{ÉpreventDefault（）;}）;
 

更新2

c您已经添加到这个问题我还是建议你停止code作为执行越早越好检查你的$ C $的休息后。只是直到到达（）的考验，这仍然是直到 backendController.submitRequest1 被调用。

在这种情况下是不够用一个简单的模拟的的方法，因为在收益的这种方法随后被使用，您的模拟的应尊重这个：

  // code无测试
VAR fakeFunction =功能（）{
  this.done =函数（）{返回此};
  this.fail =函数（）{返回此};
  返回此;
}spyOn（backendController，'submitRequest1'）andCallFak​​e（fakeFunction）。
 

当事情开始如此复杂的测试是一种症状，也许他们可以组织好。

In order to check the submission of an ajax request, when a user submit a form, I implemented the following test using jasmine (1).

The test is successfully passed but looking at javascript console I get the following error 500 (Internal Server Error).

Since I don't care the server response, my questions are:
1) Should I or should I not care about this error.
2) Will it be better to fake the ajax request to avoid Internal Server Error? if yes, how in my context?

---

(1)

define([
    'backendController'
], function (backendController) {
    // some code
    describe('When button handler fired', function () {
        beforeEach(function () {
            spyOn(backendController, 'submitRequest1').andCallThrough();
            this.view = new MyView({
                el: $('<div><form><input type="submit" value="Submit" /></form></div>')
            });
            this.view.$el.find('form').submit();
        });
        it('backendController.submitRequest1 should be called', function () {
            expect(backendController.submitRequest1).toHaveBeenCalled();
        });
    });
});

---

(2)

// backendController object
return {
    submitRequest1: function (message) {
        return $.ajax({
            url: 'someUrl',
            type: 'POST',
            dataType: 'json',
            data: {
                message: message
            }
        }).done(function () {
            // some code
        });
    }
}

---

(3)

// submitForm in MyView
submitForm: function (event) {
    event.preventDefault();

    var formElement =  event.currentTarget;

    if (formElement.checkValidity && !formElement.checkValidity()) {
        this.onError();
    } else {
        backendController. submitRequest1('some data').done(this.onSuccess).fail(this.onError);
    }
}

解决方案

Your test says "backendController.submitRequest1 should be called" so you only care about the method to be called. So, just don't andCallThrough() and you'll be free of troubles.

Update

Maybe you have to preventDefault() in the submit event so:

spyOn(backendController, 'submitRequest1').andCallFake(function(e) { e.preventDefault(); });

Update 2

After checking the rest of your code you have added to the question I still suggest to stop your code execution as sooner as possible. Just until the test in arriving, and this is still until backendController.submitRequest1() is called.

In this case is not enough with a simple mock in the method due the return of this method is used subsequently and your mock should respect this:

// code no tested
var fakeFunction = function(){
  this.done = function(){ return this };
  this.fail = function(){ return this };
  return this;
}

spyOn(backendController, 'submitRequest1').andCallFake( fakeFunction );

When things start to be so complicate to test is a symptom that maybe they can be organized better.

这篇关于假Ajax请求的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！