我对此很疯狂,我无法进行相当简单的单元测试(这是我在AngularJS上的第一个)。
我保持一切尽可能简单。我一直在尝试几种方式来注入我的服务,但他们都没有工作。我尝试的最后一个来自here。
这是我的测试文件:
describe('product service',function(){
var ProductService;
beforeEach(module('inspinia'));
beforeEach(inject(function (_ProductService_) {
ProductService = _ProductService_;
}));
describe('Test',function(){
it("should be aware that true is true", function() {
expect(true).toBe(true);
});
});
});
这是我的服务:
/**
* Product service.
*
* Service that manages products. Including offline mode and sync tasks.
*
* @param {!angular.Http} $http
* @param {!angular.RootScope} $rootScope
* @ngInject
* @export
*/
(function () {
'use strict';
angular
.module('inspinia')
.factory('ProductService', ProductService);
/**
* clientUpdatesQueue
*
* Will hold all the offline operations on the following format:
* {'Section':SectionEnum.SECTION, 'Operation':OperationEnum.OPERATION, 'Record':record, 'Timestamp':currentTimeStamp}
*/
var clientUpdatesQueue = [];
var products = [];
/**
* Enum for sections used by the clientUpdatesQueue array.
*/
var SectionEnum = {
PRODUCTS : 0
};
/**
* Enum for operations used by the clientUpdatesQueue array.
*/
var OperationEnum = {
CREATE : 0,
UPDATE : 1,
DELETE : 2
};
/**
* Initializes the client updates queue
*/
(function initClientUpdatesQueue(){
clientUpdatesQueue = angular.fromJson(localStorage.clientUpdatesQueue || "[]");
if(localStorage.products === undefined){
//GetAllFromServer();
}
clientUpdatesQueue = angular.fromJson(localStorage.clientUpdatesQueue || "[]");
})();
ProductService.$inject = ['$http', '$rootScope'];
function ProductService($http, $rootScope) {
/**
* TODO
* Will write a function that sends the offline operations updates to the server
*
* service.SendUpdates = SendUpdates;
*/
var service = {};
service.GetAllFromServer = GetAllFromServer;
service.GetAll = GetAll;
service.Get = Get;
service.Create = Create;
service.Update = Update;
service.Delete = Delete;
service.Synchronize = Synchronize;
return service;
/***************SYNCHRONIZATION TASKS***************
***************************************************/
/**
* Synchronize
* Iterates through the pending updates queue and performs the corresponding call to the server
*/
function Synchronize(){
for (var key in clientUpdatesQueue) {
switch(clientUpdatesQueue[key].Operation){
case 0:
CreateOnServer(clientUpdatesQueue[key].Record);
break;
case 1:
UpdateOnServer(clientUpdatesQueue[key].Record);
break;
case 2:
DeleteOnServer(clientUpdatesQueue[key].Record);
break;
}
clientUpdatesQueue.splice(key, 1);
}
updateLocalStorage();
}
/**
* updateLocalStorage
* Updates local storage with the lastest operations.
*/
function updateLocalStorage(){
localStorage.products = angular.toJson(products || "[]");
localStorage.clientUpdatesQueue = angular.toJson(clientUpdatesQueue || "[]");
}
/**
* GetAllFromServer
* Gets all products matching the current session from the server and store them on the local storage.
*/
function GetAllFromServer(){
var session = angular.fromJson(localStorage.session);
$http({
method: 'GET',
url: $rootScope.apiURL+'getAllClientProducts/'+session,
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
}).success(function(response){
if(response.ErrorMessage === null && response.Result !== null){
localStorage.products = angular.toJson(Object.keys(response.Result).map(function (key) {return response.Result[key]}));
}else if(response.ErrorMessage !==null){
alert(response.ErrorMesage);
}
})
.error(function(response){
alert('Something went wrong. Please try again: '+response);
});
}
/***************LOCAL TASKS*************************
***************************************************/
/**
* GetAll
* Gets all the products from the local storage
*
* @return {Array} products
*/
function GetAll(){
if(localStorage.products !== undefined) {
return angular.fromJson(localStorage.products);
}else{
GetAllFromServer();
}
}
/**
* Gets the specified product by its primary key
*
* @param {String} InvProductId
* @return {Object} product
*/
function Get(id){
products = GetAll();
var thisProduct = products.filter(function(p){
return p.InvProductId === id;
});
updateLocalStorage();
return thisProduct[0];
}
/**
* Creates a product
*
* @param {Object} product
*/
function Create(product){
var result = true;
if(!ValidateSnapshot(product)){
return false;
}
products = GetAll();
products.push(product);
clientUpdatesQueue.push({'Section':SectionEnum.PRODUCTS, 'Operation':OperationEnum.CREATE, 'Record':product, 'Timestamp':Date.now()});
updateLocalStorage();
return result;
}
/**
* Updates a product
*
* @param {Object} product
*/
function Update(product){
var result = true;
if(!ValidateSnapshot(product)){
return false;
}
products = GetAll();
for (var key in products) {
if(products[key].InvProductId === product.InvProductId){
products[key] = product;
}
}
clientUpdatesQueue.push({'Section':SectionEnum.PRODUCTS, 'Operation':OperationEnum.UPDATE, 'Record':product, 'Timestamp':Date.now()});
updateLocalStorage();
return result;
}
/**
* Deletes a product
*
* @param {Object} product
*/
function Delete(product){
var result = true;
products = GetAll();
for (var key in products) {
if(products[key].InvProductId === product.InvProductId){
products.splice(key, 1);
}
}
clientUpdatesQueue.push({'Section':SectionEnum.PRODUCTS, 'Operation':OperationEnum.DELETE, 'Record':product, 'Timestamp':Date.now()});
updateLocalStorage();
return result;
}
/***************SERVER COMMUNICATION****************
***************************************************/
/**
* Creates a product on the server
*
* @param {Object} product
*/
function CreateOnServer(product){
var session = angular.fromJson(localStorage.session);
$http({
method: 'POST',
url: $rootScope.apiURL+'createProduct/'+session,
data: $.param(product),
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
}).success(function(response){
if(response.ErrorMessage === null && response.Result !== null){
mixpanel.track("Product successfuly created at server: " + response.Result.InvProductId);
}
})
.error(function(data){
mixpanel.track("Create Product Went Wrong: "+data);
alert('Something went wrong with product creation: '+data);
});
}
/**
* Updates a product on the server
*
* @param {Object} product
*/
function UpdateOnServer(product){
var session = angular.fromJson(localStorage.session);
$http({
method: 'POST',
url: $rootScope.apiURL+'updateProduct/'+session,
data: $.param(product),
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
}).success(function(response){
if(response.ErrorMessage === null && response.Result !== null){
mixpanel.track("Product successfuly edited: " + response.Result.InvProductId);
}
})
.error(function(data){
mixpanel.track("Create Product Went Wrong: "+data);
alert('Something went wrong with product creation: '+data);
});
}
/**
* TODO
* Deletes a product on the server
*
* @param {Object} product
*/
function DeleteOnServer(product){
return true;
}
/***************VALIDATION UTILITIES****************
***************************************************/
function ValidateSnapshot(product){
var result = true;
if(product === null || product === undefined){
return false;
}
if(!product.ApplicableTaxKeys.split(',') instanceof Array || product.ApplicableTaxKeys !== null){
return false;
}
if(product.Barcode.length < 1 || product.Barcode === null || product.Barcode === undefined){
return false;
}
if(product.CliClientId.length !== 10){
return false;
}
if(product.Description.length < 1 || product.Description === null || product.Description === undefined){
return false;
}
if(product.InternalCode.length < 1 || product.InternalCode === null || product.InternalCode === undefined){
return false;
}
if(!product.InvProductCategoryId.split(',') instanceof Array || product.InvProductCategoryId !== null){
return false;
}
if(product.Name.length < 1 || product.Name === null || product.Name === undefined){
return false;
}
if(product.SaleUnitType.length < 1 || product.SaleUnitType === null || product.SaleUnitType === undefined){
return false;
}
if(product.Status.length < 1 || product.Status === null || product.Status === undefined){
return false;
}
if(product.UnitMeasure.length < 1 || product.UnitMeasure === null || product.UnitMeasure === undefined){
return false;
}
return result;
}
}
})();
这是我尝试运行测试时遇到的错误:
$ karma start
01 02 2016 22:05:54.839:WARN [karma]: No captured browser, open http://localhost:9876/
01 02 2016 22:05:54.848:INFO [karma]: Karma v0.13.19 server started at http://localhost:9876/
01 02 2016 22:05:54.854:INFO [launcher]: Starting browser PhantomJS
01 02 2016 22:05:55.101:INFO [PhantomJS 2.1.1 (Linux 0.0.0)]: Connected on socket /#LoDbe6y-md8uPHi-AAAA with id 31143204
PhantomJS 2.1.1 (Linux 0.0.0) product service Test should be aware that true is true FAILED
/home/eduardo/ventamia/vm2/clientside/www-app/js/angular/angular.js:4116:53
forEach@/home/eduardo/ventamia/vm2/clientside/www-app/js/angular/angular.js:323:24
loadModules@/home/eduardo/ventamia/vm2/clientside/www-app/js/angular/angular.js:4076:12
createInjector@/home/eduardo/ventamia/vm2/clientside/www-app/js/angular/angular.js:4002:22
workFn@/home/eduardo/ventamia/vm2/clientside/www-app/node_modules/angular-mocks/angular-mocks.js:2506:60
PhantomJS 2.1.1 (Linux 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.044 secs / 0.01 secs)
如果我删除了我尝试注入服务的行,测试通过了,所以我认为其他一切都很好。
Karma配置文件:
module.exports = function(config) {
config.set({
basePath: '',
frameworks: ['jasmine'],
files: [
'angular/angular.min.js',
'../node_modules/angular-mocks/angular-mocks.js',
'app.js',
'app-services/*.js',
'app-services-tests/*.js'
],
exclude: [
],
preprocessors: {
},
reporters: ['progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['PhantomJS'],
singleRun: false,
concurrency: Infinity
})
}
编辑:我将我的业力配置文件移动到一个目录,以丢弃任何与./符号有关的奇怪行为。但我仍然得到同样的错误。我最终得到了这个conf文件:
module.exports = function(config) {
config.set({
basePath: '',
frameworks: ['jasmine'],
files: [
'js/angular/angular.min.js',
'node_modules/angular-mocks/angular-mocks.js',
'js/app.js',
'js/app-services/*.js',
'js/app-services-tests/*.js'
],
exclude: [
],
preprocessors: {
},
reporters: ['progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['PhantomJS'],
singleRun: false,
concurrency: Infinity
})
}
答案 0 :(得分:1)
你这么说
after removing the lines where I try to inject my service, the test passes
因为您的测试用例没有使用任何angular mocking stuff
。
他们纯粹使用Jasmine stuff
。
这意味着你的 angular-mocks.js没有被加载。
我已使用相同的代码进行了检查,唯一的区别是加载angular-mocks.js
库。
请检查angular-mocks.js
中karma_config file
的路径。
在Karma config
中查看基本路径后,angular-mocks.js
的路径应该与此angular/angular.min.js
一样。
如果您的node_modules
位于angular
文件夹之外,请使用此路径'../node_modules/angular-mocks/angular-mocks.js'
。
编辑:请更新此内容。
files: [
'js/angular/angular.min.js',
'node_modules/angular-mocks/angular-mocks.js',
'js/app-services/*.js',
'js/app.js',
'js/app-services-tests/*.js'
],
更新:
嗯,解决方法是,您应该定义one main module which is your ng-app
。
然后为服务,控制器等各项创建模块,并将它们注入一个模块。
考虑到这些,为ProductService
&amp;定义一个模块。相关服务, serviceModule
。
angular.module('serviceModule',[])
//service.js
将其注入主模块
var app = angular.module('inspinia',['serviceModule'])
// app.js