Merge pull request #9647 from Microsoft/format_tsx

Handle JSX bodies in formatter

Author: Andy

src/services/formatting/formattingScanner.ts

@@ -26,7 +26,8 @@ namespace ts.formatting {
         RescanGreaterThanToken,
         RescanSlashToken,
         RescanTemplateToken,
-        RescanJsxIdentifier
+        RescanJsxIdentifier,
+        RescanJsxText,
     }
 
     export function getFormattingScanner(sourceFile: SourceFile, startPos: number, endPos: number): FormattingScanner {
@@ -140,6 +141,10 @@ namespace ts.formatting {
             return false;
         }
 
+        function shouldRescanJsxText(node: Node): boolean {
+            return node && node.kind === SyntaxKind.JsxText;
+        }
+
         function shouldRescanSlashToken(container: Node): boolean {
             return container.kind === SyntaxKind.RegularExpressionLiteral;
         }
@@ -176,6 +181,8 @@ namespace ts.formatting {
                         ? ScanAction.RescanTemplateToken
                         : shouldRescanJsxIdentifier(n)
                             ? ScanAction.RescanJsxIdentifier
+                            : shouldRescanJsxText(n)
+                            ? ScanAction.RescanJsxText
                             : ScanAction.Scan;
 
             if (lastTokenInfo && expectedScanAction === lastScanAction) {
@@ -215,6 +222,10 @@ namespace ts.formatting {
                 currentToken = scanner.scanJsxIdentifier();
                 lastScanAction = ScanAction.RescanJsxIdentifier;
             }
+            else if (expectedScanAction === ScanAction.RescanJsxText) {
+                currentToken = scanner.reScanJsxToken();
+                lastScanAction = ScanAction.RescanJsxText;
+            }
             else {
                 lastScanAction = ScanAction.Scan;
             }

tests/cases/fourslash/formatTsx.ts

@@ -0,0 +1,18 @@
+/// <reference path="fourslash.ts"/>
+
+// @Filename: foo.tsx
+////<div><p>'</p><p>{function(){return 1;}]}</p></div>
+
+format.document();
+verify.currentFileContentIs("<div><p>'</p><p>{function() { return 1; }]}</p></div>");
+
+/*
+< 0
+p 1
+> 2
+' 3
+< 4
+/ 5
+p 6
+> 7
+*/