使用 angular-translate 调用对 AngularJS 服务进行单元测试

Question

我尝试了多种不同的方法来为调用 angular-translate 的 AngularJS 服务编写单元测试，但我就是无法解决问题。任何意见，将不胜感激。这是我最有希望的例子：

(function() {
    var app = angular.module("theApp", ["pascalprecht.translate"]);

    var theService = function($translate) {
        var theFunction = function(data) {
            return $translate("FOO", { input: data.in }).then(function(trans) {
                data.out = trans;
            });
        };

        return {
            theFunction: theFunction
        };
    };

    app.factory("theService", ["$translate", theService]);
}());

describe("theService", function() {
    beforeEach(module("theApp", function($translateProvider, $provide) {
        $translateProvider.useLoader('customLoader');
        $provide.service('customLoader', function($q) {
            return function() {
                var deferred = $q.defer();
                deferred.resolve({
                    "FOO": "foo {{input}}"
                });
                return deferred.promise;
            };
        });
    }));

    it("function translates input", inject(function($rootScope, theService) {
        var data = { in: "bar", out: "fail" };
        theService.theFunction(data);
        $rootScope.$apply();
        expect(data.out).toBe("foo bar");
    }));
});

可在此处找到 JSFiddle：http://jsfiddle.net/danBhentschel/q71r874t/

Answer 1

好的。我想我自己想出来了。我从这里的测试开始：

https://github.com/angular-translate/angular-translate/blob/master/test/unit/service/translate.spec.js#L409

而且我能够慢慢地将这个通过的测试变成我想做的事情：

(function() {
    var app = angular.module("theApp", ["pascalprecht.translate"]);

    var theService = function($translate) {
        var theFunction = function(data) {
            return $translate("FOO", { input: data.in }).then(function(trans) {
                data.out = trans;
            });
        };

        return {
            theFunction: theFunction
        };
    };

    app.factory("theService", ["$translate", theService]);
}());

describe("theService", function() {
    var $rootScope;

    beforeEach(module("theApp", function($translateProvider, $provide) {
        $translateProvider.useLoader("customLoader");
        $provide.service("customLoader", function($q) {
            return function() {
                var deferred = $q.defer();
                deferred.resolve({
                    "FOO": "foo {{input}}"
                });
                return deferred.promise;
            };
        });
    }));

    beforeEach(inject(function ($translate, _$rootScope_) {
        $rootScope = _$rootScope_;
        $translate.use("en_US");
        $rootScope.$apply();
    }));

    it("function translates input", inject(function(theService) {
        var data = { in: "bar", out: "fail" };
        theService.theFunction(data);
        $rootScope.$apply();
        expect(data.out).toBe("foo bar");
    }));
});

可以在这里找到带有解决方案的 JSFiddle：http://jsfiddle.net/danBhentschel/yLt3so14/

请随时指出我犯的任何愚蠢错误。我对此还是有点陌生。

使用 angular-translate 调用对 AngularJS 服务进行单元测试

Unit testing an AngularJS service with angular-translate calls

javascript

angularjs

unit-testing

jasmine

angular-translate