使用 Jasmine 测试返回数组的 Angular 过滤器答案

【问题标题】：Testing Angular Filter That Returns An Array with Jasmine使用 Jasmine 测试返回数组的 Angular 过滤器
【发布时间】：2014-02-10 01:49:35
【问题描述】：

所以，我在测试角度过滤器时遇到问题，该过滤器采用以前按组属性排序的数组。它使用一个标志属性来指示该项目是该组的第一个观察结果，然后对于后续观察结果为 false。

我这样做是为了在 UI 中有一个带有 ng-repeat 指令的类别标题。

当我测试过滤器时，除非我为返回数组创建新对象，否则输出不会返回带有标志的数组。这是一个问题，因为它在网页中运行时会导致无限循环。当它只是向输入对象添加一个标志属性时，该代码在网页中工作。

我是否应该采取一些额外的步骤来模拟 angular 如何处理过滤器以便输出正确的数组？

这就是我的测试现在的样子。

describe('IsDifferentGroup', function() {
   var list, itemOne, itemTwo, itemThree;

   beforeEach(module("App.Filters"));

   beforeEach(function () {
    list = [];

    itemOne = new ListItem();
    itemTwo = new ListItem();
    itemThree = new ListItem();
    itemOne.group = "A";
    itemTwo.group = "B";
    itemThree.group = "C";

    list.push(itemOne);
    list.push(itemOne);
    list.push(itemOne);
    list.push(itemOne);
    list.push(itemTwo);
    list.push(itemThree);
    list.push(itemThree);
    list.push(itemThree);
    list.push(itemThree);
    list.push(itemThree);
});

it('should flag the items true that appear first on the list.', (inject(function (isDifferentGroupFilter) {
    expect(list.length).toBe(10);

    var result = isDifferentGroupFilter(list);

    expect(result[0].isDifferentGroup).toBeTruthy();
    expect(result[1].isDifferentGroup).toBeFalsy();
    expect(result[4].isDifferentGroup).toBeTruthy();
    expect(result[5].isDifferentGroup).toBeTruthy();
    expect(result[6].isDifferentGroup).toBeFalsy();
    expect(result[9].isDifferentGroup).toBeFalsy();

})));

});

下面是带有过滤器的代码：

var IsDifferentGroup = (function () {
function IsDifferentGroup() {
    return (function (list) {
        var arrayToReturn = [];
        var lastGroup = null;

        for (var i = 0; i < list.length; i++) {
            if (list[i].group != lastGroup) {
                list[i].isDifferentGroup = true;
                lastAisle = list[i].group;
            } else {
                list[i].isDifferentGroup = false;
            }
            arrayToReturn.push(list[i]);
        }

        return arrayToReturn;
    });
}
return IsDifferentGroup;
})();

谢谢！

【问题讨论】：

标签： arrays angularjs unit-testing filter jasmine

【解决方案1】：

我发现了我的问题。

当我将项目传递到列表中时，我只是将一个指向项目的指针推送了多次。我没有传入唯一的对象，因此该标志被数组中的以下标志覆盖（我认为）。所以，我刚刚使用循环新建了 10 个独特的对象，将它们推入数组并通过过滤器运行。它奏效了。

我不完全确定我对覆盖的分析是否正确，因为当 itemTwo 是数组中唯一的 itemTwo 时，它并没有被标记为唯一。但是测试正如我现在所期望的那样工作，所以我将停止调查这个问题。

【讨论】：