Add warning for getDOMNode calls.
cpojer committed
Mar 17, 2015 at 13:35 UTC
fb23276178b28fdcb75aa22be013a91755f7ad0a
4 files changed
+48
-2
src/addons/transitions/ReactCSSTransitionGroupChild.js
+2
-2
@@ -47,7 +47,7 @@ var ReactCSSTransitionGroupChild = React.createClass({
47
displayName: 'ReactCSSTransitionGroupChild',
48
49
transition: function(animationType, finishCallback) {
50
- var node = this.getDOMNode();
50
+ var node = React.findDOMNode(this);
51
var className = this.props.name + '-' + animationType;
52
var activeClassName = className + '-active';
53
var noEventTimeout = null;
@@ -95,7 +95,7 @@ var ReactCSSTransitionGroupChild = React.createClass({
95
flushClassNameQueue: function() {
96
if (this.isMounted()) {
97
this.classNameQueue.forEach(
98
- CSSCore.addClass.bind(CSSCore, this.getDOMNode())
98
+ CSSCore.addClass.bind(CSSCore, React.findDOMNode(this))
99
);
100
}
101
this.classNameQueue.length = 0;
src/browser/ui/ReactBrowserComponentMixin.js
+12
@@ -11,7 +11,12 @@
11
12
'use strict';
13
14
+var ReactInstanceMap = require('ReactInstanceMap');
15
+
16
var findDOMNode = require('findDOMNode');
17
+var warning = require('warning');
18
+
19
+var didWarnKey = '_getDOMNodeDidWarn';
20
21
var ReactBrowserComponentMixin = {
22
/**
@@ -22,6 +27,13 @@ var ReactBrowserComponentMixin = {
27
* @protected
28
*/
29
getDOMNode: function() {
30
+ warning(
31
+ this.constructor[didWarnKey],
32
+ '%s.getDOMNode(...) is deprecated. Please use ' +
33
+ 'React.findDOMNode(instance) instead.',
34
+ ReactInstanceMap.get(this).getName() || this.tagName || 'Unknown'
35
+ );
36
+ this.constructor[didWarnKey] = true;
37
return findDOMNode(this);
38
}
39
};
src/classic/class/__tests__/ReactClass-test.js
+19
@@ -378,4 +378,23 @@ describe('ReactClass-spec', function() {
378
);
379
});
380
381
+ it('warns when calling getDOMNode', function() {
382
+ var MyComponent = React.createClass({
383
+ render: function() {
384
+ return <div />;
385
+ }
386
+ });
387
+
388
+ var container = document.createElement('div');
389
+ var instance = React.render(<MyComponent />, container);
390
+
391
+ instance.getDOMNode();
392
+
393
+ expect(console.warn.calls.length).toBe(1);
394
+ expect(console.warn.calls[0].args[0]).toContain(
395
+ 'MyComponent.getDOMNode(...) is deprecated. Please use ' +
396
+ 'React.findDOMNode(instance) instead.'
397
+ );
398
+ });
399
+
400
});
src/core/__tests__/ReactComponent-test.js
+15
@@ -265,4 +265,19 @@ describe('ReactComponent', function() {
265
expect(callback.mock.calls.length).toBe(3);
266
});
267
268
+ it('warns when calling getDOMNode', function() {
269
+ spyOn(console, 'warn');
270
+
271
+ var container = document.createElement('div');
272
+ var instance = React.render(<div />, container);
273
+
274
+ instance.getDOMNode();
275
+
276
+ expect(console.warn.calls.length).toBe(1);
277
+ expect(console.warn.calls[0].args[0]).toContain(
278
+ 'DIV.getDOMNode(...) is deprecated. Please use ' +
279
+ 'React.findDOMNode(instance) instead.'
280
+ );
281
+ });
282
+
283
});