Question

我正在尝试构建一个Qunit测试来测试ajax post调用。我正在使用mockajax来模拟通话。但是，我无法通过异步调用进行测试。

这是我的源代码：

source.js：

ajaxFunc  = function(element){
  $.post({
  type:'POST',
  url: '/temp/',
  dataType:'json',
  success: function(data){
    element.text("changed in func");
  },
  error: function(data){
    //do something
  },
  timeout: 60000
      });
}

syncFun = function(element){
  element.text("changed in func");
}

这是我的测试代码：

tests2.js

function mockSuccess(){
  $.mockjax({
    url: "/temp/",
    responseText:  { success: true }
  });
}

QUnit.test( "test ajax async", function( assert ) {
  mockSuccess();
  var done = assert.async();
  var element = document.createElement("div");
  ajaxFunc($(element));
  $(element).text("old");
  setTimeout(function() {
    assert.strictEqual($(element).text(), 'changed in func');
    done();
  });
});

QUnit.test( "test sync", function( assert ) {
  var element = document.createElement("div");
  $(element).text("old");
  syncFun($(element));
  assert.strictEqual($(element).text(), 'changed in func');
});

第一次测试失败，第二次测试成功。如果我在成功回调中的source.js中添加注释，我实际上看到帖子成功并更改了元素文本。

换句话说，除了测试帖子的结果外，一切都正常。

我已经查看了https://qunitjs.com/cookbook/并且堆栈溢出的示例没有运气。

Answer 1

看起来我只需要添加一些毫秒来让异步调用工作：

QUnit.test( "test ajax async", function( assert ) {
  mockSuccess();
  var done = assert.async();
  var element = document.createElement("div");
  ajaxFunc($(element));
  $(element).text("old");
  setTimeout(function() {
   assert.strictEqual($(element).text(), 'changed in func');
   done();
  }, 800);
  // ^^^
});

我在github中看过这样的例子，因为我猜这是正确的，但我可以看到你没有把时间函数设置得足够高的问题。

我已经移动了成功发生的所有处理：和错误：在post函数之外，所以我可以独立于ajax调用测试它，但我仍然想测试各种类型错误的实际帖子。

使用mockajax进行Qunit ajax异步调用

1 个答案: