Function inside of for loop not being tested

Question

I have a function im trying to test:

  vm.clearArray = function(){
    for (var id=0; id<vm.copyArray.length;id++){
      vm.styleIcon(vm.copyArray[id],'black')
    }
    vm.copyObjArray = [];
    vm.copyArray = [];
  }

I'm trying to test it like:

it('should have cleared copyArray on function call', function(){

    var ctrl = $componentController('copy', null);

    spyOn(ctrl, 'clearArray').and.callThrough();
    spyOn(ctrl, 'styleIcon').and.callThrough();

    ctrl.copyArray = [123];
    ctrl.clearArray();

    expect(ctrl.clearArray).toHaveBeenCalled();
    // expect(ctrl.styleIcon).toHaveBeenCalled();
    expect(ctrl.copyObjArray).toEqual([]);
    expect(ctrl.copyArray).toEqual([]);
  });

If I uncomment the above expect I get an error and the vm.styleIcon call is never covered in my coverage report. By setting copyArray to contain a value in the array I would think that the for loop would then trigger when running the test. That does not seem to be the case.

Thanks.

Answer 1

I believe there is some kind of inheritance scheme that is causing your error. My assumption is that your controller is extended by a base controller.

From what few code I see, I can make two assumptions:

1) clearArray() is overridden in the child controller eg.

vm.clearArray = function(){
    ...
    vm.copyArray = [];
}

so you are trying to test the wrong clearArray()

or

2) ctrl.copyArray is not writable because of the way inheritance was implemented, eg.

function ParentController() {
    var vm = this;
    vm.copyArray = [];
    vm.copyObjArray = [];
    vm.clearArray = function() {
        for (var id=0; id<vm.copyArray.length;id++){
            vm.styleIcon(vm.copyArray[id],'black')
        }
        vm.copyObjArray = [];
        vm.copyArray = [];
    }

    vm.styleIcon = function(index, color) {
    }
};

function ChildController() {
    ParentController.call(this);
}

ChildController.prototype = Object.create(ParentController.prototype, {copyArray:{ value: [] } });

var ctrl = new ChildController();

Using the above will yield the error, copyArray is defined as a non writable property, so line:

ctrl.copyArray = [123];

does not change its value.

• Object.defineProperty()
• Difference between Configurable and Writable attributes of an Object

Anyway, without more of the code, it is difficult to get what is causing the error.