From b112948130e9251af947b3b1743df61f4e484d3e Mon Sep 17 00:00:00 2001
From: afc163 <afc163@gmail.com>
Date: Sun, 16 Jul 2017 15:39:21 +0800
Subject: [PATCH] TextArea should be resetable in form, close #6776

---
 components/input/TextArea.tsx            |  5 ++++
 components/input/__tests__/index.test.js | 34 ++++++++++++++++++++++++
 2 files changed, 39 insertions(+)

diff --git a/components/input/TextArea.tsx b/components/input/TextArea.tsx
index 02c5624c77..eb12b0678e 100644
--- a/components/input/TextArea.tsx
+++ b/components/input/TextArea.tsx
@@ -110,6 +110,11 @@ export default class TextArea extends React.Component<TextAreaProps & HTMLTextar
       ...props.style,
       ...this.state.textareaStyles,
     };
+    // Fix https://github.com/ant-design/ant-design/issues/6776
+    // Make sure it could be reset when using form.getFieldDecorator
+    if ('value' in otherProps) {
+      otherProps.value = otherProps.value || '';
+    }
     return (
       <textarea
         {...otherProps}
diff --git a/components/input/__tests__/index.test.js b/components/input/__tests__/index.test.js
index 8c72f21a6d..c345cd4e64 100644
--- a/components/input/__tests__/index.test.js
+++ b/components/input/__tests__/index.test.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import { mount } from 'enzyme';
 import Input from '..';
+import Form from '../../form';
 
 const { TextArea } = Input;
 
@@ -20,3 +21,36 @@ describe('TextArea', () => {
     expect(mockFunc).toHaveBeenCalledTimes(2);
   });
 });
+
+describe('As Form Control', () => {
+  it('should be reset when wrapped in form.getFieldDecorator without initialValue', async () => {
+    class Demo extends React.Component {
+      reset = () => {
+        this.props.form.resetFields();
+      }
+      render() {
+        const { getFieldDecorator } = this.props.form;
+        return (
+          <Form>
+            <Form.Item>
+              {getFieldDecorator('input')(<Input />)}
+            </Form.Item>
+            <Form.Item>
+              {getFieldDecorator('textarea')(<Input.TextArea />)}
+            </Form.Item>
+            <button onClick={this.reset}>reset</button>
+          </Form>
+        );
+      }
+    }
+    const DemoForm = Form.create()(Demo);
+    const wrapper = mount(<DemoForm />);
+    wrapper.find('input').simulate('change', { target: { value: '111' } });
+    wrapper.find('textarea').simulate('change', { target: { value: '222' } });
+    expect(wrapper.find('input').prop('value')).toBe('111');
+    expect(wrapper.find('textarea').prop('value')).toBe('222');
+    wrapper.find('button').simulate('click');
+    expect(wrapper.find('input').prop('value')).toBe('');
+    expect(wrapper.find('textarea').prop('value')).toBe('');
+  });
+});