[FIX] sap.m.Input: Stop initial re-rendering of the input field when …

…type password and clear icon are set

- When showClearIcon is enabled for input of type Password, the input re-renders and initially entered symbols in the input are lost. Also, deleting the whole value using BACKSPACE does not clear the input as expected.
The change prevents setting a wrong/incomplete value to the input once the user starts writing and clear icon appears, or when text is deleted and the clear icon disappears.

SNOW: CS20240007828331
SNOW: DINC0184773
CR-Id: 002075125900002139152024
Change-Id: I6b46f1459fb5b923a03365a6391122188c600caf

src/sap.m/src/sap/m/Input.js

@@ -619,6 +619,8 @@ function(
 		// even though there is no user input (check Input.prototype.onsapright).
 		this._setTypedInValue("");
 		this._bDoTypeAhead = false;
+		this._isValueInitial = false;
+		this._previousInputType = this.getType();
 
 		// indicates whether input is clicked (on mobile) or the clear button
 		// used for identifying whether dialog should be open.
@@ -698,6 +700,10 @@ function(
 
 		InputBase.prototype.onBeforeRendering.call(this);
 
+		if (!this.getDomRef() && this.getValue()) {
+			this._isValueInitial = true;
+		}
+
 		if (this.getShowClearIcon()) {
 			this._getClearIcon().setProperty("visible", bShowClearIcon);
 		} else if (this._oClearButton) {
@@ -755,9 +761,12 @@ function(
 	Input.prototype.onAfterRendering = function() {
 		InputBase.prototype.onAfterRendering.call(this);
 
-		if (this.getType() === InputType.Password) {
+		if ((this._isValueInitial || this.getType() !== this._previousInputType ) && this.getType() === InputType.Password ) {
 			this.getDomRef("inner").value = this.getProperty("value");
+			this._isValueInitial = false;
 		}
+
+		this._previousInputType = this.getType();
 	};
 
 	/**

src/sap.m/test/sap/m/InputClearIcon.html

@@ -41,6 +41,21 @@
 							change: fnChange,
 							liveChange: fnLiveChange,
 						}).addStyleClass('myInput'),
+						new sap.m.Input({
+							placeholder: "Type Password",
+							type:"Password",
+							showClearIcon: true,
+							change: fnChange,
+							liveChange: fnLiveChange,
+						}).addStyleClass('myInput'),
+						new sap.m.Input({
+							placeholder: "Type Password",
+							type:"Password",
+							value:"Initial password value",
+							showClearIcon: true,
+							change: fnChange,
+							liveChange: fnLiveChange,
+						}).addStyleClass('myInput'),
 						new sap.m.Input({
 							placeholder: "Prompt Text",
 							showClearIcon: true,

src/sap.m/test/sap/m/qunit/Input.qunit.js

@@ -230,6 +230,47 @@ sap.ui.define([
 		oInput.destroy();
 	});
 
+	QUnit.test("Type password with showClearIcon - entered value is not corrupted", function(assert) {
+		// Arrange
+		var oInput = new sap.m.Input({
+			type: "Password",
+			showClearIcon: true
+		});
+
+		oInput.placeAt("content");
+		oCore.applyChanges();
+
+		// Act
+		qutils.triggerEvent("focus", oInput.getFocusDomRef());
+		qutils.triggerCharacterInput(oInput.getFocusDomRef(), "a");
+		qutils.triggerEvent("input", oInput.getFocusDomRef());
+		oCore.applyChanges();
+
+		assert.strictEqual(oInput.getValue(), "a", "Value is as entered");
+
+		// Clean
+		oInput.destroy();
+	});
+
+	QUnit.test("Type password with showClearIcon and initial value - input value is deleted", function(assert) {
+		// Arrange
+		var oInput = new sap.m.Input({
+			type: "Password",
+			showClearIcon: true,
+			value: "a"
+		});
+
+		oInput.placeAt("content");
+		oCore.applyChanges();
+
+		// Act
+		oInput._$input.trigger("focus").val("").trigger("input");
+		assert.strictEqual(oInput.getValue(), "", "Value is deleted");
+
+		// Clean
+		oInput.destroy();
+	});
+
 
 	QUnit.test("InputEnabled", function(assert) {
 		var enabled = false;