单元测试AngularJS服务

时间:2013-11-02 20:54:30

标签: unit-testing angularjs

我正在试图弄清楚如何测试依赖$http的AngularJS服务。

使用$httpBackend模拟AJAX帖子(whenPOST)时,您发布的对象是否确定了响应?

这是我的服务和我的测试,例如:

(function () {
    "use strict"

    var app = angular.module('cs');

    app.service('PlateCheckService', ['$http', function ($http) {
        return {
            checkPlate: function (plateNumber) {
                return $http.post('PlateCheck/Index', {
                    plateNumber: plateNumber
                }).then(function (response) {
                    return {
                        message: response.data.VehicleAtl === null ? 'Clean' : 'Hot',
                        alertClass: response.data.VehicleAtl === null ? 'alert-success' : 'alert-danger'
                    }
                });
            }
        }
    }]);

}());

测试

/// <reference path="../libs/angular-1.0.8/angular.js" />
/// <reference path="../libs/angular-1.0.8/angular-mocks.js" />
/// <reference path="../libs/jasmine-1.3.0/jasmine.js" />
/// <reference path="../app.js" />
/// <reference path="../services/plate-check-service.js" />

describe('Plate Check Service', function () {
    var httpBackend,
        service;

    beforeEach(function () {
        module('cs');

        inject(function ($httpBackend, PlateCheckService) {
            httpBackend = $httpBackend;
            httpBackend.whenPOST('PlateCheck/Index', { plateNumber: '123456' }).respond({
                response: {
                    message: 'Clean',
                    alertClass: 'alert-success'
                }
            });
            httpBackend.whenPOST('PlateCheck/Index', { plateNumber: '123456789' }).respond({
                response: {
                    message: 'Hot',
                    alertClass: 'alert-danger'
                }
            });

            service = PlateCheckService;
        });
    });

    it('Should return a clean plate.', function () {
        var result;

        service.checkPlate('123456').then(function (response) {
            result = response;
        });

        httpBackend.flush();
        expect(result.message).toBe('Clean');
        expect(result.alertClass).toBe('alert-success');
    });
});

测试结果

Test 'Plate Check Service:Should return a clean plate.' failed
    Expected 'Hot' to be 'Clean'.
    Expected 'alert-danger' to be 'alert-success'.
in D:\Code\Scripts\angular\specs\plate-check-service-specs.js (line 35)

0 passed, 1 failed, 1 total (chutzpah).

========== Total Tests: 0 passed, 1 failed, 1 total ==========

看起来它没有考虑plateNumber我传递给服务的{{1}}。

我原本预计这个测试会通过。

这有意义吗?

1 个答案:

答案 0 :(得分:9)

您使用的是when而不是expect$httpBackend可以以两种不同的模式运行。来自the docs

  

有两种方法可以指定应返回的测试数据   当被测代码生成http时,模拟后端的http响应   请求:

     
      
  • $ httpBackend.expect - 指定请求期望
  •   
  • $ httpBackend.when - 指定后端定义
  •   
     

请求期望与后端定义请求期望提供了一种方法来对请求进行断言   应用程序并定义这些请求的响应。测试会   如果没有做出预期的请求或者在预期请求中发出请求,则会失败   错误的订单。

     

后端定义允许您为您的后端定义假后端   如果提出特定请求或不提出声明的应用程序   不是,如果提出请求,它只返回训练有素的响应。考试   无论是否在测试期间提出请求,都会通过。

如果您将设置更改为使用expectPOST,则模拟会将请求考虑在内。

希望这有帮助。