From eef371c3df5fb6807eeaf50a1d8c0ff7f13048b4 Mon Sep 17 00:00:00 2001
From: Amjad Masad <amjad.masad@gmail.com>
Date: Tue, 6 Jan 2015 21:47:47 -0500
Subject: [PATCH] Add support for React pre v0.12 transform This uses an option
 `reactCompat` to emit code that works with React pre v0.12

---
 lib/6to5/transformation/transformers/react.js | 39 ++++++++++++++++---
 .../react/compat-convert-component/actual.js  |  3 ++
 .../compat-convert-component/expected.js      |  3 ++
 .../compat-convert-component/options.json     |  3 ++
 .../react/compat-convert-tags/actual.js       |  1 +
 .../react/compat-convert-tags/expected.js     |  3 ++
 .../react/compat-convert-tags/options.json    |  3 ++
 7 files changed, 50 insertions(+), 5 deletions(-)
 create mode 100644 test/fixtures/transformation/react/compat-convert-component/actual.js
 create mode 100644 test/fixtures/transformation/react/compat-convert-component/expected.js
 create mode 100644 test/fixtures/transformation/react/compat-convert-component/options.json
 create mode 100644 test/fixtures/transformation/react/compat-convert-tags/actual.js
 create mode 100644 test/fixtures/transformation/react/compat-convert-tags/expected.js
 create mode 100644 test/fixtures/transformation/react/compat-convert-tags/options.json

diff --git a/lib/6to5/transformation/transformers/react.js b/lib/6to5/transformation/transformers/react.js
index 50895a6e95..b63bae1fad 100644
--- a/lib/6to5/transformation/transformers/react.js
+++ b/lib/6to5/transformation/transformers/react.js
@@ -36,8 +36,13 @@ exports.XJSAttribute = {
   }
 };
 
+var isTag = function(tagName) {
+  return (/^[a-z]|\-/).test(tagName);
+};
+
 exports.XJSOpeningElement = {
-  exit: function (node) {
+  exit: function (node, parent, file) {
+    var reactCompat = file.opts && file.opts.reactCompat;
     var tagExpr = node.name;
     var args = [];
 
@@ -48,10 +53,12 @@ exports.XJSOpeningElement = {
       tagName = tagExpr.value;
     }
 
-    if (tagName && (/[a-z]/.exec(tagName[0]) || tagName.indexOf("-") >= 0)) {
-      args.push(t.literal(tagName));
-    } else {
-      args.push(tagExpr);
+    if (!reactCompat) {
+      if (tagName && isTag(tagName)) {
+        args.push(t.literal(tagName));
+      } else {
+        args.push(tagExpr);
+      }
     }
 
     var props = node.attributes;
@@ -96,6 +103,28 @@ exports.XJSOpeningElement = {
 
     args.push(props);
 
+    if (reactCompat) {
+      if (tagName && isTag(tagName)) {
+        return t.callExpression(
+          t.memberExpression(
+            t.memberExpression(
+              t.identifier('React'),
+              t.identifier('DOM'),
+              false
+            ),
+            tagExpr,
+            t.isLiteral(tagExpr)
+          ),
+          args
+        );
+      } else {
+        return t.callExpression(
+          tagExpr,
+          args
+        );
+      }
+    }
+
     tagExpr = t.memberExpression(t.identifier("React"), t.identifier("createElement"));
     return t.callExpression(tagExpr, args);
   }
diff --git a/test/fixtures/transformation/react/compat-convert-component/actual.js b/test/fixtures/transformation/react/compat-convert-component/actual.js
new file mode 100644
index 0000000000..240396e8a8
--- /dev/null
+++ b/test/fixtures/transformation/react/compat-convert-component/actual.js
@@ -0,0 +1,3 @@
+var x = <Component foo="bar">
+  <Namespace.Component />
+</Component>
diff --git a/test/fixtures/transformation/react/compat-convert-component/expected.js b/test/fixtures/transformation/react/compat-convert-component/expected.js
new file mode 100644
index 0000000000..e603231871
--- /dev/null
+++ b/test/fixtures/transformation/react/compat-convert-component/expected.js
@@ -0,0 +1,3 @@
+var x = Component({
+  foo: "bar"
+}, Namespace.Component(null));
diff --git a/test/fixtures/transformation/react/compat-convert-component/options.json b/test/fixtures/transformation/react/compat-convert-component/options.json
new file mode 100644
index 0000000000..1f358613e7
--- /dev/null
+++ b/test/fixtures/transformation/react/compat-convert-component/options.json
@@ -0,0 +1,3 @@
+{
+  "reactCompat": true
+}
diff --git a/test/fixtures/transformation/react/compat-convert-tags/actual.js b/test/fixtures/transformation/react/compat-convert-tags/actual.js
new file mode 100644
index 0000000000..6b83935245
--- /dev/null
+++ b/test/fixtures/transformation/react/compat-convert-tags/actual.js
@@ -0,0 +1 @@
+var x = <div foo="bar"><font-face></font-face></div>;
diff --git a/test/fixtures/transformation/react/compat-convert-tags/expected.js b/test/fixtures/transformation/react/compat-convert-tags/expected.js
new file mode 100644
index 0000000000..742c1cab89
--- /dev/null
+++ b/test/fixtures/transformation/react/compat-convert-tags/expected.js
@@ -0,0 +1,3 @@
+var x = React.DOM.div({
+  foo: "bar"
+}, React.DOM["font-face"](null));
diff --git a/test/fixtures/transformation/react/compat-convert-tags/options.json b/test/fixtures/transformation/react/compat-convert-tags/options.json
new file mode 100644
index 0000000000..1f358613e7
--- /dev/null
+++ b/test/fixtures/transformation/react/compat-convert-tags/options.json
@@ -0,0 +1,3 @@
+{
+  "reactCompat": true
+}