如何在Mocha中使用ajax请求测试vue组​​件方法？

Question

我有一个vue组件，方法发出ajax请求，我尝试了Mocha提供的done()来测试这个方法，但是覆盖率报告似乎无法正常工作（成功和完整方法不包括在内）根据报告）。代码如下：

• demo.vue中的Vue组件代码

```

loadData: function(cb) {
      var that = this;
      $.ajax(
        {
          url: "/api/nodesWithTask",
          async: true,
          success: function(data) {
            that.nodes = data;
          },
          complete: function(xhr, status) {
            if (cb && typeof (cb) == 'function') {
              cb.call();
            }
          }
        }
      );
    }

```

• 测试代码

```

import Vue from 'vue'
import demo from '@/components/demo'
describe('demo.vue', () => {
  var mockData = {"id":"abc"};
  var server;
  var vm;
  before(function () { 
    server = sinon.fakeServer.create(); 
    //mock response for ajax request
    server.respondWith("/api/nodesWithTask",[200,{"Content-Type":"application/json"},JSON.stringify(mockData)]);
    const Constructor = Vue.extend(demo);
    vm = new Constructor().$mount();
  });

  after(function () { server.restore(); });

  it('load data async', (done) => {
    vm.loadData(function(){
      done();
    });
  })
})

```

提前感谢任何建议。

Answer 1

我的领导建议，我发现一个{1}}配置选项的sinon假服务器如下

magic

将respondImmediately选项设置为true后，测试可以正常运行。