Merge pull request #1750 from IgniteUI/VSlavov/igMaskEditor-RevertVal…

…ue-1673-17.1 1673 - igMaskEditor - revertValue retains mask - 17.1
IgniteUI · Jul 11, 2018 · b7a40dc · b7a40dc
2 parents 9a735bb + e5374a2
commit b7a40dc
Show file tree

Hide file tree

Showing 2 changed files with 75 additions and 4 deletions.
diff --git a/src/js/modules/infragistics.ui.editors.js b/src/js/modules/infragistics.ui.editors.js
@@ -7063,7 +7063,9 @@
 
 						// All the required fields, which are unfilled are replaced with the padChar
 						result = this._replaceCharAt(result, p, newChar);
-					} else {
+
+						// V.S. March 28th, 2018 #1673: Reverted value in editor should contain mask. Should respect spaces in mask.
+					} else if (maskChar !== " ") {
 						result = this._replaceCharAt(result, p, "");
 						p--;
 					}
@@ -7183,7 +7185,8 @@
 				if (this.options.revertIfNotValid) {
 
 					// N.A. May 12th, 2017 #903: Properly revert display value.
-					value = this._getMaskedValue(this._valueInput.val().trim());
+					// V.S. March 28th, 2018 #1673: Reverted value in editor should contain mask
+					value = this._getMaskedValue(this._maskedValue || this._valueInput.val().trim());
 					this._updateValue(value);
 
 					// N.A. July 25th, 2016 #150: Mask editor empty mask is deleted.

diff --git a/tests/unit/editors/maskEditor/tests.html b/tests/unit/editors/maskEditor/tests.html
@@ -17,7 +17,6 @@
 
 	<script type="text/javascript" src="../../../../src/js/modules/infragistics.util.js"></script>
 	<script type="text/javascript" src="../../../../src/js/modules/infragistics.util.jquery.js"></script>
-	<script type="text/javascript" src="../../../../src/js/modules/infragistics.util.jquerydeferred.js"></script>
 	<script type="text/javascript" src="../../../../src/js/modules/infragistics.ui.popover.js"></script>
 	<script type="text/javascript" src="../../../../src/js/modules/infragistics.ui.notifier.js"></script>  
 	<script type="text/javascript" src="../../../../src/js/modules/infragistics.ui.editors.js"></script>
@@ -303,8 +302,9 @@
 					$("#clearButton_439").igMaskEditor({
 						inputMask: "CCCCCCC",
 						buttonType: "clear"
+					})
+
 					});
-				});
 			}
 			initialized = false;
 			module("igMaskEditor", {
@@ -1095,6 +1095,74 @@
 				equal(field.val(), "MM-MMMM-MMLM", "Text is not MM-MMMM-MMLM");
 				$editor.remove();
 			});
+
+			testId = "Test with special characters";
+			QUnit.test(testId, function (assert) {
+				assert.expect(14);
+				var $editor;
+				$editor = $('<input/>').appendTo("#testBedContainer").igMaskEditor({ inputMask: "LLLLL" });
+				var field = $editor.igMaskEditor("field");
+				function enterValue(value){
+					$editor.focus()[0].setSelectionRange(0,0);
+					$.ig.TestUtil.type(value, field);
+				}
+				var testValues = [{
+					value: "たかむごひ",
+					valid: true
+				},{
+					value: "ⰁⰂⰃⰄⰅ",
+					valid: true
+				},{
+					value: "ퟻퟺퟯퟮퟭ",
+					valid: true
+				},{
+					value: "₩₩₩₩₩",
+					valid: false,
+					expected: "_____"
+				},{
+					value: "Ⰰ⯿⯾⯽⯼",
+					valid: false,
+					expected: "Ⰰ____"
+				},{
+					value: "‐‑‒–—",
+					valid: false,
+					expected: "_____"
+				},{
+					value: "¿¾½¼»",
+					valid: false,
+					expected: "_____"
+				}]
+				for(var i=0; i< testValues.length; i++){
+					$editor.igMaskEditor("field").val("_____");
+					enterValue(testValues[i].value);
+					assert.ok($editor.igMaskEditor("isValid") == testValues[i].valid, "Value is expected to be accepted.");
+					assert.equal(field.val(), testValues[i].valid ? testValues[i].value : testValues[i].expected, "The text is not as expected");
+				}
+		});
+
+			testId = "Should properly revert to last valid value";
+			QUnit.test(testId, function (assert) {
+				assert.expect(3);
+				var $editor;
+				$editor = $('<input/>').appendTo("#testBedContainer").igMaskEditor({ 
+					inputMask: "(000) 000-000",
+					dataMode: "rawText"
+				});
+				var field = $editor.igMaskEditor("field");
+				$editor.focus()[0].setSelectionRange(0,0);
+				$.ig.TestUtil.type("111111111", field);
+				$editor.blur();
+				$editor.focus()[0].setSelectionRange(12, 13);
+				$editor.val("(111) 111-11_");
+				$editor.blur();
+				$editor.focus()[0].setSelectionRange(12,13);
+				debugger;
+				$.ig.TestUtil.type("2222", field);
+				$editor.blur();
+				assert.equal($editor.data("igMaskEditor")._maskedValue.length, 13, "The editor value should be the appropriate length");
+				assert.ok($editor.data("igMaskEditor")._editorInput.val().indexOf("(") > -1,"The displayed value has the mask in place");
+				assert.equal($editor.igMaskEditor("value"), "111111112", "The editor value should be reverted to the last valid one");
+			});
 		});
 
 		function checkMaskState(editor, keyCode, editValue, displayValue, value) {