diff --git a/src/survey.ts b/src/survey.ts index 5bdeb4002d..6c23d547a6 100644 --- a/src/survey.ts +++ b/src/survey.ts @@ -1117,6 +1117,7 @@ export class SurveyModel extends SurveyElementCore } private lazyRenderingValue: boolean; @property() showBrandInfo: boolean; + @property() enterKeyAction: "moveToNextEditor" | "loseFocus" | "default"; /** * By default all rows are rendered no matters if they are visible or not. * Set it true, and survey markup rows will be rendered only if they are visible in viewport. @@ -6907,8 +6908,9 @@ export class SurveyModel extends SurveyElementCore } public questionEditFinishCallback(question: Question, event: any) { - if (settings.enterKeyAction == "loseFocus") event.target.blur(); - if (settings.enterKeyAction == "moveToNextEditor") { + const enterKeyAction = this.enterKeyAction || settings.enterKeyAction; + if (enterKeyAction == "loseFocus") event.target.blur(); + if (enterKeyAction == "moveToNextEditor") { const allQuestions = this.currentPage.questions; const questionIndex = allQuestions.indexOf(question); if (questionIndex > -1 && questionIndex < allQuestions.length - 1) { diff --git a/testCafe/survey/focusQuestionEvent.ts b/testCafe/survey/focusQuestionEvent.ts index 7194a499a2..985c101d74 100644 --- a/testCafe/survey/focusQuestionEvent.ts +++ b/testCafe/survey/focusQuestionEvent.ts @@ -111,4 +111,77 @@ frameworks.forEach(async framework => { })(); }); + test("enterKeyAction as property", async (t) => { + const characterCounter = Selector(".sv-remaining-character-counter"); + + await initSurvey(framework, { + "logoPosition": "right", + "pages": [ + { + "name": "page1", + "elements": [ + { + "type": "text", + "name": "question1" + }, + { + "type": "dropdown", + "name": "question2", + "choices": ["item1", "item2"] + }, + { + "type": "text", + "name": "question3" + } + ] + }, + { + "name": "page2", + "elements": [ + { + "type": "text", + "name": "question4" + } + ] + } + ] + }); + + await ClientFunction(() => { + window["survey"].enterKeyAction = "loseFocus"; + })(); + + const q1Input = Selector("div[data-name=question1] input"); + const q2Input = Selector("div[data-name=question2] input"); + const q3Input = Selector("div[data-name=question3] input"); + const q4Input = Selector("div[data-name=question4] input"); + await t + .typeText(q1Input, "abc") + .expect(q1Input.focused).ok() + .pressKey("Enter") + .expect(q1Input.focused).notOk() + .typeText(q2Input, "it") + .expect(q2Input.focused).ok() + .pressKey("Enter") + .expect(q2Input.focused).notOk(); + + await ClientFunction(() => { + window["survey"].enterKeyAction = "moveToNextEditor"; + })(); + + await t + .typeText(q1Input, "abc") + .expect(q1Input.focused).ok() + .pressKey("Enter") + .typeText(q2Input, "it") + .expect(q2Input.focused).ok() + .pressKey("Enter") + .expect(q3Input.focused).ok() + .typeText(q3Input, "mnk") + .pressKey("Enter") + .expect(q3Input.focused).notOk(); + await ClientFunction(() => { + window["survey"].enterKeyAction = "default"; + })(); + }); });