Exclude indexed access type object literal completions from mixing in base constraint completions

Author: andrewbranch

src/compiler/checker.ts

@@ -21337,11 +21337,19 @@ namespace ts {
             return argIndex === -1 ? undefined : getContextualTypeForArgumentAtIndex(callTarget, argIndex, contextFlags);
         }
 
-        function getContextualTypeForArgumentAtIndex(callTarget: CallLikeExpression, argIndex: number, contextFlags?: ContextFlags): Type {
+        function getContextualTypeForArgumentAtIndex(callTarget: CallLikeExpression, argIndex: number, contextFlags?: ContextFlags): Type | undefined {
             // If we're already in the process of resolving the given signature, don't resolve again as
             // that could cause infinite recursion. Instead, return anySignature.
             let signature = getNodeLinks(callTarget).resolvedSignature === resolvingSignature ? resolvingSignature : getResolvedSignature(callTarget);
-            if (contextFlags && contextFlags & ContextFlags.BaseConstraint && signature.target && !hasTypeArguments(callTarget)) {
+
+            if (contextFlags && contextFlags & ContextFlags.Uninstantiated) {
+                return signature.target ? getTypeAtPosition(signature.target, argIndex) : undefined;
+            }
+
+            if (contextFlags && contextFlags & ContextFlags.BaseConstraint) {
+                if (!signature.target || hasTypeArguments(callTarget)) {
+                    return undefined;
+                }
                 signature = getBaseSignature(signature.target);
             }
 

src/compiler/types.ts

@@ -3605,6 +3605,7 @@ namespace ts {
         Signature      = 1 << 0, // Obtaining contextual signature
         NoConstraints  = 1 << 1, // Don't obtain type variable constraints
         BaseConstraint = 1 << 2, // Use base constraint type for completions
+        Uninstantiated = 1 << 3, // Attempt to get the type from an uninstantiated signature
     }
 
     // NOTE: If modifying this enum, must modify `TypeFormatFlags` too!

src/services/completions.ts

@@ -1800,9 +1800,14 @@ namespace ts.Completions {
 
             if (objectLikeContainer.kind === SyntaxKind.ObjectLiteralExpression) {
                 const instantiatedType = typeChecker.getContextualType(objectLikeContainer);
-                const baseType = instantiatedType && typeChecker.getContextualType(objectLikeContainer, ContextFlags.BaseConstraint);
-                if (!instantiatedType || !baseType) return GlobalsSearch.Fail;
-                isNewIdentifierLocation = hasIndexSignature(instantiatedType || baseType);
+                if (!instantiatedType) return GlobalsSearch.Fail;
+                const uninstantiatedType = typeChecker.getContextualType(objectLikeContainer, ContextFlags.Uninstantiated);
+                let baseType;
+                if (!(uninstantiatedType && uninstantiatedType.flags & TypeFlags.IndexedAccess)) {
+                    baseType = typeChecker.getContextualType(objectLikeContainer, ContextFlags.BaseConstraint);
+                }
+
+                isNewIdentifierLocation = hasIndexSignature(instantiatedType);
                 typeMembers = getPropertiesForObjectExpression(instantiatedType, baseType, objectLikeContainer, typeChecker);
                 existingMembers = objectLikeContainer.properties;
             }

tests/cases/fourslash/completionsGenericIndexedAccess3.ts

@@ -0,0 +1,35 @@
+/// <reference path="fourslash.ts" />
+
+////interface CustomElements {
+////  'component-one': {
+////      foo?: string;
+////  },
+////  'component-two': {
+////      bar?: string;
+////  }
+////}
+////
+////interface Options<T extends keyof CustomElements> {
+////  props: CustomElements[T];
+////}
+////
+////declare function create<T extends keyof CustomElements>(name: T, options: Options<T>): void;
+////
+////create('component-one', { props: { /*1*/ } });
+////create('component-two', { props: { /*2*/ } });
+
+verify.completions({
+  marker: "1",
+  exact: [{
+    name: "foo",
+    sortText: completion.SortText.OptionalMember
+  }]
+});
+
+verify.completions({
+  marker: "2",
+  exact: [{
+    name: "bar",
+    sortText: completion.SortText.OptionalMember
+  }]
+});

tests/cases/fourslash/completionsGenericIndexedAccess4.ts

@@ -0,0 +1,45 @@
+/// <reference path="fourslash.ts" />
+
+////interface CustomElements {
+////  'component-one': {
+////      foo?: string;
+////  },
+////  'component-two': {
+////      bar?: string;
+////  }
+////}
+////
+////interface Options<T extends keyof CustomElements> {
+////  props: CustomElements[T];
+////}
+////
+////declare function create<T extends 'hello' | 'goodbye'>(name: T, options: Options<T extends 'hello' ? 'component-one' : 'component-two'>): void;
+////declare function create<T extends keyof CustomElements>(name: T, options: Options<T>): void;
+////
+////create('hello', { props: { /*1*/ } })
+////create('goodbye', { props: { /*2*/ } })
+////create('component-one', { props: { /*3*/ } });
+
+verify.completions({
+  marker: "1",
+  exact: [{
+    name: "foo",
+    sortText: completion.SortText.OptionalMember
+  }]
+});
+
+verify.completions({
+  marker: "2",
+  exact: [{
+    name: "bar",
+    sortText: completion.SortText.OptionalMember
+  }]
+});
+
+verify.completions({
+  marker: "3",
+  exact: [{
+    name: "foo",
+    sortText: completion.SortText.OptionalMember
+  }]
+});