#6543 Add enterKeyAction property to survey model (#6544)

Fixes #6543
surveyjs · Jul 18, 2023 · 24982c2 · 24982c2
1 parent bb507a8
commit 24982c2
Show file tree

Hide file tree

Showing 2 changed files with 77 additions and 2 deletions.
diff --git 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
@@ -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";
+    })();
+  });
 });