CODEWITHSUNDEEP
angularjskarma-jasmine
codeepic
codeepic

Reputation: 4102

Angular $watchGroup and $watch undefined in Jasmine tests

Whoever said that testing Angular apps is a breeze had to be joking. Since I started writing tests for our Angular application, I consider it a great success when I move from one error message to another when running karma. Most of the examples online seem to be simplified and are not really transferable to my error cases. Now, onto the current problem I have:

I have angular-mocks.js and other angular dependencies hooked up in karma.conf.js file, I have tested config block of our app (controllers and templates matching routes) and the tests are green. Now I am trying to test controller which has $watchGroup - for some bloody reason $watchGroup is undefined (and also $watch when I tried to use it) in my jasmine test. When I comment the $watchGroup out my dummy test expect(true).toBe(true) is green, but with $watchGroup code in the controller (which is working fine btw) karma console reports that $watchGroup is undefined.

This is the code in the controller:

$scope.$watchGroup([
  'Message.AgeRangeMin',
  'Message.AgeRangeMax',
  'Message.SubscriberListFileId',
  'Message.SmsSettings.SelectedSender',
  'Message.EmailSettings.SelectedTemplate',
  'Message.PushSettings.SelectedSenders.length',
  'Message.SocialSettings.SelectedSocialNetworks.length'
  ], $scope.triggerUserForecast
);

$scope.triggerUserForecast = function () {
  commsMgmtHttpService.GetTotalReach($scope.Message)
    .then(function (data) {
      $scope.UserDeliveryForecast = data;
    }, function () {
      $scope.UserDeliveryForecast.TotalUserReach = 0;
    });
};

This is my test case:

describe('forge.communications.CommsApp', function () {

  beforeEach(module('forge.communications.CommsApp'));

  describe('CreateScheduledMessageController', function () {

    var ctrl, $scope, $rootScope, $controller, $httpBackend;

    beforeEach(function () {

        inject(function (_$rootScope_, _$controller_, _$httpBackend_) {
            $rootScope = _$rootScope_;
            $scope = $rootScope.$new();
            $httpBackend = _$httpBackend_;

            $controller = _$controller_('CreateScheduledMessageController', {
                $scope: $scope,

                $scope: {
                    ModelState: new ModelState($scope)
                },

                $location: $location,
                $modal: $modal,
                $upload: $upload
            });
        })
    });

    it("dummy should be true", function () {
        expect(true).toBe(true);
    });
  });
});

This is the Karma console error I am getting:

Chrome 40.0.2214 (Windows 7) forge.communications.CommsApp CreateScheduledMessageController dummy should be defined FAILED TypeError: undefined is not a function at new (C:/work/theforge/src/TheForge/dist/CommsApp.js:2581:12) at invoke (C:/work/theforge/src/TheForge/Scripts/angular.js:4118:17) at Object.instantiate (C:/work/theforge/src/TheForge/Scripts/angular.js:4129:23) at C:/work/theforge/src/TheForge/Scripts/angular.js:8320:28 at Object. (C:/work/theforge/src/TheForge/FrontEndTests/CommsAppTests/unit/Controllers/CreateScheduledMessage/CreateScheduledMessageController.spec.js:31:31) at Object.invoke (C:/work/theforge/src/TheForge/Scripts/angular.js:4118:17) at Object.workFn (C:/work/theforge/src/TheForge/Scripts/angular-mocks.js:2257:20) at window.inject.angular.mock.inject (C:/work/theforge/src/TheForge/Scripts/angular-mocks.js:2229:37) at Object. (C:/work/theforge/src/TheForge/FrontEndTests/CommsAppTests/unit/Controllers/CreateScheduledMessage/CreateScheduledMessageController.spec.js:22:13) Error: Declaration Location at window.inject.angular.mock.inject (C:/work/theforge/src/TheForge/Scripts/angular-mocks.js:2228:25)at Object. (C:/work/theforge/src/TheForge/FrontEndTests/CommsAppTests/unit/Controllers/CreateScheduledMessage/CreateScheduledMessageController.spec.js:22:13) Chrome 40.0.2214 (Windows 7): Executed 15 of 15 (1 FAILED) (0 secs / 0.12 secs) WARN [web-server]: 404: /forge/signalr/negotiate?clientProtocol=1.4&connectionDaChrome 40.0.2214 (Windows 7): Executed 15 of 15 (1 FAILED) (0.415 secs / 0.12 secs)

Any advice will be of much help to me.

Thanks.

Upvotes: 2

Views: 2178

Answers (1)

codeepic
codeepic

Reputation: 4102

It looks like I was overwriting the $controller's $scope property in jasmine test. Removing the following lines of code, following @Chandermani's advice fixed my problem.

$scope: {
  ModelState: new ModelState($scope)
}

Upvotes: 1

Related Questions