From 2ddbc1968ec3b818d06658d6bc121d8d103b0ccc Mon Sep 17 00:00:00 2001
From: Hasta Ragil <npcmamaz@gmail.com>
Date: Fri, 14 Oct 2016 22:31:45 +0700
Subject: [PATCH] Pass onChange on Redux Form Field component to Material UI
 Select Field

---
 src/SelectField.js                |  9 +++++++--
 src/__tests__/SelectField.spec.js | 25 +++++++++++++++++++++++++
 2 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/src/SelectField.js b/src/SelectField.js
index ea70e49..bc9724b 100755
--- a/src/SelectField.js
+++ b/src/SelectField.js
@@ -4,8 +4,13 @@ import mapError from './mapError'
 
 export default createComponent(
   SelectField,
-  ({ input: { onChange, ...inputProps }, ...props }) => ({
+  ({ input: { onChange, ...inputProps }, onChange:onChangeFromField, ...props }) => ({
     ...mapError(props),
     ...inputProps,
-    onChange: (event, index, value) => onChange(value)
+    onChange: (event, index, value) => {
+      onChange(value)
+      if(onChangeFromField) {
+        onChangeFromField(value)
+      }
+    }
   }))
diff --git a/src/__tests__/SelectField.spec.js b/src/__tests__/SelectField.spec.js
index 796fa3a..3f89b58 100644
--- a/src/__tests__/SelectField.spec.js
+++ b/src/__tests__/SelectField.spec.js
@@ -71,6 +71,31 @@ describe('SelectField', () => {
       .toHaveBeenCalledWith('TheValue')
   })
 
+  it('maps onChange from Field property properly', () => {
+    const reduxFormOnChange = createSpy()
+    const fieldOnChange = createSpy()
+
+    const dom = TestUtils.renderIntoDocument(
+      <MuiThemeProvider muiTheme={getMuiTheme()}>
+        <ReduxFormMaterialUISelectField name="mySelect" input={{ onChange:reduxFormOnChange, value: 'Foo' }} onChange={fieldOnChange}/>
+      </MuiThemeProvider>
+    )
+
+    const select = TestUtils.findRenderedComponentWithType(dom, SelectField)
+
+    expect(reduxFormOnChange).toNotHaveBeenCalled()
+    expect(fieldOnChange).toNotHaveBeenCalled()
+
+    select.props.onChange(undefined, 42, 'TheValue')
+
+    expect(reduxFormOnChange)
+      .toHaveBeenCalled()
+      .toHaveBeenCalledWith('TheValue')
+    expect(fieldOnChange)
+      .toHaveBeenCalled()
+      .toHaveBeenCalledWith('TheValue')
+  })
+
   it('provides getRenderedComponent', () => {
     const dom = TestUtils.renderIntoDocument(
       <MuiThemeProvider muiTheme={getMuiTheme()}>