diff --git a/src/renderers/dom/stack/client/ReactDOMComponent.js b/src/renderers/dom/stack/client/ReactDOMComponent.js index 0da69549284..5ba3bb1bde1 100644 --- a/src/renderers/dom/stack/client/ReactDOMComponent.js +++ b/src/renderers/dom/stack/client/ReactDOMComponent.js @@ -847,12 +847,18 @@ ReactDOMComponent.Mixin = { var contentToUse = CONTENT_TYPES[typeof props.children] ? props.children : null; var childrenToUse = contentToUse != null ? null : props.children; + // TODO: Validate that text is allowed as a child of this node if (contentToUse != null) { - // TODO: Validate that text is allowed as a child of this node - if (__DEV__) { - setAndValidateContentChildDev.call(this, contentToUse); + // Avoid setting textContent when the text is empty. In IE11 setting + // textContent on a text area will cause the placeholder to not + // show within the textarea until it has been focused and blurred again. + // https://github.com/facebook/react/issues/6731#issuecomment-254874553 + if (contentToUse !== '') { + if (__DEV__) { + setAndValidateContentChildDev.call(this, contentToUse); + } + DOMLazyTree.queueText(lazyTree, contentToUse); } - DOMLazyTree.queueText(lazyTree, contentToUse); } else if (childrenToUse != null) { var mountImages = this.mountChildren( childrenToUse, diff --git a/src/renderers/dom/stack/client/wrappers/ReactDOMTextarea.js b/src/renderers/dom/stack/client/wrappers/ReactDOMTextarea.js index 10696bb698f..3e3ed791293 100644 --- a/src/renderers/dom/stack/client/wrappers/ReactDOMTextarea.js +++ b/src/renderers/dom/stack/client/wrappers/ReactDOMTextarea.js @@ -159,9 +159,15 @@ var ReactDOMTextarea = { // This is in postMount because we need access to the DOM node, which is not // available until after the component has mounted. var node = ReactDOMComponentTree.getNodeFromInstance(inst); - - // Warning: node.value may be the empty string at this point (IE11) if placeholder is set. - node.value = node.textContent; // Detach value from defaultValue + var textContent = node.textContent; + + // Only set node.value if textContent is equal to the expected + // initial value. In IE10/IE11 there is a bug where the placeholder attribute + // will populate textContent as well. + // https://developer.microsoft.com/microsoft-edge/platform/issues/101525/ + if (textContent === inst._wrapperState.initialValue) { + node.value = textContent; + } }, };