Throw when calling transferPropsTo() on a component you don't own
This is dangerous because it means that data is flowing into the component from two components, only one of which is the actual "owner". While we may be able to figure out how to support this someday, let's be strict and prevent it for now.
Pete Hunt committed
Oct 7, 2013 at 14:56 UTC
325322898cc413454feede0201b61da1abe1e67e
2 files changed
+32
-1
src/core/ReactPropTransferer.js
+8
@@ -19,6 +19,7 @@
19
"use strict";
20
21
var emptyFunction = require('emptyFunction');
22
+var invariant = require('invariant');
23
var joinClasses = require('joinClasses');
24
var merge = require('merge');
25
@@ -90,6 +91,13 @@ var ReactPropTransferer = {
91
* @protected
92
*/
93
transferPropsTo: function(component) {
94
+ invariant(
95
+ component.props.__owner__ === this,
96
+ 'You can\'t call transferPropsTo() on a component that you don\'t ' +
97
+ 'own. This usually means you are calling transferPropsTo() on a ' +
98
+ 'component passed in as props or children.'
99
+ );
100
+
101
var props = {};
102
for (var thatKey in component.props) {
103
if (component.props.hasOwnProperty(thatKey)) {
src/core/__tests__/ReactPropTransferer-test.js
renamed
+24
-1
@@ -25,7 +25,7 @@ var reactComponentExpect;
25
26
var TestComponent;
27
28
-describe('ReactCompositeComponent-transferProps', function() {
28
+describe('ReactPropTransferer', function() {
29
30
beforeEach(function() {
31
React = require('React');
@@ -130,4 +130,27 @@ describe('ReactCompositeComponent-transferProps', function() {
130
131
ReactTestUtils.renderIntoDocument(<OuterOuterRefTestComponent />);
132
});
133
+
134
+ it('should not transferPropsTo() a component you don\'t own', function() {
135
+ var Parent = React.createClass({
136
+ render: function() {
137
+ return <Child><span /></Child>;
138
+ }
139
+ });
140
+
141
+ var Child = React.createClass({
142
+ render: function() {
143
+ return this.transferPropsTo(this.props.children);
144
+ }
145
+ });
146
+
147
+ expect(function() {
148
+ ReactTestUtils.renderIntoDocument(<Parent />);
149
+ }).toThrow(
150
+ 'Invariant Violation: ' +
151
+ 'You can\'t call transferPropsTo() on a component that you don\'t own. ' +
152
+ 'This usually means you are calling transferPropsTo() on a component ' +
153
+ 'passed in as props or children.'
154
+ );
155
+ });
156
});