Remove refs for stateless component from MUI Fixes #188

src/TextField.js

@@ -2,6 +2,9 @@ import TextField from 'material-ui/TextField'
 import createComponent from './createComponent'
 import mapError from './mapError'
 
-export default createComponent(TextField, ({ defaultValue, ...props }) =>
-  mapError(props)
-)
+export default createComponent(TextField, ({
+  defaultValue,
+  ...props
+}) => ({
+  ...mapError(props)
+}))

src/__tests__/TextField.spec.js

@@ -21,7 +21,7 @@ describe('TextField', () => {
           value: 'Foo'
         }
       }).render()
-    ).toEqualJSX(<TextField name="myText" value="Foo" ref={() => {}} />)
+    ).toEqualJSX(<TextField name="myText" value="Foo" />)
   })
 
   it('renders a TextField with no error when not touched', () => {
@@ -35,7 +35,7 @@ describe('TextField', () => {
           error: 'FooError'
         }
       }).render()
-    ).toEqualJSX(<TextField name="myText" value="Foo" ref={() => {}} />)
+    ).toEqualJSX(<TextField name="myText" value="Foo" />)
   })
 
   it('renders a TextField with an error', () => {
@@ -56,7 +56,6 @@ describe('TextField', () => {
         value="Foo"
         error
         helperText="FooError"
-        ref={() => {}}
       />
     )
   })
@@ -72,7 +71,7 @@ describe('TextField', () => {
           warning: 'FooWarning'
         }
       }).render()
-    ).toEqualJSX(<TextField name="myText" value="Foo" ref={() => {}} />)
+    ).toEqualJSX(<TextField name="myText" value="Foo" />)
   })
 
   it('renders a TextField with an warning', () => {
@@ -93,7 +92,6 @@ describe('TextField', () => {
         value="Foo"
         error
         helperText="FooWarning"
-        ref={() => {}}
       />
     )
   })
@@ -117,7 +115,6 @@ describe('TextField', () => {
         value=""
         error
         helperText="FooWarning"
-        ref={() => {}}
       />
     )
   })

src/createComponent.js

@@ -1,4 +1,5 @@
 import { Component, createElement } from 'react'
+import { isStateLess } from './utils';
 
 /**
  * Creates a component class that renders the given Material UI component
@@ -16,7 +17,7 @@ export default function createComponent(MaterialUIComponent, mapProps) {
     render() {
       return createElement(MaterialUIComponent, {
         ...mapProps(this.props),
-        ref: el => this.component = el
+        ref: (!isStateLess(MaterialUIComponent) ? el => this.component = el : null)
       })
     }
   }

src/utils.js

@@ -0,0 +1 @@
+export const isStateLess = (Component) => !Component.prototype.render;