When emitting use jsx factory entity expression if provided

microsoft · sheetalkamat · Nov 10, 2016 · Nov 9, 2016 · Nov 9, 2016 · Nov 9, 2016
commit 3d6950d023b8c43b878292811189c5563128c8ec
diff --git a/src/compiler/factory.ts b/src/compiler/factory.ts
@@ -1628,7 +1628,34 @@ namespace ts {
         return react;
     }
 
-    export function createReactCreateElement(reactNamespace: string, tagName: Expression, props: Expression, children: Expression[], parentElement: JsxOpeningLikeElement, location: TextRange): LeftHandSideExpression {
+    function createJsxFactoryExpressionFromEntityName(jsxFactory: EntityName, parent: JsxOpeningLikeElement): Expression {
+        if (isQualifiedName(jsxFactory)) {
+            return createPropertyAccess(
+                createJsxFactoryExpressionFromEntityName(
+                    jsxFactory.left,
+                    parent
+                ),
+                setEmitFlags(
+                    getMutableClone(jsxFactory.right),
+                    EmitFlags.NoSourceMap
+                )
+            );
+        }
+        else {
+            return createReactNamespace(jsxFactory.text, parent);
+        }
+    }
+
+    function createJsxFactoryExpression(jsxFactoryEntity: EntityName, reactNamespace: string, parent: JsxOpeningLikeElement): Expression {
+        return jsxFactoryEntity ?
+            createJsxFactoryExpressionFromEntityName(jsxFactoryEntity, parent) :
+            createPropertyAccess(
+                createReactNamespace(reactNamespace, parent),
+                "createElement"
+            );
+    }
+
+    export function createExpressionForJsxElement(jsxFactoryEntity: EntityName, reactNamespace: string, tagName: Expression, props: Expression, children: Expression[], parentElement: JsxOpeningLikeElement, location: TextRange): LeftHandSideExpression {
         const argumentsList = [tagName];
         if (props) {
             argumentsList.push(props);
@@ -1651,10 +1678,7 @@ namespace ts {
         }
 
         return createCall(
-            createPropertyAccess(
-                createReactNamespace(reactNamespace, parentElement),
-                "createElement"
-            ),
+            createJsxFactoryExpression(jsxFactoryEntity, reactNamespace, parentElement),
             /*typeArguments*/ undefined,
             argumentsList,
             location

diff --git a/src/compiler/program.ts b/src/compiler/program.ts
@@ -731,6 +731,7 @@ namespace ts {
                 writeFile: writeFileCallback || (
                     (fileName, data, writeByteOrderMark, onError, sourceFiles) => host.writeFile(fileName, data, writeByteOrderMark, onError, sourceFiles)),
                 isEmitBlocked,
+                getJsxFactoryEntity: program.getJsxFactoryEntity,
             };
         }
 

diff --git a/src/compiler/transformers/jsx.ts b/src/compiler/transformers/jsx.ts
@@ -113,7 +113,8 @@ namespace ts {
                     || createAssignHelper(currentSourceFile.externalHelpersModuleName, segments);
             }
 
-            const element = createReactCreateElement(
+            const element = createExpressionForJsxElement(
+                context.getEmitHost().getJsxFactoryEntity(),
                 compilerOptions.reactNamespace,
                 tagName,
                 objectProperties,

diff --git a/src/compiler/utilities.ts b/src/compiler/utilities.ts
@@ -34,6 +34,8 @@ namespace ts {
         /* @internal */
         isSourceFileFromExternalLibrary(file: SourceFile): boolean;
 
+        /* @internal */
+        getJsxFactoryEntity(): EntityName;
         getCommonSourceDirectory(): string;
         getCanonicalFileName(fileName: string): string;
         getNewLine(): string;

diff --git a/tests/baselines/reference/jsxFactoryIdentifier.js b/tests/baselines/reference/jsxFactoryIdentifier.js
@@ -75,8 +75,8 @@ let c;
 class A {
     view() {
         return [
-            React.createElement("meta", { content: "helloworld" }),
-            React.createElement("meta", { content: c.a.b })
+            createElement("meta", { content: "helloworld" }),
+            createElement("meta", { content: c.a.b })
         ];
     }
 }
diff --git a/tests/baselines/reference/jsxFactoryQualifiedName.js b/tests/baselines/reference/jsxFactoryQualifiedName.js
@@ -74,8 +74,8 @@ let c;
 class A {
     view() {
         return [
-            React.createElement("meta", { content: "helloworld" }),
-            React.createElement("meta", { content: c.a.b })
+            Element_1.Element.createElement("meta", { content: "helloworld" }),
+            Element_1.Element.createElement("meta", { content: c.a.b })
         ];
     }
 }