Handle type argument lists as jsx completion starts (#28493)

* Handle type argument lists as jsx completion starts * preceeding -> preceding
microsoft · Nov 13, 2018 · d99de73 · d99de73
1 parent 40bd7c8
commit d99de73
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 0 deletions.
diff --git a/src/services/completions.ts b/src/services/completions.ts
@@ -1532,6 +1532,7 @@ namespace ts.Completions {
             if (contextToken) {
                 const parent = contextToken.parent;
                 switch (contextToken.kind) {
+                    case SyntaxKind.GreaterThanToken: // End of a type argument list
                     case SyntaxKind.LessThanSlashToken:
                     case SyntaxKind.SlashToken:
                     case SyntaxKind.Identifier:
@@ -1540,6 +1541,10 @@ namespace ts.Completions {
                     case SyntaxKind.JsxAttribute:
                     case SyntaxKind.JsxSpreadAttribute:
                         if (parent && (parent.kind === SyntaxKind.JsxSelfClosingElement || parent.kind === SyntaxKind.JsxOpeningElement)) {
+                            if (contextToken.kind === SyntaxKind.GreaterThanToken) {
+                                const precedingToken = findPrecedingToken(contextToken.pos, sourceFile, /*startNode*/ undefined);
+                                if (!(parent as JsxOpeningLikeElement).typeArguments || (precedingToken && precedingToken.kind === SyntaxKind.SlashToken)) break;
+                            }
                             return <JsxOpeningLikeElement>parent;
                         }
                         else if (parent.kind === SyntaxKind.JsxAttribute) {

diff --git a/tests/cases/fourslash/tsxCompletionsGenericComponent.ts b/tests/cases/fourslash/tsxCompletionsGenericComponent.ts
@@ -0,0 +1,31 @@
+/// <reference path="fourslash.ts" />
+
+// @jsx: preserve
+// @skipLibCheck: true
+// @Filename: file.tsx
+//// declare module JSX {
+////     interface Element { }
+////     interface IntrinsicElements {
+////     }
+////     interface ElementAttributesProperty { props; }
+//// }
+////
+////class Table<P> {
+////    constructor(public props: P) {}
+////}
+////
+////type Props = { widthInCol: number; text: string; };
+////
+/////**
+//// * @param width {number} Table width in px
+//// */
+////function createTable(width) {
+////    return <Table<Props> /*1*/ />
+////}
+////
+////createTable(800);
+
+verify.completions({
+    marker: "1",
+    includes: ["widthInCol", "text"]
+});