Unit test cases for AngularJs app using Karma and Jasmine testing framework

Configuration: 

Require Files: [angular.js, angular-mock.js, karma, karma-jasmine, karma-chrome-launcher]
configuration file: karma.conf.js (we can create it manually or via command karma init)

Description:
Karma is spectacular test runner for JavaScript, runs on Node.js and is available as a NPM package. Above all require files are available as an NPM package. To run test cases you just have to run command karma start karma.conf.js 
include all files in karma.conf.js as file option for which you wanted to write test cases.

I created a first test case for directive "CompareTo" define in "motorbot.reservation.directives". Here is code
in directives/reservationsDirective.js:

 var directives = angular.module("motorbot.reservation.directives", []);
 

 var compareTo = function() {
   return {
     require: "ngModel",
     scope: {
       otherModelValue: "=compareTo"
     },
    link: function(scope, element, attributes, ngModel) {
      ngModel.$validators.compareTo = function(modelValue) {
        return modelValue == scope.otherModelValue;
      };

      scope.$watch("otherModelValue", function() {
        ngModel.$validate();
      });
    }
  };
};
directives.directive('compareTo', compareTo);

This directive is use on view to compare password and password-confirmation:

 <input  type="password" class="form-control" name="user_password_confirmation" compare-to="patron.password" ng-model='patron.password_confirmation' required />

Here is test case for directive "compareTo" in test/directives/directiveSpec.js:
 

  describe('Directives', function() {
    //include modules
    beforeEach(angular.mock.module('motorbot.reservation.directives'));
     
    describe('testing directive compare to', function() {
      var $scope, element, scope;
      var html = '<input compare-to="password" ng-model="password_confirmation"/>';
         
      // Injecting angular services in unit test for this we need angular-mock.js
      beforeEach(inject(function($rootScope, $compile) {
        $scope = $rootScope;

        // load the values to send
        $scope.password = 'abc';
        $scope.password_confirmation = 'abc2';

        // create the element and compile it
        element = angular.element(html);
        $compile(element)($scope);

        // get the scope of this directive
        scope = element.scope();
        $scope.$digest();
      }));
       
      it("should not valid password_confirmation", function() {
        expect(element.hasClass('ng-invalid-compare-to')).toBeTruthy();
      });
       
      it("should valid password_confirmation", function() {
        $scope.password_confirmation = 'abc';
        $scope.$digest();
        expect(element.hasClass('ng-invalid-compare-to')).toBeFalsy();
      });
    });
  });

Here is sample for karma.conf.js file:

  // Karma configuration
  // Generated on Thu May 14 2015 18:59:11 GMT+0530 (IST)

  module.exports = function(config) {
    config.set({

    // base path that will be used to resolve all patterns (eg. files, exclude)
    basePath: './',


    // frameworks to use
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
    frameworks: ['jasmine'],


    // list of files / patterns to load in the browser

    // list of files for which you wanted to write test cases
    files: ['bower_components/angular/angular.js',
      'bower_components/angular-mocks/angular-mocks.js',
      'directives/*.js',
      'test/**/*Spec.js'
    ],

    // list of files to exclude
    exclude: [
    ],


    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
    },


    // test results reporter to use
    // possible values: 'dots', 'progress'
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
    reporters: ['progress'],


    // web server port
    port: 9876,


    // enable / disable colors in the output (reporters and logs)
    colors: true,


    // level of logging
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN    || config.LOG_INFO || config.LOG_DEBUG
    logLevel: config.LOG_INFO,


    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: true,


    // start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
    browsers: ['Chrome'],


    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: false
  });
};

         

git–push large commits over http fail

Problme, exception, Error: git–push large commits over http fail

If you are facing this issue with git:

error: RPC failed; result=22, HTTP code = 413

fatal: The remote end hung up unexpectedly

fatal: The remote end hung up unexpectedly

Everything up-to-date

Problem: 

If we made commit with large files size or large amount of data in a single commit, then it may cause that error.

This issue might also come with HTTP github repository url, that we are using to clone the repo.

Solution:

We can increase buffer size to solve large amount of data issue or increase the nginx buffer size by the parameter "client_max_body_size".

If we don't have large amount of data and still we are facing this issue, so replace your github HTTP protocol with SSH protocol or replace HTTP to HTTPS in that url.

For more information see: http://mahingupta.com/gitpush-large-commits-over-http-fail/

Shaping up with angularjs

Here we find angular challenges on different levels. It is good for  angular beginner to enhance
their skills :

http://campus.codeschool.com/courses/shaping-up-with-angular-js/intro

By clicking "start course" you can start with challenges. For completing challenges you will achieve points as well.