From e7572f13649c7e9d5c178841cf67dfe73221d2ef Mon Sep 17 00:00:00 2001 From: Druthi Polisetty Date: Mon, 17 Apr 2023 13:43:45 +0530 Subject: [PATCH] fix: Autocomplete doesn't show up in square brackets when the identifier has invalid characters (#22134) ## Description Autocomplete doesn't show up in square brackets when the identifier has invalid characters Fixes #13983 ## Type of change - Bug fix (non-breaking change which fixes an issue) ## How Has This Been Tested? - Manual - Cypress ### Test Plan > Add Testsmith test cases links that relate to this PR ### Issues raised during DP testing > Link issues raised during DP testing for better visiblity and tracking (copy link from comments dropped on this PR) ## Checklist: ### Dev activity - [ ] My code follows the style guidelines of this project - [ ] I have performed a self-review of my own code - [ ] I have commented my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [ ] My changes generate no new warnings - [ ] I have added tests that prove my fix is effective or that my feature works - [ ] New and existing unit tests pass locally with my changes - [ ] PR is being merged under a feature flag ### QA activity: - [ ] Test plan has been approved by relevant developers - [ ] Test plan has been peer reviewed by QA - [x] Cypress test cases have been added and approved by either SDET or manual QA - [ ] Organized project review call with relevant stakeholders after Round 1/2 of QA - [ ] Added Test Plan Approved label after reveiwing all Cypress test --- .../Autocomplete/Autocomplete_Spec.ts | 30 +++++++++++++++---- .../editorComponents/CodeEditor/index.tsx | 12 ++++++-- .../autocomplete/CodemirrorTernService.ts | 2 +- 3 files changed, 36 insertions(+), 8 deletions(-) diff --git a/app/client/cypress/integration/Regression_TestSuite/ClientSideTests/Autocomplete/Autocomplete_Spec.ts b/app/client/cypress/integration/Regression_TestSuite/ClientSideTests/Autocomplete/Autocomplete_Spec.ts index 73569b5fbf..6d8de52fac 100644 --- a/app/client/cypress/integration/Regression_TestSuite/ClientSideTests/Autocomplete/Autocomplete_Spec.ts +++ b/app/client/cypress/integration/Regression_TestSuite/ClientSideTests/Autocomplete/Autocomplete_Spec.ts @@ -24,7 +24,27 @@ describe("Autocomplete bug fixes", function () { ); }); - it("2. Bug #14990 Checks if copied widget show up on autocomplete suggestions", function () { + it("2. Bug #13983 Verifies if object properties are in autocomplete list", function () { + ee.SelectEntityByName("Text1"); + propPane.TypeTextIntoField("Text", '{{Table1.selectedRow["'); + agHelper.AssertElementExist(locator._hints); + agHelper.GetNAssertElementText(locator._hints, "status", "contain.text"); + + propPane.TypeTextIntoField("Text", "{{Table1.selectedRow['"); + agHelper.AssertElementExist(locator._hints); + agHelper.GetNAssertElementText(locator._hints, "status", "contain.text"); + }); + + it("3. Bug #13983 Verifies if object properties are in autocomplete list", function () { + ee.SelectEntityByName("Text1"); + propPane.TypeTextIntoField("Text", '{{Table1.selectedRo"'); + agHelper.AssertElementAbsence(locator._hints); + + propPane.TypeTextIntoField("Text", '{{"'); + agHelper.AssertElementAbsence(locator._hints); + }); + + it("4. Bug #14990 Checks if copied widget show up on autocomplete suggestions", function () { ee.CopyPasteWidget("Text1"); ee.SelectEntityByName("Text1"); propPane.UpdatePropertyFieldValue("Text", ""); @@ -39,7 +59,7 @@ describe("Autocomplete bug fixes", function () { ); }); - it("3. Bug #14100 Custom columns name label change should reflect in autocomplete", function () { + it("5. Bug #14100 Custom columns name label change should reflect in autocomplete", function () { // select table widget ee.SelectEntityByName("Table1"); // add new column @@ -64,7 +84,7 @@ describe("Autocomplete bug fixes", function () { ); }); - it("4. feat #16426 Autocomplete for fast-xml-parser", function () { + it("6. feat #16426 Autocomplete for fast-xml-parser", function () { ee.SelectEntityByName("Text1"); propPane.TypeTextIntoField("Text", "{{xmlParser.j"); agHelper.GetNAssertElementText(locator._hints, "j2xParser"); @@ -73,7 +93,7 @@ describe("Autocomplete bug fixes", function () { agHelper.GetNAssertElementText(locator._hints, "parse"); }); - it("5. Installed library should show up in autocomplete", function () { + it("7. Installed library should show up in autocomplete", function () { ee.ExpandCollapseEntity("Libraries"); installer.openInstaller(); installer.installLibrary("uuidjs", "UUID"); @@ -83,7 +103,7 @@ describe("Autocomplete bug fixes", function () { agHelper.GetNAssertElementText(locator._hints, "UUID"); }); - it("6. No autocomplete for Removed libraries", function () { + it("8. No autocomplete for Removed libraries", function () { ee.RenameEntityFromExplorer("Text1Copy", "UUIDTEXT"); installer.uninstallLibrary("uuidjs"); propPane.TypeTextIntoField("Text", "{{UUID."); diff --git a/app/client/src/components/editorComponents/CodeEditor/index.tsx b/app/client/src/components/editorComponents/CodeEditor/index.tsx index dc42c71609..4221b5747b 100644 --- a/app/client/src/components/editorComponents/CodeEditor/index.tsx +++ b/app/client/src/components/editorComponents/CodeEditor/index.tsx @@ -1091,16 +1091,24 @@ class CodeEditor extends Component { const cursor = cm.getCursor(); const line = cm.getLine(cursor.line); let showAutocomplete = false; + const prevChar = line[cursor.ch - 1]; + /* Check if the character before cursor is completable to show autocomplete which backspacing */ if (key === "/" && !isCtrlOrCmdPressed) { showAutocomplete = true; } else if (event.code === "Backspace") { - const prevChar = line[cursor.ch - 1]; showAutocomplete = !!prevChar && /[a-zA-Z_0-9.]/.test(prevChar); } else if (key === "{") { /* Autocomplete for { should show up only when a user attempts to write {{}} and not a code block. */ - const prevChar = line[cursor.ch - 1]; showAutocomplete = prevChar === "{"; + } else if (key === "'" || key === '"') { + /* Autocomplete for [ should show up only when a user attempts to write {['']} for Object property suggestions. */ + showAutocomplete = prevChar === "["; + + if (!showAutocomplete) { + // @ts-expect-error: Types are not available + cm.closeHint(); + } } else if (key.length == 1) { showAutocomplete = /[a-zA-Z_0-9.]/.test(key); /* Autocomplete should be triggered only for characters that make up valid variable names */ diff --git a/app/client/src/utils/autocomplete/CodemirrorTernService.ts b/app/client/src/utils/autocomplete/CodemirrorTernService.ts index bb707fbcff..85241625a0 100644 --- a/app/client/src/utils/autocomplete/CodemirrorTernService.ts +++ b/app/client/src/utils/autocomplete/CodemirrorTernService.ts @@ -377,7 +377,7 @@ class CodeMirrorTernService { origins: true, caseInsensitive: true, guess: false, - inLiteral: false, + inLiteral: true, }, (error, data) => this.requestCallback(error, data, cm, resolve), );