fix(input): take timezone into account when validating minimum and ma…

…ximum in date types Closes #16342 Closes #16390
angular · Apr 6, 2018 · 2f0ac69 · 2f0ac69
1 parent da3d96c
commit 2f0ac69
Show file tree

Hide file tree

Showing 2 changed files with 98 additions and 6 deletions.
diff --git a/src/ng/directive/input.js b/src/ng/directive/input.js
@@ -1474,11 +1474,7 @@ function createDateInputType(type, regexp, parseDate, format) {
         // Note: We cannot read ctrl.$modelValue, as there might be a different
         // parser/formatter in the processing chain so that the model
         // contains some different data format!
-        var parsedDate = parseDate(value, previousDate);
-        if (timezone) {
-          parsedDate = convertTimezoneToLocal(parsedDate, timezone);
-        }
-        return parsedDate;
+        return parseDateAndConvertTimeZoneToLocal(value, previousDate);
       }
       return undefined;
     });
@@ -1527,7 +1523,15 @@ function createDateInputType(type, regexp, parseDate, format) {
     }
 
     function parseObservedDateValue(val) {
-      return isDefined(val) && !isDate(val) ? parseDate(val) || undefined : val;
+      return isDefined(val) && !isDate(val) ? parseDateAndConvertTimeZoneToLocal(val) || undefined : val;
+    }
+
+    function parseDateAndConvertTimeZoneToLocal(value, previousDate) {
+      var parsedDate = parseDate(value, previousDate);
+      if (!isNaN(parsedDate) && timezone) {
+        parsedDate = convertTimezoneToLocal(parsedDate, timezone);
+      }
+      return parsedDate;
     }
   };
 }

diff --git a/test/ng/directive/inputSpec.js b/test/ng/directive/inputSpec.js
@@ -836,6 +836,23 @@ describe('input', function() {
 
         expect($rootScope.form.alias.$error.max).toBeFalsy();
       });
+
+      it('should validate when timezone is provided.', function() {
+        inputElm = helper.compileInput('<input type="month" ng-model="value" name="alias" ' +
+            'max="{{ maxVal }}" ng-model-options="{timezone: \'UTC\', allowInvalid: true}"/>');
+        $rootScope.maxVal = '2013-01';
+        $rootScope.value = new Date(Date.UTC(2013, 0, 1, 0, 0, 0));
+        $rootScope.$digest();
+
+        expect($rootScope.form.alias.$error.max).toBeFalsy();
+        expect($rootScope.form.alias.$valid).toBeTruthy();
+
+        $rootScope.value = '';
+        helper.changeInputValueTo('2013-01');
+        expect(inputElm).toBeValid();
+        expect($rootScope.form.alias.$error.max).toBeFalsy();
+        expect($rootScope.form.alias.$valid).toBeTruthy();
+      });
     });
   });
 
@@ -1069,6 +1086,25 @@ describe('input', function() {
 
         expect($rootScope.form.alias.$error.max).toBeFalsy();
       });
+
+      it('should validate when timezone is provided.', function() {
+        inputElm = helper.compileInput('<input type="week" ng-model="value" name="alias" ' +
+            'max="{{ maxVal }}" ng-model-options="{timezone: \'-2400\', allowInvalid: true}"/>');
+        // The calendar week comparison date is January 17. Setting the timezone to -2400
+        // makes the January 18 date value valid.
+        $rootScope.maxVal = '2013-W03';
+        $rootScope.value = new Date(Date.UTC(2013, 0, 18));
+        $rootScope.$digest();
+
+        expect($rootScope.form.alias.$error.max).toBeFalsy();
+        expect($rootScope.form.alias.$valid).toBeTruthy();
+
+        $rootScope.value = '';
+        helper.changeInputValueTo('2013-W03');
+        expect(inputElm).toBeValid();
+        expect($rootScope.form.alias.$error.max).toBeFalsy();
+        expect($rootScope.form.alias.$valid).toBeTruthy();
+      });
     });
   });
 
@@ -1338,6 +1374,23 @@ describe('input', function() {
 
         expect($rootScope.form.alias.$error.max).toBeFalsy();
       });
+
+      it('should validate when timezone is provided.', function() {
+        inputElm = helper.compileInput('<input type="datetime-local" ng-model="value" name="alias" ' +
+            'max="{{ maxVal }}" ng-model-options="{timezone: \'UTC\', allowInvalid: true}"/>');
+        $rootScope.maxVal = '2013-01-01T00:00:00';
+        $rootScope.value = new Date(Date.UTC(2013, 0, 1, 0, 0, 0));
+        $rootScope.$digest();
+
+        expect($rootScope.form.alias.$error.max).toBeFalsy();
+        expect($rootScope.form.alias.$valid).toBeTruthy();
+
+        $rootScope.value = '';
+        helper.changeInputValueTo('2013-01-01T00:00:00');
+        expect(inputElm).toBeValid();
+        expect($rootScope.form.alias.$error.max).toBeFalsy();
+        expect($rootScope.form.alias.$valid).toBeTruthy();
+      });
     });
 
 
@@ -1656,6 +1709,23 @@ describe('input', function() {
 
         expect($rootScope.form.alias.$error.max).toBeFalsy();
       });
+
+      it('should validate when timezone is provided.', function() {
+        inputElm = helper.compileInput('<input type="time" ng-model="value" name="alias" ' +
+            'max="{{ maxVal }}" ng-model-options="{timezone: \'UTC\', allowInvalid: true}"/>');
+        $rootScope.maxVal = '22:30:00';
+        $rootScope.value = new Date(Date.UTC(1970, 0, 1, 22, 30, 0));
+        $rootScope.$digest();
+
+        expect($rootScope.form.alias.$error.max).toBeFalsy();
+        expect($rootScope.form.alias.$valid).toBeTruthy();
+
+        $rootScope.value = '';
+        helper.changeInputValueTo('22:30:00');
+        expect(inputElm).toBeValid();
+        expect($rootScope.form.alias.$error.max).toBeFalsy();
+        expect($rootScope.form.alias.$valid).toBeTruthy();
+      });
     });
 
 
@@ -2001,6 +2071,24 @@ describe('input', function() {
 
         expect($rootScope.form.alias.$error.max).toBeFalsy();
       });
+
+      it('should validate when timezone is provided.', function() {
+        var inputElm = helper.compileInput('<input type="date" ng-model="value" name="alias" ' +
+            'max="{{ maxVal }}" ng-model-options="{timezone: \'UTC\', allowInvalid: true}"/>');
+
+        $rootScope.maxVal = '2013-12-01';
+        $rootScope.value = new Date(Date.UTC(2013, 11, 1, 0, 0, 0));
+        $rootScope.$digest();
+
+        expect($rootScope.form.alias.$error.max).toBeFalsy();
+        expect($rootScope.form.alias.$valid).toBeTruthy();
+
+        $rootScope.value = '';
+        helper.changeInputValueTo('2013-12-01');
+        expect(inputElm).toBeValid();
+        expect($rootScope.form.alias.$error.max).toBeFalsy();
+        expect($rootScope.form.alias.$valid).toBeTruthy();
+      });
     });