Fix Symbol completion priority and cursor positioning

Co-authored-by: RyanCavanaugh <6685088+RyanCavanaugh@users.noreply.github.com>

Author: Copilot

src/services/completions.ts

@@ -1730,10 +1730,16 @@ function createCompletionEntry(
     }
     // We should only have needsConvertPropertyAccess if there's a property access to convert. But see #21790.
     // Somehow there was a global with a non-identifier name. Hopefully someone will complain about getting a "foo bar" global completion and provide a repro.
-    else if ((useBraces || insertQuestionDot) && propertyAccessToConvert) {
-        insertText = useBraces ? needsConvertPropertyAccess ? `[${quotePropertyName(sourceFile, preferences, name)}]` : `[${name}]` : name;
-        if (insertQuestionDot || propertyAccessToConvert.questionDotToken) {
-            insertText = `?.${insertText}`;
+    else if ((useBraces || insertQuestionDot) && propertyAccessToConvert) {
+        if (useBraces && preferences.includeCompletionsWithSnippetText) {
+            // For symbol completions, position cursor inside brackets for better UX
+            insertText = needsConvertPropertyAccess ? `[${quotePropertyName(sourceFile, preferences, name)}$0]` : `[${name}$0]`;
+            isSnippet = true;
+        } else {
+            insertText = useBraces ? needsConvertPropertyAccess ? `[${quotePropertyName(sourceFile, preferences, name)}]` : `[${name}]` : name;
+        }
+        if (insertQuestionDot || propertyAccessToConvert.questionDotToken) {
+            insertText = `?.${insertText}`;
         }
 
         const dot = findChildOfKind(propertyAccessToConvert, SyntaxKind.DotToken, sourceFile) ||
@@ -3848,9 +3854,13 @@ function getCompletionData(
             // If this is nested like for `namespace N { export const sym = Symbol(); }`, we'll add the completion for `N`.
             const firstAccessibleSymbol = nameSymbol && getFirstSymbolInChain(nameSymbol, contextToken, typeChecker);
             const firstAccessibleSymbolId = firstAccessibleSymbol && getSymbolId(firstAccessibleSymbol);
-            if (firstAccessibleSymbolId && addToSeen(seenPropertySymbols, firstAccessibleSymbolId)) {
-                const index = symbols.length;
-                symbols.push(firstAccessibleSymbol);
+            if (firstAccessibleSymbolId && addToSeen(seenPropertySymbols, firstAccessibleSymbolId)) {
+                const index = symbols.length;
+                symbols.push(firstAccessibleSymbol);
+                
+                // Symbol completions should have lower priority since they represent computed property access
+                symbolToSortTextMap[getSymbolId(firstAccessibleSymbol)] = SortText.GlobalsOrKeywords;
+                
                 const moduleSymbol = firstAccessibleSymbol.parent;
                 if (
                     !moduleSymbol ||

tests/baselines/reference/completionsUniqueSymbol2.baseline

@@ -56,7 +56,7 @@
           "name": "a",
           "kind": "const",
           "kindModifiers": "",
-          "sortText": "11",
+          "sortText": "15",
           "insertText": "[a]",
           "replacementSpan": {
             "start": 344,
@@ -210,7 +210,7 @@
           "name": "b",
           "kind": "const",
           "kindModifiers": "",
-          "sortText": "11",
+          "sortText": "15",
           "insertText": "[b]",
           "replacementSpan": {
             "start": 344,

tests/cases/fourslash/completionForComputedStringProperties.ts

@@ -8,11 +8,11 @@
 //// declare const a: A;
 //// a[|./**/|]
 
-verify.completions({
-    marker: "",
-    exact: [
-        { name: "p1" },
-        { name: "p2", insertText: '[p2]', replacementSpan: test.ranges()[0] },
-    ],
-    preferences: { includeInsertTextCompletions: true },
+verify.completions({
+    marker: "",
+    exact: [
+        { name: "p1" },
+        { name: "p2", insertText: '[p2]', sortText: completion.SortText.GlobalsOrKeywords, replacementSpan: test.ranges()[0] },
+    ],
+    preferences: { includeInsertTextCompletions: true },
 });

tests/cases/fourslash/completionsSymbolMembers.ts

@@ -14,12 +14,12 @@
 verify.completions(
     {
         marker: "i",
-        exact: { name: "s", insertText: "[s]", replacementSpan: test.ranges()[0] },
+        exact: { name: "s", insertText: "[s]", sortText: completion.SortText.GlobalsOrKeywords, replacementSpan: test.ranges()[0] },
         preferences: { includeInsertTextCompletions: true },
     },
     {
         marker: "j",
-        exact: { name: "N", insertText: "[N]", replacementSpan: test.ranges()[1] },
+        exact: { name: "N", insertText: "[N]", sortText: completion.SortText.GlobalsOrKeywords, replacementSpan: test.ranges()[1] },
         preferences: { includeInsertTextCompletions: true },
     }
 );

tests/cases/fourslash/completionsUniqueSymbol1.ts

@@ -17,6 +17,6 @@
 
 verify.completions({
     marker: "",
-    exact: { name: "M", insertText: "[M]", replacementSpan: test.ranges()[0] },
+    exact: { name: "M", insertText: "[M]", sortText: completion.SortText.GlobalsOrKeywords, replacementSpan: test.ranges()[0] },
     preferences: { includeInsertTextCompletions: true },
 });

tests/cases/fourslash/completionsUniqueSymbol_import.ts

@@ -24,7 +24,7 @@ verify.completions({
     marker: "",
     exact: [
         "n",
-        { name: "publicSym", source: "/a", insertText: "[publicSym]", replacementSpan: test.ranges()[0], hasAction: true },
+        { name: "publicSym", source: "/a", insertText: "[publicSym]", sortText: completion.SortText.GlobalsOrKeywords, replacementSpan: test.ranges()[0], hasAction: true },
     ],
     preferences: {
         includeInsertTextCompletions: true,

tests/cases/fourslash/symbolCompletionLowerPriority.ts

@@ -0,0 +1,20 @@
+/// <reference path="fourslash.ts" />
+
+////declare const Symbol: (s: string) => symbol;
+////const mySymbol = Symbol("test");
+////interface TestInterface { 
+////    [mySymbol]: string;
+////    normalProperty: number;
+////}
+////const obj: TestInterface = {} as any;
+////obj./*completions*/
+
+// Test new behavior: Symbol completions should have lower priority and better cursor positioning
+verify.completions({
+    marker: "completions",
+    includes: [
+        { name: "normalProperty", sortText: completion.SortText.LocationPriority },
+        { name: "mySymbol", sortText: completion.SortText.GlobalsOrKeywords, insertText: "[mySymbol$0]", isSnippet: true } // Now with snippet cursor positioning
+    ],
+    preferences: { includeInsertTextCompletions: true, includeCompletionsWithSnippetText: true }
+});