DateBox: update regex pattern add 'x' (T1241387) (#27797)

Author: nikkithelegendarypokemonster

js/localization/ldml/date.parser.js

@@ -62,6 +62,9 @@ const PATTERN_REGEXPS = {
     },
     w: function(count) {
         return count === 2 ? '[1-5][0-9]|0?[0-9]' : '0??[0-9]|[1-5][0-9]';
+    },
+    x: function(count) {
+        return count === 3 ? '[+-](?:2[0-3]|[01][0-9]):(?:[0-5][0-9])|Z' : '[+-](?:2[0-3]|[01][0-9])(?:[0-5][0-9])|Z';
     }
 };
 

js/ui/date_box/ui.date_box.mask.parts.js

@@ -31,7 +31,8 @@ const PATTERN_GETTERS = {
     h: 'getHours',
     m: 'getMinutes',
     s: 'getSeconds',
-    S: 'getMilliseconds'
+    S: 'getMilliseconds',
+    x: 'getTimezoneOffset',
 };
 
 const PATTERN_SETTERS = extend({}, getPatternSetters(), {
@@ -73,7 +74,8 @@ const PATTERN_SETTERS = extend({}, getPatternSetters(), {
         const newValue = parseInt(String(currentYear).substr(0, maxLimitLength - valueLength) + value);
 
         date.setFullYear(newValue);
-    }
+    },
+    x: (date) => date,
 });
 
 const getPatternGetter = (patternChar) => {
@@ -126,7 +128,8 @@ const getLimits = (pattern, date, forcedPattern) => {
         m: { min: 0, max: 59 },
         s: { min: 0, max: 59 },
         S: { min: 0, max: 999 },
-        a: { min: 0, max: 1 }
+        a: { min: 0, max: 1 },
+        x: { min: 0, max: 0 }, // NOTE: Timezone part is read only.
     };
 
     return limits[forcedPattern || pattern] || limits['getAmPm'];

testing/tests/DevExpress.ui.widgets.editors/datebox.mask.tests.js

@@ -1267,6 +1267,40 @@ module('Date AM/PM Handling', setupModule, () => {
     });
 });
 
+module('TimeZone Handling', setupModule, () => {
+    test('should support \'x\' in date pattern and not generate errors (T1241387)', function(assert) {
+        try {
+            this.instance.option({
+                displayFormat: 'yyyy-MM-dd\'T\'HH:mm:ssxxx',
+                useMaskBehavior: true,
+                type: 'date',
+            });
+            assert.ok(true, 'no error shown');
+        } catch(e) {
+            assert.ok(false, 'error exists');
+        }
+    });
+
+    test('should not show error when changing timezone on runtime via up/down buttons (T1241387)', function(assert) {
+        try {
+            this.instance.option({
+                displayFormat: 'yyyy-MM-dd\'T\'HH:mm:ssxxx',
+                useMaskBehavior: true,
+                type: 'date',
+            });
+            const oldValue = this.$input.val();
+            this.keyboard.caret({ start: 20, end: 24 });
+            this.$input.focus().trigger('dxclick');
+            this.keyboard.press('up');
+
+            assert.ok(true, 'no error shown');
+            assert.strictEqual(this.$input.val(), oldValue, 'value has not been modified');
+        } catch(e) {
+            assert.ok(false, 'error exists');
+        }
+    });
+});
+
 module('Empty dateBox', {
     beforeEach: function() {
         setupModule.beforeEach.call(this);