Add support for JSX fragment syntax

src/compiler/checker.ts

@@ -13473,31 +13473,32 @@ namespace ts {
                         node.parent.openingElement.attributes :
                         undefined; // node.parent is JsxFragment with no attributes
 
-            if (jsxAttributes) {
-                // When we trying to resolve JsxOpeningLikeElement as a stateless function element, we will already give its attributes a contextual type
-                // which is a type of the parameter of the signature we are trying out.
-                // If there is no contextual type (e.g. we are trying to resolve stateful component), get attributes type from resolving element's tagName
-                const attributesType = getContextualType(jsxAttributes);
+            if (!jsxAttributes) {
+                return anyType; // don't check children of a fragment
+            }
 
-                if (!attributesType || isTypeAny(attributesType)) {
-                    return undefined;
-                }
+            // When we trying to resolve JsxOpeningLikeElement as a stateless function element, we will already give its attributes a contextual type
+            // which is a type of the parameter of the signature we are trying out.
+            // If there is no contextual type (e.g. we are trying to resolve stateful component), get attributes type from resolving element's tagName
+            const attributesType = getContextualType(jsxAttributes);
 
-                if (isJsxAttribute(node.parent)) {
-                    // JSX expression is in JSX attribute
-                    return getTypeOfPropertyOfContextualType(attributesType, node.parent.name.escapedText);
-                }
-                else if (node.parent.kind === SyntaxKind.JsxElement) {
-                    // JSX expression is in children of JSX Element, we will look for an "children" atttribute (we get the name from JSX.ElementAttributesProperty)
-                    const jsxChildrenPropertyName = getJsxElementChildrenPropertyname();
-                    return jsxChildrenPropertyName && jsxChildrenPropertyName !== "" ? getTypeOfPropertyOfContextualType(attributesType, jsxChildrenPropertyName) : anyType;
-                }
-                else {
-                    // JSX expression is in JSX spread attribute
-                    return attributesType;
-                }
+            if (!attributesType || isTypeAny(attributesType)) {
+                return undefined;
+            }
+
+            if (isJsxAttribute(node.parent)) {
+                // JSX expression is in JSX attribute
+                return getTypeOfPropertyOfContextualType(attributesType, node.parent.name.escapedText);
+            }
+            else if (node.parent.kind === SyntaxKind.JsxElement) {
+                // JSX expression is in children of JSX Element, we will look for an "children" atttribute (we get the name from JSX.ElementAttributesProperty)
+                const jsxChildrenPropertyName = getJsxElementChildrenPropertyname();
+                return jsxChildrenPropertyName && jsxChildrenPropertyName !== "" ? getTypeOfPropertyOfContextualType(attributesType, jsxChildrenPropertyName) : anyType;
+            }
+            else {
+                // JSX expression is in JSX spread attribute
+                return attributesType;
             }
-            return anyType; // don't check children of a fragment
         }
 
         function getContextualTypeForJsxAttribute(attribute: JsxAttribute | JsxSpreadAttribute) {

src/compiler/parser.ts

@@ -3987,7 +3987,6 @@ namespace ts {
             else if (opening.kind === SyntaxKind.JsxOpeningFragment) {
                 const node = <JsxFragment>createNode(SyntaxKind.JsxFragment, opening.pos);
                 node.openingFragment = opening;
-
                 node.children = parseJsxChildren(node.openingFragment);
                 node.closingFragment = parseJsxClosingFragment(inExpressionContext);
 
@@ -4058,12 +4057,12 @@ namespace ts {
                 else if (token() === SyntaxKind.EndOfFileToken) {
                     // If we hit EOF, issue the error at the tag that lacks the closing element
                     // rather than at the end of the file (which is useless)
-                    if (isJsxOpeningElement(openingTag)) {
-                        const openingTagName = openingTag.tagName;
-                        parseErrorAtPosition(openingTagName.pos, openingTagName.end - openingTagName.pos, Diagnostics.JSX_element_0_has_no_corresponding_closing_tag, getTextOfNodeFromSourceText(sourceText, openingTagName));
+                    if (isJsxOpeningFragment(openingTag)) {
+                        parseErrorAtPosition(openingTag.pos, openingTag.end - openingTag.pos, Diagnostics.JSX_fragment_has_no_corresponding_closing_tag);
                     }
                     else {
-                        parseErrorAtPosition(openingTag.pos, openingTag.end - openingTag.pos, Diagnostics.JSX_fragment_has_no_corresponding_closing_tag);
+                        const openingTagName = openingTag.tagName;
+                        parseErrorAtPosition(openingTagName.pos, openingTagName.end - openingTagName.pos, Diagnostics.JSX_element_0_has_no_corresponding_closing_tag, getTextOfNodeFromSourceText(sourceText, openingTagName));
                     }
                     break;
                 }

src/compiler/scanner.ts

@@ -13,7 +13,7 @@ namespace ts {
 
     /* @internal */
     export function tokenIsIdentifierOrKeywordOrGreaterThan(token: SyntaxKind): boolean {
-        return token === SyntaxKind.GreaterThanToken || token >= SyntaxKind.Identifier;
+        return token === SyntaxKind.GreaterThanToken || tokenIsIdentifierOrKeyword(token);
     }
 
     export interface Scanner {

src/compiler/types.ts

@@ -1621,7 +1621,7 @@ namespace ts {
         closingElement: JsxClosingElement;
     }
 
-    /// Either the opening tag in a <Tag>...</Tag> pair, the opening tag in a <>...</> pair, or the lone <Tag /> in a self-closing form
+    /// Either the opening tag in a <Tag>...</Tag> pair or the lone <Tag /> in a self-closing form
     export type JsxOpeningLikeElement = JsxSelfClosingElement | JsxOpeningElement;
 
     export type JsxAttributeLike = JsxAttribute | JsxSpreadAttribute;