AngularJS - 通过 $httpBackend 模拟数据有什么意义？

Question

我刚刚开始通过 Jasmine 在 AngularJS 中编写我的第一个单元测试。

不知何故，我仍然不明白为什么我应该模拟 $httpBackend。为了弄清楚我还不清楚的地方，我会写一个小例子:

想象我有一个 服务 (我的服务) 这是从 URL 获取数据:

 function getData() {
    return $http.get("http://example.com/data")
       .then(function (response) {
          return response.data;
        });
 }

让我们假设一个 GET 电话 到 URL“ http://example.com/data”返回以下数据:

{
    firstname: "John",
    lastname: "Doe"
}

对应的 测试 看起来像这样:

describe("Service: myService", function () {

    beforeEach(module("myApp"));

    var myService, $httpBackend;

    beforeEach(inject(function (_myService_, _$httpBackend_) {
        myService = _myService_;
        $httpBackend = _$httpBackend_;
    }));

    afterEach(function () {
        $httpBackend.verifyNoOutstandingExpectation();
        $httpBackend.verifyNoOutstandingRequest();
    });

    it("should get data", function() {
        var mockData = {datakey: "datavalue"};
        $httpBackend.whenGET("http://example.com/data").respond(mockData);

        var promise = myService.getData();
        $httpBackend.flush();

        promise.then(function(response){
            expect(response).toEqual(mockData)
        });
    })
});

除非我弄错了，测试应该通过，尽管模拟数据不等于真实数据。无论我如何设置模拟数据，测试总是会通过，因为服务函数总是会被重定向到 $httpBackend.whenGET(" http://example.com/data ").respond(mockData); 中设置的内容。

我认为这种测试的目的是检查从 GET 调用返回的数据 [在这种情况下 myService.getData()] 是否真的是预期数据，而不是一些随机模拟数据。那么模拟数据而不是检查 myService.getData 是否返回真实数据 {firstname: "John", lastname: "Doe"} 的实际意义是什么？

我很清楚我也可以将模拟数据设置为 {firstname: "John", lastname: "Doe"}，但是当来自 URL 的真实数据是动态的时，模拟数据和真实数据不会再次平等。

先感谢您!

Answer 1

你必须以某种方式区分:

单元测试

集成测试

端到端测试

您想要的是对 getData() 函数进行单元测试。我假设您不在乎在这种情况下数据是否正确。你要什么 要测试的是是否调用了正确的 URL .

So you are making sure this unit of your code is working as expected.

拿这个例子:

var add = function(endpoint) {
  var sum = 0;
  endpoint().then(function(numberArray) {
    numberArray.forEach(number) {
      sum = sum + number;
    }
   });

   return sum;
}; 

当你 mock httpBackend在这里，你实际上并不关心你得到的是 1、2、3 还是 5、6、7。你想确保你添加任何数字，你把它们加起来并返回它们。

您的情况要简单得多，因此您可以测试 URL 是否正确，仅此而已。

An End-to-End test would also include a proper backend and checks if the data is ok.

AngularJS documentation明确表示:

 it('should fetch authentication token', function() {
   $httpBackend.expectGET('/auth.py');
   var controller = createController();
   $httpBackend.flush();
 });

在此示例中，您要确保调用的是正确的 URL/端点。如果您确实获得了正确的 token ，则调用真正的后端的集成测试或端到端测试更合适。