From f6c393c0e8c3693eaa75b5d64cb57488dfa44a03 Mon Sep 17 00:00:00 2001
From: Jim Sproch <jsproch@fb.com>
Date: Mon, 4 Apr 2016 10:39:07 -0700
Subject: [PATCH] Cleanup and bug fixes for merge.

---
 .../dom/client/wrappers/ReactDOMInput.js      | 30 ++++++-
 .../dom/client/wrappers/ReactDOMTextarea.js   | 86 +++++++++++--------
 .../wrappers/__tests__/ReactDOMInput-test.js  | 14 ++-
 .../__tests__/ReactDOMTextarea-test.js        | 40 ++++++---
 .../dom/shared/HTMLDOMPropertyConfig.js       |  1 -
 src/renderers/dom/shared/ReactDOMComponent.js | 28 +++++-
 .../__tests__/ReactDOMComponent-test.js       |  2 +-
 .../__tests__/ReactStatelessComponent-test.js |  2 +-
 8 files changed, 147 insertions(+), 56 deletions(-)

diff --git a/src/renderers/dom/client/wrappers/ReactDOMInput.js b/src/renderers/dom/client/wrappers/ReactDOMInput.js
index 56814142e39dc..a3b58e82a20c7 100644
--- a/src/renderers/dom/client/wrappers/ReactDOMInput.js
+++ b/src/renderers/dom/client/wrappers/ReactDOMInput.js
@@ -75,7 +75,7 @@ var ReactDOMInput = {
     }, props, {
       defaultChecked: undefined,
       defaultValue: undefined,
-      value: value != null ? value : props.defaultValue,
+      value: value != null ? value : inst._wrapperState.initialValue,
       checked: checked != null ? checked : inst._wrapperState.initialChecked,
       onChange: inst._wrapperState.onChange,
     });
@@ -138,8 +138,10 @@ var ReactDOMInput = {
       warnIfValueIsNull(props);
     }
 
+    var defaultValue = props.defaultValue;
     inst._wrapperState = {
-      initialChecked: props.defaultChecked || false,
+      initialChecked: props.checked != null ? props.checked : props.defaultChecked,
+      initialValue: props.value != null ? props.value : defaultValue,
       listeners: null,
       onChange: _handleChange.bind(inst),
     };
@@ -215,6 +217,30 @@ var ReactDOMInput = {
       if (newValue !== node.value) {
         node.value = newValue;
       }
+    } else {
+      ReactDOMInput.postUpdateWrapper(inst);
+    }
+  },
+
+  postUpdateWrapper: function(inst) {
+    var props = inst._currentElement.props;
+    if (!props.value && props.defaultValue) {
+      invariant(inst._rootNodeID, 'Must be mounted to initialize initial input value');
+      var node = ReactDOMComponentTree.getNodeFromInstance(inst);
+      if (node.defaultValue !== props.defaultValue) {
+        var tmp = node.value;
+        node.defaultValue = '' + props.defaultValue;
+        node.value = tmp;
+      }
+    }
+    if (!props.checked && props.defaultChecked) {
+      invariant(inst._rootNodeID, 'Must be mounted to initialize initial input value');
+      var node = ReactDOMComponentTree.getNodeFromInstance(inst);
+      if (node.defaultChecked !== props.defaultChecked) {
+        var tmp = node.checked;
+        node.defaultChecked = '' + props.defaultChecked;
+        node.checked = tmp;
+      }
     }
   },
 };
