如何 Jasmine 测试是否实际创建了 angular 服务?
How to Jasmine Test if an angular service was actually created?
我这里有一个代码是 ng-wrap
的一个分支,它的灵感来自 this article。基本上,它为第三方库引入的全局变量创建了一个 angular 服务,这是为了确认 angularjs 依赖注入的概念。但我正在努力研究如何测试第 3 方变量是否实际上转换为 angular 服务。
代码如下:
(function() {
'use strict';
angular
.module('blocks.wrapper', []);
})();
/* jshint ignore:start, -W101 */
// Inspired from http://www.bennadel.com/blog/2720-creating-and-extending-a-lodash-underscore-service-in-angularjs.htm
// Fork from https://github.com/bahmutov/ng-wrap
/* jshint ignore:end, +W101 */
(function() {
'use strict';
angular
.module('blocks.wrapper')
.provider('ngWrap', ngWrapProvider);
ngWrapProvider.$inject = ['$provide'];
/* @ngInject */
function ngWrapProvider($provide) {
/* jshint validthis:true */
this.wrapper = wrapper;
this.$get = function() {
return {'wrapper': wrapper};
};
///////////////////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////// IMPLEMENTATION ///////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////
function wrapper(name, leaveGlobal) {
$provide.provider(name, function () {
if (typeof window[name] === 'undefined') {
throw new Error('Cannot find window.' + name);
}
var thing = window[name];
if (!leaveGlobal) {
delete window[name];
}
this.$get = function() {
return thing;
};
});
}
}
})();
这是我到目前为止的测试规范:
'use strict';
/* jshint -W117, -W030 */
describe('blocks.wrapper', function() {
var ngWrapProvider;
var ngWrap;
var mocks = {
windowProperty: {
testProperty: 'testValue'
}
};
beforeEach(module('blocks.wrapper', function (_ngWrapProvider_) {
ngWrapProvider = _ngWrapProvider_;
}));
beforeEach(inject(function (_ngWrap_) {
ngWrap = _ngWrap_;
}));
describe('ngWrapProvider', function() {
it('should successfuly be defined', inject(function() {
expect(ngWrapProvider).toBeDefined();
}));
it('should have a wrapper method', function() {
expect(ngWrapProvider.wrapper).toBeDefined();
});
});
describe('ngWrap', function() {
it('should successfuly be defined', function() {
expect(ngWrap).toBeDefined();
});
it('should have a wrapper method', function() {
expect(ngWrap.wrapper).toBeDefined();
});
});
it('should have ngWrapProvider.wrapper & ngWrap.wrapper point to the same function', function() {
expect(ngWrapProvider.wrapper).toEqual(ngWrap.wrapper);
});
describe('wrapper method', function() {
it('should throw an error when window.property is undefined', function() {
expect(function() { ngWrapProvider.wrapper('_'); }).toThrow();
expect(function() { ngWrap.wrapper('_'); }).toThrow();
});
});
});
我对测试比较陌生,所以我可能做错了。虽然,是的,上面的所有测试规范都通过了,但我正在努力研究如何测试 window.property
实际上已转换为 angular 服务。
这是我目前的尝试:
describe('wrapper method', function() {
...
it('should convert window.property to an angular service', inject(function($injector) {
window._ = mocks.windowProperty;
ngWrapProvider.wrapper('_');
$injector.invoke(ngWrapProvider);
expect(angular.injector().has('_')).toBeTruthy();
}));
});
上面给出了一个错误:
Error: [ng:areq] Argument 'fn' is not a function, got ngWrapProvider
如果我尝试完全删除带有 $injector 的行,那么 expect(angular.injector().has('_')).toBeTruthy();
总是 return false。
我从 this post
得到了整个 $injector 的概念
这就是我解决问题的方法,$injector.invoke
想要一个函数作为参数,所以我所做的是将 ngWrapProvider.wrapper('_');
包装在一个函数中,然后将该函数作为 [= 的参数11=].
然后我创建一个 it
语句,其中 takes/injects 新的 _
服务在其中。如果它被定义并等同于我的模拟 window._
那么我可以说该服务确实已创建并且在全局范围内引用了正确的对象。
下面是我实际使用的代码。
describe('wrapper method', function() {
...
describe('with window.property', function() {
beforeEach(inject(function($injector) {
window._ = mocks.windowProperty;
$injector.invoke(function () {
ngWrapProvider.wrapper('_');
});
}));
it('should expose window.property as an angular service', inject(function(_) {
expect(_).toBeDefined();
expect(_).toEqual(mocks.windowProperty);
}));
...
});
});
我这里有一个代码是 ng-wrap
的一个分支,它的灵感来自 this article。基本上,它为第三方库引入的全局变量创建了一个 angular 服务,这是为了确认 angularjs 依赖注入的概念。但我正在努力研究如何测试第 3 方变量是否实际上转换为 angular 服务。
代码如下:
(function() {
'use strict';
angular
.module('blocks.wrapper', []);
})();
/* jshint ignore:start, -W101 */
// Inspired from http://www.bennadel.com/blog/2720-creating-and-extending-a-lodash-underscore-service-in-angularjs.htm
// Fork from https://github.com/bahmutov/ng-wrap
/* jshint ignore:end, +W101 */
(function() {
'use strict';
angular
.module('blocks.wrapper')
.provider('ngWrap', ngWrapProvider);
ngWrapProvider.$inject = ['$provide'];
/* @ngInject */
function ngWrapProvider($provide) {
/* jshint validthis:true */
this.wrapper = wrapper;
this.$get = function() {
return {'wrapper': wrapper};
};
///////////////////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////// IMPLEMENTATION ///////////////////////////////////////
///////////////////////////////////////////////////////////////////////////////////////////////
function wrapper(name, leaveGlobal) {
$provide.provider(name, function () {
if (typeof window[name] === 'undefined') {
throw new Error('Cannot find window.' + name);
}
var thing = window[name];
if (!leaveGlobal) {
delete window[name];
}
this.$get = function() {
return thing;
};
});
}
}
})();
这是我到目前为止的测试规范:
'use strict';
/* jshint -W117, -W030 */
describe('blocks.wrapper', function() {
var ngWrapProvider;
var ngWrap;
var mocks = {
windowProperty: {
testProperty: 'testValue'
}
};
beforeEach(module('blocks.wrapper', function (_ngWrapProvider_) {
ngWrapProvider = _ngWrapProvider_;
}));
beforeEach(inject(function (_ngWrap_) {
ngWrap = _ngWrap_;
}));
describe('ngWrapProvider', function() {
it('should successfuly be defined', inject(function() {
expect(ngWrapProvider).toBeDefined();
}));
it('should have a wrapper method', function() {
expect(ngWrapProvider.wrapper).toBeDefined();
});
});
describe('ngWrap', function() {
it('should successfuly be defined', function() {
expect(ngWrap).toBeDefined();
});
it('should have a wrapper method', function() {
expect(ngWrap.wrapper).toBeDefined();
});
});
it('should have ngWrapProvider.wrapper & ngWrap.wrapper point to the same function', function() {
expect(ngWrapProvider.wrapper).toEqual(ngWrap.wrapper);
});
describe('wrapper method', function() {
it('should throw an error when window.property is undefined', function() {
expect(function() { ngWrapProvider.wrapper('_'); }).toThrow();
expect(function() { ngWrap.wrapper('_'); }).toThrow();
});
});
});
我对测试比较陌生,所以我可能做错了。虽然,是的,上面的所有测试规范都通过了,但我正在努力研究如何测试 window.property
实际上已转换为 angular 服务。
这是我目前的尝试:
describe('wrapper method', function() {
...
it('should convert window.property to an angular service', inject(function($injector) {
window._ = mocks.windowProperty;
ngWrapProvider.wrapper('_');
$injector.invoke(ngWrapProvider);
expect(angular.injector().has('_')).toBeTruthy();
}));
});
上面给出了一个错误:
Error: [ng:areq] Argument 'fn' is not a function, got ngWrapProvider
如果我尝试完全删除带有 $injector 的行,那么 expect(angular.injector().has('_')).toBeTruthy();
总是 return false。
我从 this post
得到了整个 $injector 的概念这就是我解决问题的方法,$injector.invoke
想要一个函数作为参数,所以我所做的是将 ngWrapProvider.wrapper('_');
包装在一个函数中,然后将该函数作为 [= 的参数11=].
然后我创建一个 it
语句,其中 takes/injects 新的 _
服务在其中。如果它被定义并等同于我的模拟 window._
那么我可以说该服务确实已创建并且在全局范围内引用了正确的对象。
下面是我实际使用的代码。
describe('wrapper method', function() {
...
describe('with window.property', function() {
beforeEach(inject(function($injector) {
window._ = mocks.windowProperty;
$injector.invoke(function () {
ngWrapProvider.wrapper('_');
});
}));
it('should expose window.property as an angular service', inject(function(_) {
expect(_).toBeDefined();
expect(_).toEqual(mocks.windowProperty);
}));
...
});
});