Resolve default prop values in cloneElement

In cloneElement, when key in input config is set to undefined, the associated
prop value should be resolved to default prop values
This commit is contained in:
Nguyen Truong Duy
2016-02-08 11:09:03 +07:00
parent 725a723e27
commit 48ded230fc
2 changed files with 33 additions and 1 deletions
+10 -1
View File
@@ -243,10 +243,19 @@ ReactElement.cloneElement = function(element, config, children) {
key = '' + config.key;
}
// Remaining properties override existing props
var defaultProps;
if (element.type && element.type.defaultProps) {
defaultProps = element.type.defaultProps;
}
for (propName in config) {
if (config.hasOwnProperty(propName) &&
!RESERVED_PROPS.hasOwnProperty(propName)) {
props[propName] = config[propName];
if (config[propName] === undefined && defaultProps !== undefined) {
// Resolve default props
props[propName] = defaultProps[propName];
} else {
props[propName] = config[propName];
}
}
}
}
@@ -273,6 +273,29 @@ describe('ReactElement', function() {
expect(inst2.props.prop).toBe(null);
});
it('should normalize props with default values in cloning', function() {
var Component = React.createClass({
getDefaultProps: function() {
return {prop: 'testKey'};
},
render: function() {
return <span />;
},
});
var instance = React.createElement(Component);
var clonedInstance = React.cloneElement(instance, {prop: undefined});
expect(clonedInstance.props.prop).toBe('testKey');
var clonedInstance2 = React.cloneElement(instance, {prop: null});
expect(clonedInstance2.props.prop).toBe(null);
var instance2 = React.createElement(Component, {prop: 'newTestKey'});
var cloneInstance3 = React.cloneElement(instance2, {prop: undefined});
expect(cloneInstance3.props.prop).toBe('testKey');
var cloneInstance4 = React.cloneElement(instance2, {});
expect(cloneInstance4.props.prop).toBe('newTestKey');
});
it('throws when changing a prop (in dev) after element creation', function() {
var Outer = React.createClass({
render: function() {