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

Question

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

不知怎的,我仍然不明白为什么我应该嘲笑$ httpBackend.为了弄清楚我还不清楚什么,我会写一个小例子:

想象一下,我有一个从URL获取数据的服务 (myService):

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

假设对URL" http://example.com/data " 的GET调用返回以下数据:

{
    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 ")中设置的内容.响应(mockData); .

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

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

先感谢您!

Answer 1

你必须以某种方式区分：

• 单元测试
• 集成测试
• 端到端测试

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

因此，您要确保该代码单元按预期工作。

举个例子：

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

   return sum;
}; 

当你嘲笑httpBackend这里时，你实际上并不关心你是否得到1、2、3或5、6、7。你要确保添加任何数字，将它们相加并返回。

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

端到端测试还包括适当的后端并检查数据是否正常。

AngularJS文档说得很清楚：

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

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