angularjs – 通过Resharper在茉莉花测试的控制器中设置模块
|
我可以使用Resharper 9.2通过PhantomJ成功测试控制器使用茉莉花.作为Testrunner.
我按照https://blogs.endjin.com/2014/09/unit-testing-angularjs-with-visual-studio-resharper-and-teamcity/的说明设置Resharper. 这是有效的：如果我不指定它所依赖的模块,我可以运行一个控制器的测试： 控制器： var moduleName;
(function (moduleName) {
'use strict';
var testableController = (function () {
function testableController($scope) {
var _this = this;
this.$scope = $scope;
$scope.title = "Welcome";
}
testableController.className = 'testableController';
return testableController;
}());
moduleName.testableController = testableController;
})(moduleName || (moduleName = {}));
spec文件看起来像这样 ///<reference path="~/Scripts/jasmine/jasmine.js"/>
///<reference path="~/Scripts/jasmine/angular.js"/>
///<reference path="~/Scripts/jasmine/angular-mocks.js"/>
///<reference path="~/Scripts/angular-ui/ui-bootstrap.min.js" />
///<reference path="~/Scripts/jasmine/controllers.js"/>
///<reference path="~/Scripts/App/Controllers/testableController.js" />
///<reference path="~/Scripts/App/AppJasmine.js" />
describe("Controllers",function() {
beforeEach(module("moduleName"));
describe("Jasmine testableController",function () {
var scope,controller;
beforeEach(inject(function ($rootScope,$controller) {
scope = $rootScope.$new();
controller = $controller('testableController',{ $scope: scope });
}));
it('should set the page title as "Welcome"',function () {
expect(scope.title).toBe('Welcome');
});
});
});
真正的控制器使用角ui引导“ui.bootstrap”.控制器在页面上工作,如果我将其更改为下一个示例,但是当我尝试测试它有一个错误 Error: [$injector:unpr] Unknown provider: $templateRequestProvider <- $templateRequest <- $uibModal http://errors.angularjs.org/1.2.24/$injector/unpr?p0=%24templateRequestProvider%20%3C-%20%24templateRequest%20%3C-%20%24uibModal in http://localhost:61032/referenceFile?path=~/webui/trunk/Netvacation.Pegasus.WebUI/Scripts/jasmine/angular.js (line 3802) 控制器依赖Bootstrap angular.module('moduleName',['ui.bootstrap']);
var moduleName;
(function (moduleName) {
'use strict';
var testableController = (function () {
function testableController($scope,$uibModal) {
var _this = this;
this.$scope = $scope;
this.$uibModal = $uibModal;
$scope.title = "Welcome";
}
testableController.className = 'testableController';
return testableController;
}());
moduleName.testableController = testableController;
})(moduleName || (moduleName = {}));
**编辑1 ** beforeEach(
function () {
module("ui.bootstrap");
module("moduleName");
}
);
但有相同的错误. 编辑2 http://angular-ui.github.io/bootstrap/ AngularJS v1.2.24 编辑3
我知道两种策略来模拟一个服务,具有多种语法变体,如Angular中的所有内容…您可以简单地将一个对象文字添加到控制器声明中,也可以创建自己的服务,并使用$provider将它们添加到模块中：
如果服务只是一些数据层或API的包装器,您可以使用文字对象来模拟其功能,并在控制器构造函数中注入,遵循示例语法,可以这样完成： var currentAuth;
beforeEach(inject(function ($rootScope,$controller) {
scope = $rootScope.$new();
currentAuth = {uid: 1,name: juan,getFriends: function() { ... }};
controller = $controller('TestableCtrl',{'$scope': $scope,'currentAuth': currentAuth });
}));
在这种情况下,’currentAuth’是在应用程序中提供当前记录的用户的服务. 这只有在不需要在对象定义的函数中注入任何服务时才有效.这将相当于创建一个值服务并将其注入到模块中.如果嘲笑服务中的方法本身需要任何服务,则必须创建一个工厂或服务,将该服务添加到模块中,然后像其他任何定制服务一样注入.看到我用来模拟角火认证服务的这个例子： var $controller,$rootScope,$scope,$location,Auth;
beforeEach(function(){
module('planner.login');
module(function($provide){
$provide.factory('Auth',function($q){
return {
$signInWithEmailAndPassword: function(email,pass) {
return $q.reject({error: 'ERROR'});
}
};
});
return null;
});
});
beforeEach(function(){
inject(function($controller,_Auth_) {
$scope = $rootScope.$new();
Auth = _Auth_;
$controller("TestableCtrl",{
$scope: $scope,Auth: Auth,$stateParams: {}
});
});
});
在这个示例中,我正在创建一个使用$q服务返回有角度承诺的新工厂(这不需要在Chrome上进行测试,但PhantomJS没有Promise规范).请注意,您需要两个beforeEach,一个将提供程序添加到模块,另一个将提供程序注入到控制器中. 使用哪一个取决于你想要测试什么,以及你需要深入模拟原始服务行为.在您使用uibmodal的情况下,您可能需要在某个时间点调用“.open”,并且已经调用了间谍,但是您只需要创建一个具有该属性的对象,并对该对象的属性进行间谍.所以第一种方法应该是足够的. 所以你的代码应该是这样的： describe("Controllers",controller,uibModal;
beforeEach(inject(function ($rootScope,$controller) {
scope = $rootScope.$new();
uibModal = { open: function() { return 'Whatever'; } }
controller = $controller('testableController',{ $scope: scope,$uibModal: uibModal });
}));
it('should set the page title as "Welcome"',function () {
expect(scope.title).toBe('Welcome');
// you will probably do something like this at some point to verify
// that the modal gets opened on click or following any other action:
// var spy = spyOn(uibModal,'open');
// expect(spy).toHaveBeenCalled();
});
});
});
我希望它有帮助,请告诉我,如果有什么不清楚,我也在学习测试AngularJS应用程序,并希望知道这是否有助于AngularUI. （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |