only skip traversal of immutable JSX elements in the optimisation.react.constantElements transformer when we've actually hoisted them - closes #1344

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;
 }

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);
   }
 }

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>;
+  }
+});

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>;
+  }
+});