Angularjs - how to unit test form validation

Question

I'm using Jasmine to unit test my Angular App. How can I test form validation in my controller? For example, I have a login function:

$scope.login = function() {
    if($scope.form_login.$valid) {
      //send request with username and password
    };
};

I'm trying to set $valid to true, but I can't access the form here. I got an error TypeError: Cannot set property '$valid' of undefined:

it('should not send request if form validation fails', function() {
    $controller('loginController', {$scope: $scope});
    $scope.form_login.$valid = true;
    $scope.login();
})

Answer 1

Unit test should not really test the form. To test the form and other not controller related things use e2e testing.

However if you really want to test validation in unit test see To test a custom validation angularjs directive or How to unit test angularjs form?

Answer 2

If you uses a service for save the data

$scope.login = function() {
    if($scope.form_login.$valid) {
      //send request with username and password
      MyService.login();
    };
};

Check if your service have not been called and mock the $scope.form_login.$valid property to false;

var MyService, controllerInjector, rootScope;
beforeEach(inject(function($controller, _MyService_, $rootScope){

  controllerInjector = $controller;
  MyService = _MyService_;
  rootScope = $rootScope;

}))

it('should not send request if form validation fails', function() {
  var scope, controller;
  scope = rootScope.$new();
  scope.form_login = {
    $valid : false;
  }
  var loginController = controllerInjector('loginController', {
    $scope : scope
  });

  spyOn(MyService,'login');

  scope.login();

  expect(MyService.login).not.toHaveBeenCalled();

});