diff --git a/src/question_text.ts b/src/question_text.ts index 296b552137..cbb902e712 100644 --- a/src/question_text.ts +++ b/src/question_text.ts @@ -364,10 +364,8 @@ export class QuestionTextModel extends QuestionTextBase { } return super.valueFromDataCore(val); } - protected onCheckForErrors( - errors: Array, - isOnValueChanged: boolean - ) { + private dateValidationMessage: string; + protected onCheckForErrors(errors: Array, isOnValueChanged: boolean): void { super.onCheckForErrors(errors, isOnValueChanged); if (isOnValueChanged) return; if (this.isValueLessMin) { @@ -398,6 +396,9 @@ export class QuestionTextModel extends QuestionTextBase { ); }; errors.push(maxError); } + if(!!this.dateValidationMessage) { + errors.push(new CustomError(this.dateValidationMessage, this)); + } const valName = this.getValidatorTitle(); var emailValidator = new EmailValidator(); @@ -535,8 +536,11 @@ export class QuestionTextModel extends QuestionTextBase { this.supportGoNextPageError() ); } - protected setNewValue(newValue: any) { + protected setNewValue(newValue: any): void { newValue = this.correctValueType(newValue); + if(!!newValue) { + this.dateValidationMessage = undefined; + } super.setNewValue(newValue); } protected correctValueType(newValue: any): any { @@ -605,7 +609,11 @@ export class QuestionTextModel extends QuestionTextBase { } this.updateRemainingCharacterCounter(event.target.value); }; + private updateDateValidationMessage(event: any): void { + this.dateValidationMessage = this.isDateInputType && !!event.target ? event.target.validationMessage : undefined; + } public onKeyDown = (event: any) => { + this.updateDateValidationMessage(event); this.onKeyDownPreprocess && this.onKeyDownPreprocess(event); if (this.isInputTextUpdate) { this._isWaitingForEnter = event.keyCode === 229; @@ -613,6 +621,7 @@ export class QuestionTextModel extends QuestionTextBase { this.onTextKeyDownHandler(event); } public onChange = (event: any): void => { + this.updateDateValidationMessage(event); const elementIsFocused = event.target === settings.environment.root.activeElement; if (elementIsFocused) { if (this.isInputTextUpdate) { diff --git a/tests/question_texttests.ts b/tests/question_texttests.ts index ccb0c45958..1884c58ebb 100644 --- a/tests/question_texttests.ts +++ b/tests/question_texttests.ts @@ -468,3 +468,23 @@ QUnit.test("inputType='month' and today function, #8552", function(assert) { const etalon = new Date().getFullYear() + "-" + (new Date().getMonth() + 1); assert.equal(q1.value, etalon, "today works correctly for month input"); }); +QUnit.test("inputType='date' invalid value, #8617", function(assert) { + const survey = new SurveyModel({ + "elements": [ + { "type": "text", "name": "q1", "inputType": "date" }, + ] + }); + const q1 = survey.getQuestionByName("q1"); + q1.value = "2000-01-01"; + assert.equal(q1.errors.length, 0, "errors #1"); + const event = { target: { value: "", validationMessage: "Invalid date" } }; + q1.onKeyDown(event); + q1.value = undefined; + assert.equal(q1.errors.length, 0, "errors #2"); + survey.completeLastPage(); + assert.equal(q1.errors.length, 1, "errors #3"); + assert.equal(q1.errors[0].text, "Invalid date", "errors #4"); + assert.equal(survey.state, "running", "survey.state #1"); + q1.value = "2000-01-01"; + assert.equal(q1.errors.length, 0, "errors #5"); +});