我使用John papa angular风格的向导,我的控制器看起来像这样:
遵循John papa style controller style guide风格
function testController() {
var vm = this;
vm.model = { name: "controllerAs vm test" };
}
我的测试代码如下所示:
describe('Controller: testController', function () {
beforeEach(module('myApp'));
var testController;
beforeEach(inject(function ($controller) {
scope = {};
testController = $controller('testController', {
});
}));
it('should have vm.model defined and testController.vm.model is equal to controllerAs vm test', function () {
expect(testController.vm).toBeDefined();
expect(testController.vm.model).toBeDefined();
expect(testController.vm.model.name).toEqual("controllerAs vm test");
});
});
结果:
测试失败:结果消息:需要定义未定义。在堆栈
所以我的问题是,我们如何从这里测试vm.model和其他变量?我没有在指南中找到合适的指南:controllers
发布于 2015-02-11 22:39:24
通过vm = this;
,vm
等于实例本身
因此,所有属性都直接挂在对象上。
function foo(){
var vm = this;
vm.name = 'Josh';
}
var myFoo = new foo();
myFoo.name; // 'Josh';
因此,您需要做的就是更改期望以删除vm
属性。
expect(testController).toBeDefined();
expect(testController.model).toBeDefined();
expect(testController.model.name).toEqual("controllerAs vm test");
为了证明这个,下面是您的确切示例,以及相关的Jasmine测试。
function testController() {
var vm = this;
vm.model = {
name: "controllerAs vm test"
};
}
angular.module('myApp', [])
.controller('testController', testController);
describe('Controller: testController', function() {
beforeEach(module('myApp'));
var testController;
beforeEach(inject(function($controller) {
scope = {};
testController = $controller('testController', {});
}));
it('should have model defined and testController.model.name is equal to controllerAs vm test', function() {
expect(testController).toBeDefined();
expect(testController.model).toBeDefined();
expect(testController.model.name).toEqual("controllerAs vm test");
});
it('should not have a property called vm', function() {
expect(testController.vm).toBeUndefined();
});
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.2.1/jasmine.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.2.1/jasmine.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.2.1/jasmine-html.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.2.1/boot.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.4/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.4/angular-mocks.js"></script>
发布于 2016-04-09 13:56:29
testController
is vm
,因为您在控制器中设置了var vm = this
。因此,为了使测试代码更类似于控制器代码,您可以尝试在测试中将控制器也设置为vm
,而不是testController
describe('Controller: testController', function () {
// we work with "vm" instead of "testController" to have consistent verbiage
// in test and controller
var vm;
beforeEach(module('app'));
beforeEach(inject(function ($controller) {
vm = $controller('testController', {}, {});
}));
it('should have vm.model defined and testController.vm.model is equal to controllerAs vm test', function () {
// vm=this in controller
expect(vm)
.toBeDefined();
// Testing primitives
expect(vm.foo)
.toBeDefined();
expect(vm.foo)
.toEqual('bar');
// Testing objects
expect(vm.model)
.toBeDefined();
expect(vm.model.name)
.toEqual("Batman");
// Testing a method
expect(vm.greet())
.toBeDefined();
expect(vm.greet())
.toEqual('Hello There');
});
});
控制器的代码
(function () {
'use strict';
angular
.module('app')
.controller('testController', testController);
/* @ngInject */
function testController() {
var vm = this;
// Primitives
vm.foo = 'bar';
// Objects
vm.model = {
name: 'Batman'
};
// Methods
vm.greet = function () {
return 'Hello There';
};
}
})();
希望这能有所帮助。祝好运。
发布于 2016-06-15 05:57:54
我将创建一个新模块,并将其作为依赖项注入到应用程序的模块中,以使其简单且可测试。使用John Papa的Style Guide测试控制器:
(function () {
'use strict';
angular
.module('test')
.controller('testController', testController);
function testController() {
var vm = this;
vm.model = { name: "controllerAs vm test" };
}
})();
规范现在看起来像这样:
'use strict';
describe('testController', function() {
var testController;
beforeEach(module('test'));
beforeEach(function () {
inject(function($injector) {
testController = $injector.get('$controller')('testController', {});
});
});
it('should have model defined and testController.name is equal to controllerAs vm test', function() {
expect(testController).toBeDefined();
expect(testController.name).toEqual("controllerAs vm test");
});
});
希望这能帮助任何寻找类似解决方案的人。
https://stackoverflow.com/questions/28456747
复制相似问题