From 63344eb0a439dfe0ef01b4c10d0f7a8af4239789 Mon Sep 17 00:00:00 2001
From: Sebastian McKenzie <sebmck@gmail.com>
Date: Fri, 24 Apr 2015 19:28:51 +0100
Subject: [PATCH] only skip traversal of immutable JSX elements in the
 optimisation.react.constantElements transformer when we've actually hoisted
 them - closes #1344

---
 .../optimisation/react.constant-elements.js           |  6 ++++--
 src/babel/traversal/path/hoister.js                   |  8 ++++++++
 .../children/actual.js                                |  7 +++++++
 .../children/expected.js                              | 11 +++++++++++
 4 files changed, 30 insertions(+), 2 deletions(-)
 create mode 100644 test/core/fixtures/transformation/optimisation.react.constant-elements/children/actual.js
 create mode 100644 test/core/fixtures/transformation/optimisation.react.constant-elements/children/expected.js

diff --git a/src/babel/transformation/transformers/optimisation/react.constant-elements.js b/src/babel/transformation/transformers/optimisation/react.constant-elements.js
index f269f63edf..42cd5b8be0 100644
--- a/src/babel/transformation/transformers/optimisation/react.constant-elements.js
+++ b/src/babel/transformation/transformers/optimisation/react.constant-elements.js
@@ -33,9 +33,11 @@ export function JSXElement(node, parent, scope, file) {
 
   var state = { isImmutable: true };
   this.traverse(immutabilityVisitor, state);
-  this.skip();
 
-  if (state.isImmutable) this.hoist();
+  if (state.isImmutable) {
+    this.hoist();
+    this.skip();
+  }
 
   node._hoisted = true;
 }
diff --git a/src/babel/traversal/path/hoister.js b/src/babel/traversal/path/hoister.js
index 2ba87bf4c5..6bb4283364 100644
--- a/src/babel/traversal/path/hoister.js
+++ b/src/babel/traversal/path/hoister.js
@@ -109,6 +109,14 @@ export default class PathHoister {
       ])
     ]);
 
+    var parent = this.path.parentPath;
+
+    if (parent.isJSXElement() && this.path.container === parent.node.children) {
+      // turning the `span` in `<div><span /></div>` to an expression so we need to wrap it with
+      // an expression container
+      uid = t.jSXExpressionContainer(uid);
+    }
+
     this.path.replaceWith(uid);
   }
 }
diff --git a/test/core/fixtures/transformation/optimisation.react.constant-elements/children/actual.js b/test/core/fixtures/transformation/optimisation.react.constant-elements/children/actual.js
new file mode 100644
index 0000000000..5c49d53731
--- /dev/null
+++ b/test/core/fixtures/transformation/optimisation.react.constant-elements/children/actual.js
@@ -0,0 +1,7 @@
+var Foo = React.createClass({
+  render: function() {
+    return <div className={this.props.className}>
+      <span />
+    </div>;
+  }
+});
diff --git a/test/core/fixtures/transformation/optimisation.react.constant-elements/children/expected.js b/test/core/fixtures/transformation/optimisation.react.constant-elements/children/expected.js
new file mode 100644
index 0000000000..6f8b7eb554
--- /dev/null
+++ b/test/core/fixtures/transformation/optimisation.react.constant-elements/children/expected.js
@@ -0,0 +1,11 @@
+"use strict";
+
+var _ref = <span />;
+
+var Foo = React.createClass({
+  render: function render() {
+    return <div className={this.props.className}>
+      {_ref}
+    </div>;
+  }
+});