keep mountWrapper and getNativeProps order

facebook · Nov 3, 2015 · e80f3cd · e80f3cd
1 parent a04eb1d
commit e80f3cd
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 28 deletions.
diff --git a/src/renderers/dom/client/wrappers/ReactDOMOption.js b/src/renderers/dom/client/wrappers/ReactDOMOption.js
@@ -17,6 +17,27 @@ var ReactDOMSelect = require('ReactDOMSelect');
 var assign = require('Object.assign');
 var warning = require('warning');
 
+function flatterChildren(children) {
+  var content = '';
+
+  // Flatten children and warn if they aren't strings or numbers;
+  // invalid types are ignored.
+  ReactChildren.forEach(children, function(child) {
+    if (child == null) {
+      return;
+    }
+    if (typeof child === 'string' || typeof child === 'number') {
+      content += child;
+    } else {
+      warning(
+        false,
+        'Only strings and numbers are supported as <option> children.'
+      );
+    }
+  });
+
+  return content;
+}
 /**
  * Implements an <option> native component that warns when `selected` is set.
  */
@@ -42,11 +63,10 @@ var ReactDOMOption = {
     var selected = null;
     if (selectValue != null) {
       var value;
-      if ('value' in props) {
+      if (props.value != null) {
         value = props.value + '';
       } else {
-        // already stringify by getNativeProps
-        value = props.children;
+        value = flatterChildren(props.children);
       }
       selected = false;
       if (Array.isArray(selectValue)) {
@@ -63,36 +83,18 @@ var ReactDOMOption = {
     }
 
     inst._wrapperState = {selected: selected};
-
-    // Read state only from initial mount because <select> updates value
-    // manually; we need the initial state only for server rendering
-    if (selected != null) {
-      props.selected = selected;
-    }
   },
 
   getNativeProps: function(inst, props) {
     var nativeProps = assign({selected: undefined, children: undefined}, props);
 
-    var content = '';
-
-    // Flatten children and warn if they aren't strings or numbers;
-    // invalid types are ignored.
-    ReactChildren.forEach(props.children, function(child) {
-      if (child == null) {
-        return;
-      }
-      if (typeof child === 'string' || typeof child === 'number') {
-        content += child;
-      } else {
-        warning(
-          false,
-          'Only strings and numbers are supported as <option> children.'
-        );
-      }
-    });
+    // Read state only from initial mount because <select> updates value
+    // manually; we need the initial state only for server rendering
+    if (inst._wrapperState.selected != null) {
+      nativeProps.selected = inst._wrapperState.selected;
+    }
 
-    nativeProps.children = content;
+    nativeProps.children = flatterChildren(props.children);
     return nativeProps;
   },
 

diff --git a/src/renderers/dom/shared/ReactDOMComponent.js b/src/renderers/dom/shared/ReactDOMComponent.js
@@ -585,8 +585,8 @@ ReactDOMComponent.Mixin = {
         transaction.getReactMountReady().enqueue(trapBubbledEventsLocal, this);
         break;
       case 'option':
-        props = ReactDOMOption.getNativeProps(this, props);
         ReactDOMOption.mountWrapper(this, props, nativeParent);
+        props = ReactDOMOption.getNativeProps(this, props);
         break;
       case 'select':
         ReactDOMSelect.mountWrapper(this, props, nativeParent);