diff --git a/packages/survey-angular-ui/src/questions/text.component.html b/packages/survey-angular-ui/src/questions/text.component.html index 2a4892e9e9..68c8cafd51 100644 --- a/packages/survey-angular-ui/src/questions/text.component.html +++ b/packages/survey-angular-ui/src/questions/text.component.html @@ -7,9 +7,9 @@
{{ value }}
- diff --git a/packages/survey-angular-ui/src/questions/text.component.ts b/packages/survey-angular-ui/src/questions/text.component.ts index d2e6af0cc8..e659f47da0 100644 --- a/packages/survey-angular-ui/src/questions/text.component.ts +++ b/packages/survey-angular-ui/src/questions/text.component.ts @@ -1,6 +1,6 @@ -import { Component } from "@angular/core"; +import { Component, ElementRef, ViewChild } from "@angular/core"; import { QuestionAngular } from "../question"; -import { QuestionTextModel } from "survey-core"; +import { Helpers, QuestionTextModel } from "survey-core"; import { AngularComponentFactory } from "../component-factory"; @Component({ @@ -9,9 +9,25 @@ import { AngularComponentFactory } from "../component-factory"; styleUrls: ["./text.component.scss"] }) export class TextQuestionComponent extends QuestionAngular { + @ViewChild("inputElement") inputElementRef!: ElementRef; + get value(): string { return this.model.inputValue ?? ""; } + + blur(event: any): void { + this.model.onBlur(event); + this.updateInputDomElement(); + } + + updateInputDomElement(): void { + if (!!this.inputElementRef?.nativeElement) { + const control: any = this.inputElementRef.nativeElement; + if (!Helpers.isTwoValueEquals(this.value, control.value, false, true, false)) { + control.value = this.value; + } + } + } } AngularComponentFactory.Instance.registerComponent("text-question", TextQuestionComponent); \ No newline at end of file diff --git a/testCafe/questions/input_mask.ts b/testCafe/questions/input_mask.ts index 62e1b03754..5b348a1422 100644 --- a/testCafe/questions/input_mask.ts +++ b/testCafe/questions/input_mask.ts @@ -67,4 +67,41 @@ frameworks.forEach((framework) => { .expect(getCursor()).eql(6); }); + test("An invalid value is not always cleared", async (t) => { + await initSurvey(framework, { + focusFirstQuestionAutomatic: true, + pages: [ + { + name: "page1", + elements: [ + { + type: "text", + name: "question1", + maskType: "pattern", + maskSettings: { + pattern: "99999", + }, + }, + ], + }, + ], + }); + const emptyValue = "_____"; + + await t + .expect(Selector("input").value).eql(emptyValue) + + .pressKey("1 2 3 4") + .expect(Selector("input").value).eql("1234_") + + .pressKey("tab") + .expect(Selector("input").value).eql(emptyValue) + + .click("input") + .pressKey("1 2 3") + .expect(Selector("input").value).eql("123__") + + .pressKey("tab") + .expect(Selector("input").value).eql(emptyValue); + }); }); \ No newline at end of file