单元测试 – 单元测试AngularJS服务

我试图找出如何测试我的AngularJS服务,它依赖于$http.

当使用$httpBackend来模拟AJAX post(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 total ==========

看起来它没有考虑到我正在传递给服务器的服务器的plateNumber.

我本来会期待这个测试通过.

这有任何意义吗?

你正在使用一个而不是期望. $httpBackend可以以两种不同的模式运行.从 the docs

There are two ways to specify what test data should be returned as
http responses by the mock backend when the code under test makes http
requests:

  • $httpBackend.expect – specifies a request expectation
  • $httpBackend.when – specifies a backend deFinition

Request Expectations vs Backend DeFinitions Request expectations provide a way to make assertions about requests made by the
application and to define responses for those requests. The test will
fail if the expected requests are not made or they are made in the
wrong order.

Backend deFinitions allow you to define a fake backend for your
application which doesn’t assert if a particular request was made or
not,it just returns a trained response if a request is made. The test
will pass whether or not the request gets made during testing.

如果您将设置更改为使用expectPOST,则模拟程序将考虑请求.

希望这可以帮助.

相关文章

ANGULAR.JS:NG-SELECTANDNG-OPTIONSPS:其实看英文文档比看中...
AngularJS中使用Chart.js制折线图与饼图实例  Chart.js 是...
IE浏览器兼容性后续前言 继续尝试解决IE浏览器兼容性问题,...
Angular实现下拉菜单多选写这篇文章时,引用文章地址如下:h...
在AngularJS应用中集成科大讯飞语音输入功能前言 根据项目...
Angular数据更新不及时问题探讨前言 在修复控制角标正确变...