diff --git a/src/renderers/dom/client/wrappers/ReactDOMTextarea.js b/src/renderers/dom/client/wrappers/ReactDOMTextarea.js
index 37213bf319c0d..db05f9a0fd416 100644
--- a/src/renderers/dom/client/wrappers/ReactDOMTextarea.js
+++ b/src/renderers/dom/client/wrappers/ReactDOMTextarea.js
@@ -66,44 +66,12 @@ var ReactDOMTextarea = {
 
     var value = LinkedValueUtils.getValue(props);
 
-    // only bother fetching default value if we're going to use it
-    if (value == null) {
-      var defaultValue = props.defaultValue;
-      // TODO (yungsters): Remove support for children content in <textarea>.
-      var children = props.children;
-      if (children != null) {
-        if (__DEV__) {
-          warning(
-            false,
-            'Use the `defaultValue` or `value` props instead of setting ' +
-            'children on <textarea>.'
-          );
-        }
-        invariant(
-          defaultValue == null,
-          'If you supply `defaultValue` on a <textarea>, do not pass children.'
-        );
-        if (Array.isArray(children)) {
-          invariant(
-            children.length <= 1,
-            '<textarea> can only have at most one child.'
-          );
-          children = children[0];
-        }
-
-        defaultValue = '' + children;
-      }
-      if (defaultValue == null) {
-        defaultValue = '';
-      }
-    }
-
     // The value can be a boolean or object so that's why it's
     // forced to be a string.
     var nativeProps = Object.assign({}, props, {
-      defaultValue: '' + (value != null ? value : defaultValue),
       value: undefined,
-      children: undefined,
+      defaultValue: undefined,
+      children: '' + (value != null ? value : inst._wrapperState.initialValue),
       onChange: inst._wrapperState.onChange,
     });
 
@@ -142,7 +110,43 @@ var ReactDOMTextarea = {
       warnIfValueIsNull(props);
     }
 
+
+    var value = LinkedValueUtils.getValue(props);
+
+    // only bother fetching default value if we're going to use it
+    if (value == null) {
+      var defaultValue = props.defaultValue;
+      // TODO (yungsters): Remove support for children content in <textarea>.
+      var children = props.children;
+      if (children != null) {
+        if (__DEV__) {
+          warning(
+            false,
+            'Use the `defaultValue` or `value` props instead of setting ' +
+            'children on <textarea>.'
+          );
+        }
+        invariant(
+          defaultValue == null,
+          'If you supply `defaultValue` on a <textarea>, do not pass children.'
+        );
+        if (Array.isArray(children)) {
+          invariant(
+            children.length <= 1,
+            '<textarea> can only have at most one child.'
+          );
+          children = children[0];
+        }
+
+        defaultValue = '' + children;
+      }
+      if (defaultValue == null) {
+        defaultValue = '';
+      }
+    }
+
     inst._wrapperState = {
+      initialValue: '' + (value != null ? value : defaultValue),
       listeners: null,
       onChange: _handleChange.bind(inst),
     };
@@ -167,6 +171,20 @@ var ReactDOMTextarea = {
       if (newValue !== node.value) {
         node.value = newValue;
       }
+    } else {
+      ReactDOMTextarea.postUpdateWrapper(inst);
+    }
+  },
+
+  postUpdateWrapper: function(inst) {
+    var props = inst._currentElement.props;
+    if (props.value == null && props.defaultValue) {
+      invariant(inst._rootNodeID, 'Must be mounted to initialize defaultValue');
+      var node = ReactDOMComponentTree.getNodeFromInstance(inst);
+      if (node.defaultValue !== props.defaultValue) {
+        node.value = node.value; // Hack to detach value and defaultValue
+        node.defaultValue = props.defaultValue;
+      }
     }
   },
 };
