#5419 Typing in a long text is buggy in firefox (#5428)

Fixes #5419
surveyjs · Apr 23, 2024 · c96992e · c96992e
1 parent ac88123
commit c96992e
Show file tree

Hide file tree

Showing 3 changed files with 73 additions and 5 deletions.
diff --git a/packages/survey-creator-core/src/components/string-editor.ts b/packages/survey-creator-core/src/components/string-editor.ts
@@ -285,8 +285,12 @@ export class StringEditorViewModelBase extends Base {
         event.preventDefault();
       }
     }
+    if (event.keyCode == 13 && !this.locString.allowLineBreaks) {
+      event.preventDefault();
+    }
+
     if (event.ctrlKey || event.metaKey) {
-      if ([89, 90].indexOf(event.keyCode) !== -1) {
+      if ([89, 90, 66, 73].indexOf(event.keyCode) !== -1) {
         event.stopImmediatePropagation();
         event.preventDefault();
       }
@@ -341,7 +345,6 @@ export class StringEditorViewModelBase extends Base {
       const options = { value: event.target?.innerText, cancel: null };
       if (this.connector) this.connector.onTextChanging.fire(this, options);
       if (options.cancel) return;
-      sanitizeEditableContent(event.target, !this.locString.allowLineBreaks);
       if (this.maxLength >= 0 && event.target.innerText.length > this.maxLength) {
         event.target.innerText = event.target.innerText.substring(0, this.maxLength);
       }
@@ -462,7 +465,8 @@ export class StringEditorViewModelBase extends Base {
     if (this.editAsText) {
       event.preventDefault();
       // get text representation of clipboard
-      var text = event.clipboardData.getData("text/plain");
+      let text = event.clipboardData.getData("text/plain");
+      if (!this.locString.allowLineBreaks) text = clearNewLines(text);
       // insert text manually
       const selection = window.getSelection();
       if (!selection.rangeCount) return;

diff --git a/packages/survey-creator-core/tests/string-editor.tests.ts b/packages/survey-creator-core/tests/string-editor.tests.ts
@@ -378,15 +378,15 @@ test("Sanitizing in compostion input", (): any => {
   stringEditorSurveyTitle.onInput({ target: null });
   stringEditorSurveyTitle.onInput({ target: null });
   stringEditorSurveyTitle.onInput({ target: null });
-  expect(sanitizeEditableContent).toBeCalledTimes(4);
+  expect(sanitizeEditableContent).toBeCalledTimes(0); // no sanitizer calls according new new approach
 
   stringEditorSurveyTitle.onCompositionStart({ target: null });
   stringEditorSurveyTitle.onInput({ target: null });
   stringEditorSurveyTitle.onInput({ target: null });
   stringEditorSurveyTitle.onInput({ target: null });
   stringEditorSurveyTitle.onInput({ target: null });
   stringEditorSurveyTitle.onCompositionEnd({ target: null });
-  expect(sanitizeEditableContent).toBeCalledTimes(5);
+  expect(sanitizeEditableContent).toBeCalledTimes(0); // no sanitizer calls according new new approach
 });
 
 test("Maxlen check", (): any => {

diff --git a/packages/survey-creator-core/tests/tabs/designer.test.ts b/packages/survey-creator-core/tests/tabs/designer.test.ts
@@ -169,6 +169,70 @@ test("StringEditorViewModelBase skip undo/redo hot keys", () => {
   editor.checkConstraints(event);
   expect(result).toBe("->ip->pd->ip->pd");
 });
+
+test("StringEditorViewModelBase skip formatting keys and enter key", () => {
+  let survey: SurveyModel = new SurveyModel({
+    pages: [
+      {
+        elements: [
+          { type: "text" }
+        ]
+      }
+    ]
+  });
+
+  let editor: StringEditorViewModelBase = new StringEditorViewModelBase(survey.locTitle, null);
+  let result = "";
+  const event = {
+    keyCode: 70,
+    ctrlKey: true,
+    stopImmediatePropagation: () => result += "->ip",
+    preventDefault: () => result += "->pd"
+  };
+  expect(result).toBe("");
+  editor.checkConstraints(event);
+  expect(result).toBe("");
+  event.keyCode = 66;
+  editor.checkConstraints(event);
+  expect(result).toBe("->ip->pd");
+  event.keyCode = 73;
+  editor.checkConstraints(event);
+  expect(result).toBe("->ip->pd->ip->pd");
+
+  result = "";
+  const eventMac = {
+    keyCode: 70,
+    metaKey: true,
+    stopImmediatePropagation: () => result += "->ip",
+    preventDefault: () => result += "->pd"
+  };
+  expect(result).toBe("");
+  editor.checkConstraints(eventMac);
+  expect(result).toBe("");
+  eventMac.keyCode = 66;
+  editor.checkConstraints(eventMac);
+  expect(result).toBe("->ip->pd");
+  eventMac.keyCode = 73;
+  editor.checkConstraints(eventMac);
+  expect(result).toBe("->ip->pd->ip->pd");
+
+  result = "";
+  const eventEnter = {
+    keyCode: 13,
+    stopImmediatePropagation: () => result += "->ip",
+    preventDefault: () => result += "->pd"
+  };
+  expect(result).toBe("");
+  editor.checkConstraints(eventEnter);
+  expect(result).toBe("->pd");
+
+  let editor2: StringEditorViewModelBase = new StringEditorViewModelBase(survey.locDescription, null);
+  result = "";
+  expect(result).toBe("");
+  editor2.checkConstraints(eventEnter);
+  expect(result).toBe("");
+});
+
 test("Property Grid and logic tab, Bug#4877", () => {
   const creator = new CreatorTester({ showLogicTab: true });
   creator.selectElement(creator.survey);