Add runtime deprecation warning for cloneWithProps
Toru Kobayashi committed
Jul 9, 2015 at 01:34 UTC
17a4dc83e0d5b507975df1bb9d2dd882330418ec
3 files changed
+31
-5
src/addons/transitions/ReactTransitionGroup.js
+1
-2
@@ -15,7 +15,6 @@ var React = require('React');
15
var ReactTransitionChildMapping = require('ReactTransitionChildMapping');
16
17
var assign = require('Object.assign');
18
-var cloneWithProps = require('cloneWithProps');
18
var emptyFunction = require('emptyFunction');
19
20
var ReactTransitionGroup = React.createClass({
@@ -213,7 +212,7 @@ var ReactTransitionGroup = React.createClass({
212
// already been removed. In case you need this behavior you can provide
213
// a childFactory function to wrap every child, even the ones that are
214
// leaving.
216
- childrenToRender.push(cloneWithProps(
215
+ childrenToRender.push(React.cloneElement(
216
this.props.childFactory(child),
217
{ref: key, key: key}
218
));
src/isomorphic/deprecated/__tests__/cloneWithProps-test.js
+21
-3
@@ -30,6 +30,26 @@ describe('cloneWithProps', function() {
30
onlyChild = require('onlyChild');
31
cloneWithProps = require('cloneWithProps');
32
emptyObject = require('emptyObject');
33
+ spyOn(console, 'error');
34
+ });
35
+
36
+ it('should warn once because it is deprecated', function() {
37
+ var Parent = React.createClass({
38
+ render: function() {
39
+ return (
40
+ <div>
41
+ {cloneWithProps(onlyChild(this.props.children), {})}
42
+ </div>
43
+ );
44
+ },
45
+ });
46
+ ReactTestUtils.renderIntoDocument(<Parent><div /></Parent>);
47
+ ReactTestUtils.renderIntoDocument(<Parent><div /></Parent>);
48
+ expect(console.error.argsForCall.length).toBe(1);
49
+ expect(console.error.argsForCall[0][0]).toContain(
50
+ 'cloneWithProps(...) is deprecated. ' +
51
+ 'Please use React.cloneElement instead.'
52
+ );
53
});
54
55
it('should clone a DOM component with new props', function() {
@@ -80,8 +100,6 @@ describe('cloneWithProps', function() {
100
});
101
102
it('should warn when cloning with refs', function() {
83
- spyOn(console, 'error');
84
-
103
var Grandparent = React.createClass({
104
render: function() {
105
return <Parent><div ref="yolo" /></Parent>;
@@ -99,7 +117,7 @@ describe('cloneWithProps', function() {
117
118
var component = ReactTestUtils.renderIntoDocument(<Grandparent />);
119
expect(component.refs).toBe(emptyObject);
102
- expect(console.error.argsForCall.length).toBe(1);
120
+ expect(console.error.argsForCall.length).toBe(2);
121
});
122
123
it('should transfer the key property', function() {
src/isomorphic/deprecated/cloneWithProps.js
+9
@@ -20,6 +20,8 @@ var warning = require('warning');
20
21
var CHILDREN_PROP = keyOf({children: null});
22
23
+var didDeprecatedWarn = false;
24
+
25
/**
26
* Sometimes you want to change the props of a child passed to you. Usually
27
* this is to add a CSS class.
@@ -28,9 +30,16 @@ var CHILDREN_PROP = keyOf({children: null});
30
* @param {object} props props you'd like to modify. className and style will be
31
* merged automatically.
32
* @return {ReactElement} a clone of child with props merged in.
33
+ * @deprecated
34
*/
35
function cloneWithProps(child, props) {
36
if (__DEV__) {
37
+ warning(
38
+ didDeprecatedWarn,
39
+ 'cloneWithProps(...) is deprecated. ' +
40
+ 'Please use React.cloneElement instead.'
41
+ );
42
+ didDeprecatedWarn = true;
43
warning(
44
!child.ref,
45
'You are calling cloneWithProps() on a child with a ref. This is ' +