feat(form): publish validationErrorKeys as CSS

- The validationErrorKeys are now published as CSS for easy styling. The errorKeys should be in
 camelCase and the CSS will be in snake-case

1 files changed, 26 insertions, 16 deletions

diff --git a/test/directive/formSpec.js b/test/directive/formSpec.js
index fbcf4aec..588b9f49 100644
--- a/test/directive/formSpec.js
+++ b/test/directive/formSpec.js
@@ -43,7 +43,7 @@ describe('form', function() {
     expect(form.$error.required).toEqual([control]);
 
     doc.find('input').remove();
-    expect(form.$error.required).toBeUndefined();
+    expect(form.$error.required).toBe(false);
     expect(form.alias).toBeUndefined();
   });
 
@@ -124,8 +124,8 @@ describe('form', function() {
     expect(scope.firstName).toBe('val1');
     expect(scope.lastName).toBe('val2');
 
-    expect(scope.formA.$error.required).toBeUndefined();
-    expect(scope.formB.$error.required).toBeUndefined();
+    expect(scope.formA.$error.required).toBe(false);
+    expect(scope.formB.$error.required).toBe(false);
   });
 
 
@@ -169,8 +169,8 @@ describe('form', function() {
       expect(child.$error.MyError).toEqual([inputB]);
 
       inputB.$setValidity('MyError', true);
-      expect(parent.$error.MyError).toBeUndefined();
-      expect(child.$error.MyError).toBeUndefined();
+      expect(parent.$error.MyError).toBe(false);
+      expect(child.$error.MyError).toBe(false);
     });
 
 
@@ -192,7 +192,7 @@ describe('form', function() {
 
       expect(parent.child).toBeUndefined();
       expect(scope.child).toBeUndefined();
-      expect(parent.$error.required).toBeUndefined();
+      expect(parent.$error.required).toBe(false);
     });
 
 
@@ -223,8 +223,8 @@ describe('form', function() {
       expect(parent.$error.myRule).toEqual([child]);
 
       input.$setValidity('myRule', true);
-      expect(parent.$error.myRule).toBeUndefined();
-      expect(child.$error.myRule).toBeUndefined();
+      expect(parent.$error.myRule).toBe(false);
+      expect(child.$error.myRule).toBe(false);
     });
   })
 
@@ -244,20 +244,30 @@ describe('form', function() {
     it('should have ng-valid/ng-invalid css class', function() {
       expect(doc).toBeValid();
 
-      control.$setValidity('ERROR', false);
-      scope.$apply();
+      control.$setValidity('error', false);
       expect(doc).toBeInvalid();
+      expect(doc.hasClass('ng-valid-error')).toBe(false);
+      expect(doc.hasClass('ng-invalid-error')).toBe(true);
 
-      control.$setValidity('ANOTHER', false);
-      scope.$apply();
+      control.$setValidity('another', false);
+      expect(doc.hasClass('ng-valid-error')).toBe(false);
+      expect(doc.hasClass('ng-invalid-error')).toBe(true);
+      expect(doc.hasClass('ng-valid-another')).toBe(false);
+      expect(doc.hasClass('ng-invalid-another')).toBe(true);
 
-      control.$setValidity('ERROR', true);
-      scope.$apply();
+      control.$setValidity('error', true);
       expect(doc).toBeInvalid();
+      expect(doc.hasClass('ng-valid-error')).toBe(true);
+      expect(doc.hasClass('ng-invalid-error')).toBe(false);
+      expect(doc.hasClass('ng-valid-another')).toBe(false);
+      expect(doc.hasClass('ng-invalid-another')).toBe(true);
 
-      control.$setValidity('ANOTHER', true);
-      scope.$apply();
+      control.$setValidity('another', true);
       expect(doc).toBeValid();
+      expect(doc.hasClass('ng-valid-error')).toBe(true);
+      expect(doc.hasClass('ng-invalid-error')).toBe(false);
+      expect(doc.hasClass('ng-valid-another')).toBe(true);
+      expect(doc.hasClass('ng-invalid-another')).toBe(false);
     });