我刚开始为我的AngularJS应用编写的测试和我在茉莉这样做。
以下是相关的代码片段
ClientController：
'use strict';
adminConsoleApp.controller('ClientController',
function ClientController($scope, Client) {
//Get list of clients
$scope.clients = Client.query(function () {
//preselect first client in array
$scope.selected.client = $scope.clients[0];
});
//necessary for data-binding so that it is accessible in child scopes.
$scope.selected = {};
//Current page
$scope.currentPage = 'start.html';
//For Client nav bar
$scope.clientNavItems = [
{destination: 'features.html', title: 'Features'},
];
//Set current page
$scope.setCurrent = function (title, destination) {
if (destination !== '') {
$scope.currentPage = destination;
}
};
//Return path to current page
$scope.getCurrent = function () {
return 'partials/clients/' + $scope.currentPage;
};
//For nav bar highlighting of active page
$scope.isActive = function (destination) {
return $scope.currentPage === destination ? true : false;
};
//Reset current page on client change
$scope.clientChange = function () {
$scope.currentPage = 'start.html';
};
});
ClientControllerSpec：
'use strict';
var RESPONSE = [
{
"id": 10,
"name": "Client Plus",
"ref": "client-plus"
},
{
"id": 13,
"name": "Client Minus",
"ref": "client-minus"
},
{
"id": 23805,
"name": "Shaun QA",
"ref": "saqa"
}
];
describe('ClientController', function() {
var scope;
beforeEach(inject(function($controller, $httpBackend, $rootScope) {
scope = $rootScope;
$httpBackend.whenGET('http://localhost:3001/clients').respond(RESPONSE);
$controller('ClientController', {$scope: scope});
$httpBackend.flush();
}));
it('should preselect first client in array', function() {
//this fails.
expect(scope.selected.client).toEqual(RESPONSE[0]);
});
it('should set current page to start.html', function() {
expect(scope.currentPage).toEqual('start.html');
});
});
测试失败：
Chrome 25.0 (Mac) ClientController should preselect first client in array FAILED
Expected { id : 10, name : 'Client Plus', ref : 'client-plus' } to equal { id : 10, name : 'Client Plus', ref : 'client-plus' }.
Error: Expected { id : 10, name : 'Client Plus', ref : 'client-plus' } to equal { id : 10, name : 'Client Plus', ref : 'client-plus' }.
at null.<anonymous> (/Users/shaun/sandbox/zong-admin-console-app/test/unit/controllers/ClientControllerSpec.js:43:39)
有没有人对为什么这可能发生的任何想法？
还..因为我是新来编写AngularJS测试，对我是否建立我的测试错了，或者是否可以改进将受到欢迎任何意见。
更新：
包括ClientService：
'use strict';
AdminConsoleApp.services.factory('Client', function ($resource) {
//API is set up such that if clientId is passed in, will retrieve client by clientId, else retrieve all.
return $resource('http://localhost:port/clients/:clientId', {port: ':3001', clientId: '@clientId'}, {
});
});
另外，我解决此问题得到了通过，而不是比较ID：
it('should preselect first client in array', function () {
expect(scope.selected.client.id).toEqual(RESPONSE[0].id);
});
toEqual进行了深入相等比较。 这意味着当所述对象的值的所有属性是相等的，则对象被认为是相等的。
正如你所说，你正在使用的资源，其增加了一些特性到阵列中的对象。
所以这个{id:12}成为该{id:12, $then: function, $resolved: true}这是不相等的。 如果你正确设置值ID检查应该是罚款，如果你只是测试。
简短的回答：
现有的答案都建议，要么你的字符串化的对象，或者创建自定义的匹配/比较功能。 但是，还有一个更简单的方法：用angular.equals()在你的茉莉花expect调用，而不是使用茉莉花的内置， toEqual匹配。
angular.equals()会忽略角添加到您的对象附加属性，而toEqual会失败，比如说，比较$promise是对的对象之一。
更详细的解释：
我在AngularJS应用过这个同样的问题跑。 让我们设置的场景：
在我的测试中，我创建了一个本地对象和本地阵列，并希望他们为两个GET请求的响应。 后来，我比较了GET与原始对象和数组的结果。 我测试了使用四种不同的方法，只有一个给了正确的结果。
下面是foobar的控制器，spec.js的一部分：
var myFooObject = {id: 1, name: "Steve"};
var myBarsArray = [{id: 1, color: "blue"}, {id: 2, color: "green"}, {id: 3, color: "red"}];
...
beforeEach(function () {
httpBackend.expectGET('/foos/1').respond(myFooObject);
httpBackend.expectGET('/bars').respond(myBarsArray);
httpBackend.flush();
});
it('should put foo on the scope', function () {
expect(scope.foo).toEqual(myFooObject);
//Fails with the error: "Expected { id : 1, name : 'Steve', $promise : { then : Function, catch : Function, finally : Function }, $resolved : true } to equal { id : 1, name : 'Steve' }."
//Notice that the first object has extra properties...
expect(scope.foo.toString()).toEqual(myFooObject.toString());
//Passes, but invalid (see below)
expect(JSON.stringify(scope.foo)).toEqual(JSON.stringify(myFooObject));
//Fails with the error: "Expected '{"id":1,"name":"Steve","$promise":{},"$resolved":true}' to equal '{"id":1,"name":"Steve"}'."
expect(angular.equals(scope.foo, myFooObject)).toBe(true);
//Works as expected
});
it('should put bars on the scope', function () {
expect(scope.bars).toEqual(myBarsArray);
//Fails with the error: "Expected [ { id : 1, color : 'blue' }, { id : 2, color : 'green' }, { id : 3, color : 'red' } ] to equal [ { id : 1, color : 'blue' }, { id : 2, color : 'green' }, { id : 3, color : 'red' } ]."
//Notice, however, that both arrays seem identical, which was the OP's problem as well.
expect(scope.bars.toString()).toEqual(myBarsArray.toString());
//Passes, but invalid (see below)
expect(JSON.stringify(scope.bars)).toEqual(JSON.stringify(myBarsArray));
//Works as expected
expect(angular.equals(scope.bars, myBarsArray)).toBe(true);
//Works as expected
});
作为参考，这里是从输出console.log使用JSON.stringify()和.toString()
LOG: '***** myFooObject *****'
LOG: 'Stringified:{"id":1,"name":"Steve"}'
LOG: 'ToStringed:[object Object]'
LOG: '***** scope.foo *****'
LOG: 'Stringified:{"id":1,"name":"Steve","$promise":{},"$resolved":true}'
LOG: 'ToStringed:[object Object]'
LOG: '***** myBarsArray *****'
LOG: 'Stringified:[{"id":1,"color":"blue"},{"id":2,"color":"green"},{"id":3,"color":"red"}]'
LOG: 'ToStringed:[object Object],[object Object],[object Object]'
LOG: '***** scope.bars *****'
LOG: 'Stringified:[{"id":1,"color":"blue"},{"id":2,"color":"green"},{"id":3,"color":"red"}]'
LOG: 'ToStringed:[object Object],[object Object],[object Object]'
注意字符串化的对象是如何有额外的属性，以及如何toString产生无效数据，这将给假阳性。
通过观察上面，这里的不同方法的摘要：
-
expect(scope.foobar).toEqual(foobar) ：这个失败两种方式。 当比较对象的toString表明，角增添额外的属性。 当比较阵列中，内容似乎是相同的，但这种方法仍要求它们是不同的。 -
expect(scope.foo.toString()).toEqual(myFooObject.toString())这通过两种方式。 然而，这是一个假阳性，因为对象没有被完全翻译。 这使得唯一的说法是，这两个参数有相同数量的对象。 -
expect(JSON.stringify(scope.foo)).toEqual(JSON.stringify(myFooObject))比较阵列时，该方法给出正确的响应，但对象相比具有相似的故障到原始比较。 -
expect(angular.equals(scope.foo, myFooObject)).toBe(true) ： 这是使断言的正确方法。 通过让角做比较，它知道要忽略的是在后台添加的任何属性，并给出了正确的结果。
如果它的事项给任何人，我使用AngularJS 1.2.14和噶0.10.10，并PhantomJS 1.9.7测试。
长话短说：添加angular.equals作为茉莉匹配。
beforeEach(function(){
this.addMatchers({
toEqualData: function(expected) {
return angular.equals(this.actual, expected);
}
});
});
所以，那么你可以按如下方式使用它：
it('should preselect first client in array', function() {
//this passes:
expect(scope.selected.client).toEqualData(RESPONSE[0]);
//this fails:
expect(scope.selected.client).toEqual(RESPONSE[0]);
});
我有一个类似的问题，如下所示，基于多种方法实现了自定义匹配：
beforeEach(function() {
this.addMatchers({
toBeSimilarTo: function(expected) {
function buildObject(object) {
var built = {};
for (var name in object) {
if (object.hasOwnProperty(name)) {
built[name] = object[name];
}
}
return built;
}
var actualObject = buildObject(this.actual);
var expectedObject = buildObject(expected);
var notText = this.isNot ? " not" : "";
this.message = function () {
return "Expected " + actualObject + notText + " to be similar to " + expectedObject;
}
return jasmine.getEnv().equals_(actualObject, expectedObject);
}
});
});
然后这样使用：
it("gets the right data", function() {
expect(scope.jobs[0]).toBeSimilarTo(myJob);
});
当然，这是一个非常简单的匹配，不支持许多情况下，但我并不需要什么比这更复杂。 您可以在配置文件中包裹的匹配。
检查这个答案了类似的实现。
我有，所以我只是叫了同样的问题JSON.stringify()上的对象进行比较。
expect( JSON.stringify( $scope.angularResource ) == JSON.stringify( expectedValue )).toBe( true );
当期望失败时，有点冗长，但会产生有益的信息：
expect(JSON.parse(angular.toJson(resource))).toEqual({ id: 1 });
说明：
angular.toJson将条状所有角特定属性的资源$promise
JSON.parse将JSON字符串转换回正常对象（或阵列），它现在可以比较的另一个对象（或阵列）。
