fix(ui5-datepicker): fix the value validation (#1465)

If there is value in the input field and the user removes that vlaue, the component sets "value-state=error" and fires "change" and "input" events with "valid: false" and this is not correct - empty input field should be a valid state.
SAP · Apr 13, 2020 · 14fe357 · 14fe357
1 parent cfeed00
commit 14fe357
Showing 1 changed file with 10 additions and 4 deletions.
diff --git a/packages/main/src/DatePicker.js b/packages/main/src/DatePicker.js
@@ -423,7 +423,8 @@ class DatePicker extends UI5Element {
 
 	_handleInputChange() {
 		let nextValue = this._getInput().getInputValue();
-		const isValid = this.isValid(nextValue);
+		const emptyValue = nextValue === "";
+		const isValid = emptyValue || this.isValid(nextValue);
 		const isInValidRange = this.isInValidRange(this._getTimeStampFromString(nextValue));
 
 		if (isValid && isInValidRange) {
@@ -442,7 +443,8 @@ class DatePicker extends UI5Element {
 
 	_handleInputLiveChange() {
 		const nextValue = this._getInput().getInputValue();
-		const isValid = this.isValid(nextValue) && this.isInValidRange(this._getTimeStampFromString(nextValue));
+		const emptyValue = nextValue === "";
+		const isValid = emptyValue || (this.isValid(nextValue) && this.isInValidRange(this._getTimeStampFromString(nextValue)));
 
 		this.value = nextValue;
 		this.fireEvent("input", { value: nextValue, valid: isValid });
@@ -495,8 +497,12 @@ class DatePicker extends UI5Element {
 
 	// because the parser understands more than one format
 	// but we need values in one format
-	normalizeValue(sValue) {
-		return this.getFormat().format(this.getFormat().parse(sValue));
+	normalizeValue(value) {
+		if (value === "") {
+			return value;
+		}
+
+		return this.getFormat().format(this.getFormat().parse(value));
 	}
 
 	get validValue() {