fix(ui5-input): inputs now support placeholder on IE (#781)

Author: MapTo0

packages/main/src/Input.hbs

@@ -15,7 +15,7 @@
 			?readonly="{{_readonly}}"
 			?required="{{required}}"
 			.value="{{value}}"
-			placeholder="{{inputPlaceholder}}"
+			placeholder="{{placeholder}}"
 			role="{{accInfo.input.role}}"
 			aria-owns="{{accInfo.input.ariaOwns}}"
 			aria-invalid="{{accInfo.input.ariaInvalid}}"

packages/main/src/Input.js

@@ -389,6 +389,12 @@ class Input extends UI5Element {
 		if (isEnter(event)) {
 			return this._handleEnter(event);
 		}
+
+		this._keyDown = true;
+	}
+
+	onkeyup() {
+		this._keyDown = false;
 	}
 
 	/* Event handling */
@@ -417,7 +423,7 @@ class Input extends UI5Element {
 		}
 	}
 
-	onfocusin() {
+	onfocusin(event) {
 		this.focused = true; // invalidating property
 		this.previousValue = this.value;
 	}
@@ -437,7 +443,14 @@ class Input extends UI5Element {
 			event.stopImmediatePropagation();
 		}
 
-		this.fireEventByAction(this.ACTION_USER_INPUT);
+		/* skip calling change event when an input with a placeholder is focused on IE
+			- value of the host and the internal input should be differnt in case of actual input
+			- input is called when a key is pressed => keyup should not be called yet
+		*/
+		const skipFiring = (this.getInputDOMRef().value === this.value) && isIE() && !this._keyDown && this.placeholder;
+
+		!skipFiring && this.fireEventByAction(this.ACTION_USER_INPUT);
+
 		this.hasSuggestionItemSelected = false;
 
 		if (this.Suggestions) {
@@ -562,12 +575,6 @@ class Input extends UI5Element {
 		};
 	}
 
-	get inputPlaceholder() {
-		// We don`t support placeholder for IE,
-		// because IE fires input events, when placeholder exists, leading to functional degredations.
-		return isIE() ? "" : this.placeholder;
-	}
-
 	get _readonly() {
 		return this.readonly && !this.disabled;
 	}