fix(ngModel): validate pattern against the viewValue

Since the HTML5 pattern validation constraint validates the input value,
we should also validate against the viewValue. This allows e.g. input[date]
to validate both the input format of the date and the date object itself.

Fixes #12344

Author: Narretz

src/ng/directive/validators.js

@@ -43,8 +43,9 @@ var patternDirective = function() {
         ctrl.$validate();
       });
 
-      ctrl.$validators.pattern = function(value) {
-        return ctrl.$isEmpty(value) || isUndefined(regexp) || regexp.test(value);
+      ctrl.$validators.pattern = function(modelValue, viewValue) {
+        // HTML5 pattern constraint validates the input value, so we validate the viewValue
+        return ctrl.$isEmpty(viewValue) || isUndefined(regexp) || regexp.test(viewValue);
       };
     }
   };

test/ng/directive/validatorsSpec.js

@@ -204,6 +204,21 @@ describe('validators', function() {
       expect($rootScope.form.test.$error.pattern).toBe(true);
       expect(inputElm).not.toBeValid();
     });
+
+
+    it('should validate the viewValue and not the modelValue', function() {
+      var inputElm = helper.compileInput('<input type="text" name="test" ng-model="value" pattern="\\d{4}$">');
+      var ctrl = inputElm.controller('ngModel');
+
+      ctrl.$parsers.push(function(value) {
+        return (value * 10) + '';
+      });
+
+      helper.changeInputValueTo('1234');
+      expect($rootScope.form.test.$error.pattern).not.toBe(true);
+      expect($rootScope.form.test.$modelValue).toBe('12340');
+      expect(inputElm).toBeValid();
+    });
   });