Adding support for React (JSX, TSX). Closes #37

Author: lannonbr

src/extension.ts

@@ -57,7 +57,7 @@ async function run(ctx: vscode.ExtensionContext, editor: vscode.TextEditor | und
     return;
   }
 
-  const supportedLanguages = ["javascript", "typescript"];
+  const supportedLanguages = ["javascript", "typescript", "javascriptreact", "typescriptreact"];
 
   if (supportedLanguages.indexOf(editor.document.languageId) === -1) {
     return;

src/parser.ts

@@ -11,11 +11,60 @@ export function getFunctionCalls(sourceCode: string, editor: vscode.TextEditor):
     options.parser = require("recast/parsers/esprima");
   } else if (editor.document.languageId === "typescript") {
     options.parser = require("recast/parsers/typescript");
+  } else if (editor.document.languageId === "javascriptreact") {
+    options.parser = require("recast/parsers/babel");
+  } else if (editor.document.languageId === "typescriptreact") {
+    options.parser = {
+      parse(source) {
+        const babelParser = require("recast/parsers/babel").parser;
+        const opts = {
+          allowImportExportEverywhere: true,
+          allowReturnOutsideFunction: true,
+          plugins: [
+            "asyncGenerators",
+            "bigInt",
+            "classPrivateMethods",
+            "classPrivateProperties",
+            "classProperties",
+            "decorators-legacy",
+            "doExpressions",
+            "dynamicImport",
+            "exportDefaultFrom",
+            "exportExtensions",
+            "exportNamespaceFrom",
+            "functionBind",
+            "functionSent",
+            "importMeta",
+            "nullishCoalescingOperator",
+            "numericSeparator",
+            "objectRestSpread",
+            "optionalCatchBinding",
+            "optionalChaining",
+            ["pipelineOperator", { proposal: "minimal" }],
+            "throwExpressions",
+            "typescript",
+            "jsx"
+          ],
+          sourceType: "unambiguous",
+          startLine: 1,
+          strictMode: false,
+          tokens: true
+        };
+
+        return babelParser.parse(source, opts);
+      }
+    };
   }
 
   sourceCode = removeShebang(sourceCode);
 
-  const ast = recast.parse(sourceCode, options);
+  let ast;
+
+  try {
+    ast = recast.parse(sourceCode, options);
+  } catch (err) {
+    console.log(err.message);
+  }
 
   fcArray = lookForFunctionCalls(editor, fcArray, ast.program.body);
 

src/test/e2e/extension.test.ts

@@ -77,6 +77,12 @@ suite("js annotations", () => {
     assert.strictEqual(decArray[0].renderOptions.before.contentText, " str: ");
     assert.deepEqual(errDecArray.length, 0);
   });
+
+  test("Should work for JSX files", async () => {
+    const [decArray, errDecArray] = await getDecorationsFromExample("react.jsx");
+    assert.deepEqual(decArray.length, 1);
+    assert.deepEqual(errDecArray.length, 0);
+  });
 });
 
 function sleep(ms: number): Promise<void> {

src/test/examples/react.jsx

@@ -0,0 +1,7 @@
+function jsxComponent(text) {
+  return (
+    <div>{text}</div>
+  )
+}
+
+jsxComponent("Hello World")