Don't add the data-jsx attribute to components instances (patch)

src/babel.js

@@ -71,9 +71,14 @@ export default function ({types: t}) {
         }
 
         const el = path.node
-
-        if (el.name &&
-          (el.name.name !== 'style' && el.name.name !== STYLE_COMPONENT)) {
+        const {name} = el.name || {}
+
+        if (
+          name &&
+          name !== 'style' &&
+          name !== STYLE_COMPONENT &&
+          name.charAt(0) !== name.charAt(0).toUpperCase()
+        ) {
           for (const attr of el.attributes) {
             if (attr.name === MARKUP_ATTRIBUTE) {
               // avoid double attributes

test/fixtures/component-attribute.js

@@ -0,0 +1,11 @@
+const Test = () => (
+  <div>
+    <span>test</span>
+    <Component />
+    <style jsx>{`
+      span {
+        color: red;
+      }
+    `}</style>
+  </div>
+)

test/fixtures/component-attribute.out.js

@@ -0,0 +1,6 @@
+import _JSXStyle from "styled-jsx/style";
+const Test = () => <div data-jsx={1535297024}>
+    <span data-jsx={1535297024}>test</span>
+    <Component />
+    <_JSXStyle styleId={1535297024} css={"span[data-jsx=\"1535297024\"] {color: red;}"} />
+  </div>;

test/fixtures/multiple-jsx.out.js

@@ -1,7 +1,7 @@
 import _JSXStyle from "styled-jsx/style";
 const Test1 = () => <div data-jsx={1535297024}>
     <span data-jsx={1535297024}>test</span>
-    <Component data-jsx={1535297024} />
+    <Component />
     <_JSXStyle styleId={1535297024} css={"span[data-jsx=\"1535297024\"] {color: red;}"} />
   </div>;
 

test/index.js

@@ -76,6 +76,12 @@ test('works with multiple jsx blocks', async t => {
   t.is(code, out.trim())
 })
 
+test('should not add the data-jsx attribute to components instances', async t => {
+  const {code} = await transform('./fixtures/component-attribute.js')
+  const out = await read('./fixtures/component-attribute.out.js')
+  t.is(code, out.trim())
+})
+
 test('server rendering', t => {
   function App() {
     return React.createElement('div', null,