mirror of
https://github.com/facebook/react.git
synced 2025-11-01 09:12:30 +00:00
Add \n after <textarea> to fix missing linebreaks
Same for <pre> and <listing>. Browsers are crazy. Test Plan: jest, verify in Chrome that starting textareas with a value starting with two newlines renders both newlines instead of one newline, as it did before.
This commit is contained in:
@@ -244,27 +244,37 @@ ReactDOMComponent.Mixin = {
|
||||
* @return {string} Content markup.
|
||||
*/
|
||||
_createContentMarkup: function(transaction) {
|
||||
var prefix = '';
|
||||
if (this._tag === 'listing' ||
|
||||
this._tag === 'pre' ||
|
||||
this._tag === 'textarea') {
|
||||
// Add an initial newline because browsers ignore the first newline in
|
||||
// a <listing>, <pre>, or <textarea> as an "authoring convenience" -- see
|
||||
// https://html.spec.whatwg.org/multipage/syntax.html#parsing-main-inbody.
|
||||
prefix = '\n';
|
||||
}
|
||||
|
||||
// Intentional use of != to avoid catching zero/false.
|
||||
var innerHTML = this.props.dangerouslySetInnerHTML;
|
||||
if (innerHTML != null) {
|
||||
if (innerHTML.__html != null) {
|
||||
return innerHTML.__html;
|
||||
return prefix + innerHTML.__html;
|
||||
}
|
||||
} else {
|
||||
var contentToUse =
|
||||
CONTENT_TYPES[typeof this.props.children] ? this.props.children : null;
|
||||
var childrenToUse = contentToUse != null ? null : this.props.children;
|
||||
if (contentToUse != null) {
|
||||
return escapeTextForBrowser(contentToUse);
|
||||
return prefix + escapeTextForBrowser(contentToUse);
|
||||
} else if (childrenToUse != null) {
|
||||
var mountImages = this.mountChildren(
|
||||
childrenToUse,
|
||||
transaction
|
||||
);
|
||||
return mountImages.join('');
|
||||
return prefix + mountImages.join('');
|
||||
}
|
||||
}
|
||||
return '';
|
||||
return prefix;
|
||||
},
|
||||
|
||||
receiveComponent: function(nextElement, transaction) {
|
||||
|
||||
@@ -29,8 +29,9 @@ describe('ReactDOMTextarea', function() {
|
||||
renderTextarea = function(component) {
|
||||
var stub = ReactTestUtils.renderIntoDocument(component);
|
||||
var node = stub.getDOMNode();
|
||||
// Polyfilling the browser's quirky behavior.
|
||||
node.value = node.innerHTML;
|
||||
// Fixing jsdom's quirky behavior -- in reality, the parser should strip
|
||||
// off the leading newline but we need to do it by hand here.
|
||||
node.value = node.innerHTML.replace(/^\n/, '');
|
||||
return stub;
|
||||
};
|
||||
});
|
||||
@@ -215,11 +216,10 @@ describe('ReactDOMTextarea', function() {
|
||||
});
|
||||
|
||||
it('should support ReactLink', function() {
|
||||
var container = document.createElement('div');
|
||||
var link = new ReactLink('yolo', mocks.getMockFunction());
|
||||
var instance = <textarea valueLink={link} />;
|
||||
|
||||
instance = React.render(instance, container);
|
||||
instance = renderTextarea(instance);
|
||||
|
||||
expect(instance.getDOMNode().value).toBe('yolo');
|
||||
expect(link.value).toBe('yolo');
|
||||
|
||||
Reference in New Issue
Block a user