diff --git a/src/renderers/dom/client/wrappers/__tests__/ReactDOMInput-test.js b/src/renderers/dom/client/wrappers/__tests__/ReactDOMInput-test.js
index 8b406015773c9..60a07091e1c7d 100644
--- a/src/renderers/dom/client/wrappers/__tests__/ReactDOMInput-test.js
+++ b/src/renderers/dom/client/wrappers/__tests__/ReactDOMInput-test.js
@@ -18,6 +18,7 @@ describe('ReactDOMInput', function() {
   var EventConstants;
   var React;
   var ReactDOM;
+  var ReactDOMServer;
   var ReactDOMFeatureFlags;
   var ReactLink;
   var ReactTestUtils;
@@ -27,6 +28,7 @@ describe('ReactDOMInput', function() {
     EventConstants = require('EventConstants');
     React = require('React');
     ReactDOM = require('ReactDOM');
+    ReactDOMServer = require('ReactDOMServer');
     ReactDOMFeatureFlags = require('ReactDOMFeatureFlags');
     ReactLink = require('ReactLink');
     ReactTestUtils = require('ReactTestUtils');
@@ -67,7 +69,7 @@ describe('ReactDOMInput', function() {
 
     ReactDOM.render(<input type="text" defaultValue="1" />, container);
 
-    expect(node.value).toBe('1');
+    expect(node.value).toBe('0');
   });
 
   it('should take `defaultValue` when changing to uncontrolled input', function() {
@@ -79,7 +81,15 @@ describe('ReactDOMInput', function() {
 
     ReactDOM.render(<input type="text" defaultValue="1" />, container);
 
-    expect(node.value).toBe('1');
+    expect(node.value).toBe('0');
+  });
+
+  it('should render value for SSR', function() {
+    var image = ReactDOMServer.renderToString(<input type="text" defaultValue="1" />);
+    var div = document.createElement('div');
+    div.innerHTML = image;
+    expect(div.firstChild.getAttribute('value')).toBe('1');
+    expect(div.firstChild.getAttribute('defaultValue')).toBe(null);
   });
 
   it('should display "foobar" for `defaultValue` of `objToString`', function() {
diff --git a/src/renderers/dom/client/wrappers/__tests__/ReactDOMTextarea-test.js b/src/renderers/dom/client/wrappers/__tests__/ReactDOMTextarea-test.js
index 9117c9330a2c5..76baec42836fe 100644
--- a/src/renderers/dom/client/wrappers/__tests__/ReactDOMTextarea-test.js
+++ b/src/renderers/dom/client/wrappers/__tests__/ReactDOMTextarea-test.js
@@ -16,6 +16,7 @@ var emptyFunction = require('emptyFunction');
 describe('ReactDOMTextarea', function() {
   var React;
   var ReactDOM;
+  var ReactDOMServer;
   var ReactLink;
   var ReactTestUtils;
 
@@ -24,6 +25,7 @@ describe('ReactDOMTextarea', function() {
   beforeEach(function() {
     React = require('React');
     ReactDOM = require('ReactDOM');
+    ReactDOMServer = require('ReactDOMServer');
     ReactLink = require('ReactLink');
     ReactTestUtils = require('ReactTestUtils');
 
@@ -48,9 +50,9 @@ describe('ReactDOMTextarea', function() {
 
     expect(node.value).toBe('giraffe');
 
-    // Changing `defaultValue` should change if no value set.
+    // Changing `defaultValue` should do nothing.
     renderTextarea(<textarea defaultValue="gorilla" />, container, true);
-    expect(node.value).toEqual('gorilla');
+    expect(node.value).toEqual('giraffe');
 
     node.value = 'cat';
 
@@ -85,6 +87,14 @@ describe('ReactDOMTextarea', function() {
     expect(node.value).toBe('foobar');
   });
 
+  it('should set defaultValue', function() {
+    var container = document.createElement('div');
+    ReactDOM.render(<textarea defaultValue="foo" />, container);
+    ReactDOM.render(<textarea defaultValue="bar" />, container);
+    ReactDOM.render(<textarea defaultValue="noise" />, container);
+    expect(container.firstChild.defaultValue).toBe('noise');
+  });
+
   it('should not render value as an attribute', function() {
     var stub = <textarea value="giraffe" onChange={emptyFunction} />;
     var node = renderTextarea(stub);
@@ -113,6 +123,14 @@ describe('ReactDOMTextarea', function() {
     expect(node.value).toEqual('gorilla');
   });
 
+  it('should render value for SSR', function() {
+    var image = ReactDOMServer.renderToString(<textarea defaultValue="1" />);
+    var div = document.createElement('div');
+    div.innerHTML = image;
+    expect(div.firstChild.innerHTML).toBe('1');
+    expect(div.firstChild.getAttribute('defaultValue')).toBe(null);
+  });
+
   it('should allow setting `value` to `true`', function() {
     var container = document.createElement('div');
     var stub = <textarea value="giraffe" onChange={emptyFunction} />;
@@ -163,27 +181,27 @@ describe('ReactDOMTextarea', function() {
   it('should take updates to `defaultValue` for uncontrolled textarea', function() {
     var container = document.createElement('div');
 
-    var node = ReactDOM.render(<textarea type="text" defaultValue="0" />, container);
+    var node = ReactDOM.render(<textarea defaultValue="0" />, container);
 
     expect(node.value).toBe('0');
 
-    ReactDOM.render(<textarea type="text" defaultValue="1" />, container);
+    ReactDOM.render(<textarea defaultValue="1" />, container);
 
-    expect(node.value).toBe('1');
+    expect(node.value).toBe('0');
   });
 
   it('should take updates to children in lieu of `defaultValue` for uncontrolled textarea', function() {
     var container = document.createElement('div');
 
-    var node = ReactDOM.render(<textarea type="text" defaultValue="0" />, container);
+    var node = ReactDOM.render(<textarea defaultValue="0" />, container);
 
     expect(node.value).toBe('0');
 
     spyOn(console, 'error'); // deprecation warning for `children` content
 
-    ReactDOM.render(<textarea type="text">1</textarea>, container);
+    ReactDOM.render(<textarea>1</textarea>, container);
 
-    expect(node.value).toBe('1');
+    expect(node.value).toBe('0');
   });
 
   it('should not incur unnecessary DOM mutations', function() {
@@ -228,9 +246,9 @@ describe('ReactDOMTextarea', function() {
     expect(console.error.argsForCall.length).toBe(1);
     expect(node.value).toBe('giraffe');
 
-    // Changing children should cause value to change (new behavior of `defaultValue`)
+    // Changing children should do nothing, it functions like `defaultValue`.
     stub = ReactDOM.render(<textarea>gorilla</textarea>, container);
-    expect(node.value).toEqual('gorilla');
+    expect(node.value).toEqual('giraffe');
   });
 
   it('should not keep value when switching to uncontrolled element if not changed', function() {
@@ -242,7 +260,7 @@ describe('ReactDOMTextarea', function() {
 
     ReactDOM.render(<textarea defaultValue="gorilla"></textarea>, container);
 
-    expect(node.value).toEqual('gorilla');
+    expect(node.value).toEqual('kitten');
   });
 
   it('should keep value when switching to uncontrolled element if changed', function() {
diff --git a/src/renderers/dom/shared/HTMLDOMPropertyConfig.js b/src/renderers/dom/shared/HTMLDOMPropertyConfig.js
index 60f87e2586238..f5e0258d293a6 100644
--- a/src/renderers/dom/shared/HTMLDOMPropertyConfig.js
+++ b/src/renderers/dom/shared/HTMLDOMPropertyConfig.js
@@ -61,7 +61,6 @@ var HTMLDOMPropertyConfig = {
     data: 0, // For `<object />` acts as `src`.
     dateTime: 0,
     default: HAS_BOOLEAN_VALUE,
-    defaultValue: MUST_USE_PROPERTY,
     defer: HAS_BOOLEAN_VALUE,
     dir: 0,
     disabled: HAS_BOOLEAN_VALUE,
diff --git a/src/renderers/dom/shared/ReactDOMComponent.js b/src/renderers/dom/shared/ReactDOMComponent.js
index 808706d62b8dc..1bd004310e67c 100644
--- a/src/renderers/dom/shared/ReactDOMComponent.js
+++ b/src/renderers/dom/shared/ReactDOMComponent.js
@@ -349,6 +349,14 @@ function postUpdateSelectWrapper() {
   ReactDOMSelect.postUpdateWrapper(this);
 }
 
+function postUpdateTextareaWrapper() {
+  ReactDOMTextarea.postUpdateWrapper(this);
+}
+
+function postUpdateInputWrapper() {
+  ReactDOMInput.postUpdateWrapper(this);
+}
+
 // For HTML, certain tags should omit their close tag. We keep a whitelist for
 // those special-case tags.
 
@@ -488,6 +496,7 @@ ReactDOMComponent.Mixin = {
         ReactDOMInput.mountWrapper(this, props, nativeParent);
         props = ReactDOMInput.getNativeProps(this, props);
         transaction.getReactMountReady().enqueue(trapBubbledEventsLocal, this);
+        transaction.getReactMountReady().enqueue(postUpdateInputWrapper, this);
         break;
       case 'option':
         ReactDOMOption.mountWrapper(this, props, nativeParent);
@@ -502,6 +511,7 @@ ReactDOMComponent.Mixin = {
         ReactDOMTextarea.mountWrapper(this, props, nativeParent);
         props = ReactDOMTextarea.getNativeProps(this, props);
         transaction.getReactMountReady().enqueue(trapBubbledEventsLocal, this);
+        transaction.getReactMountReady().enqueue(postUpdateTextareaWrapper, this);
         break;
     }
 
@@ -811,10 +821,20 @@ ReactDOMComponent.Mixin = {
       context
     );
 
-    if (this._tag === 'select') {
-      // <select> value update needs to occur after <option> children
-      // reconciliation
-      transaction.getReactMountReady().enqueue(postUpdateSelectWrapper, this);
+    switch (this._tag) {
+      case 'button':
+        break;
+      case 'input':
+        transaction.getReactMountReady().enqueue(postUpdateInputWrapper, this);
+        break;
+      case 'option':
+        break;
+      case 'select':
+        transaction.getReactMountReady().enqueue(postUpdateSelectWrapper, this);
+        break;
+      case 'textarea':
+        transaction.getReactMountReady().enqueue(postUpdateTextareaWrapper, this);
+        break;
     }
   },
 
diff --git a/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js b/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
index 10ef6d46dac1b..2c0f7c44f90da 100644
--- a/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
+++ b/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js
@@ -492,7 +492,7 @@ describe('ReactDOMComponent', function() {
       node.setAttribute = function(key, value) {
         oldSetAttribute(key, value);
         nodeValueSetter(key, value);
-      }
+      };
 
       ReactDOM.render(<div value="" />, container);
       expect(nodeValueSetter.mock.calls.length).toBe(0);
diff --git a/src/renderers/shared/reconciler/__tests__/ReactStatelessComponent-test.js b/src/renderers/shared/reconciler/__tests__/ReactStatelessComponent-test.js
index 8e0c8ac492197..dbdac01804efc 100644
--- a/src/renderers/shared/reconciler/__tests__/ReactStatelessComponent-test.js
+++ b/src/renderers/shared/reconciler/__tests__/ReactStatelessComponent-test.js
@@ -108,7 +108,7 @@ describe('ReactStatelessComponent', function() {
     }).toThrow();
     expect(console.error.calls.length).toBe(1);
     expect(console.error.argsForCall[0][0]).toContain(
-      'NotAComponent(...): A valid React element (or null) must be returned. '+
+      'NotAComponent(...): A valid React element (or null) must be returned. ' +
       'You may have returned undefined, an array or some other invalid object.'
     );
   });