mountClassInstance() now re-assigns instance.refs to emptyObject
Dominic Gannaway committed
Feb 23, 2017 at 12:58 UTC
25f4abc9d5f63ae640cb07d4a23d664e9b1880ab
2 files changed
+67
-66
src/renderers/__tests__/refs-test.js
+66
-66
@@ -16,81 +16,78 @@ var ReactDOMFeatureFlags = require('ReactDOMFeatureFlags');
16
var ReactTestUtils = require('ReactTestUtils');
17
18
/**
19
- * Render a TestRefsComponent and ensure that the main refs are wired up.
20
- * we also define the classes in this function to ensure that they are
21
- * wired up properly in accordance to how the test suite might resetModules()
22
- * between test runs
19
+ * Counts clicks and has a renders an item for each click. Each item rendered
20
+ * has a ref of the form "clickLogN".
21
*/
24
-function renderTestRefsComponent() {
25
- /**
26
- * Only purpose is to test that refs are tracked even when applied to a
27
- * component that is injected down several layers. Ref systems are difficult to
28
- * build in such a way that ownership is maintained in an airtight manner.
29
- */
30
- class GeneralContainerComponent extends React.Component {
31
- render() {
32
- return <div>{this.props.children}</div>;
33
- }
34
- }
35
-
36
- /**
37
- * Counts clicks and has a renders an item for each click. Each item rendered
38
- * has a ref of the form "clickLogN".
39
- */
40
- class ClickCounter extends React.Component {
41
- state = {count: this.props.initialCount};
42
-
43
- triggerReset = () => {
44
- this.setState({count: this.props.initialCount});
45
- };
46
-
47
- handleClick = () => {
48
- this.setState({count: this.state.count + 1});
49
- };
50
-
51
- render() {
52
- var children = [];
53
- var i;
54
- for (i = 0; i < this.state.count; i++) {
55
- children.push(
56
- <div
57
- className="clickLogDiv"
58
- key={'clickLog' + i}
59
- ref={'clickLog' + i}
60
- />
61
- );
62
- }
63
- return (
64
- <span className="clickIncrementer" onClick={this.handleClick}>
65
- {children}
66
- </span>
22
+class ClickCounter extends React.Component {
23
+ state = {count: this.props.initialCount};
24
+
25
+ triggerReset = () => {
26
+ this.setState({count: this.props.initialCount});
27
+ };
28
+
29
+ handleClick = () => {
30
+ this.setState({count: this.state.count + 1});
31
+ };
32
+
33
+ render() {
34
+ var children = [];
35
+ var i;
36
+ for (i = 0; i < this.state.count; i++) {
37
+ children.push(
38
+ <div
39
+ className="clickLogDiv"
40
+ key={'clickLog' + i}
41
+ ref={'clickLog' + i}
42
+ />
43
);
44
}
45
+ return (
46
+ <span className="clickIncrementer" onClick={this.handleClick}>
47
+ {children}
48
+ </span>
49
+ );
50
}
51
+}
52
71
- /**
72
- * Notice how refs ownership is maintained even when injecting a component
73
- * into a different parent.
74
- */
75
- class TestRefsComponent extends React.Component {
76
- doReset = () => {
77
- this.refs.myCounter.triggerReset();
78
- };
53
+/**
54
+ * Only purpose is to test that refs are tracked even when applied to a
55
+ * component that is injected down several layers. Ref systems are difficult to
56
+ * build in such a way that ownership is maintained in an airtight manner.
57
+ */
58
+class GeneralContainerComponent extends React.Component {
59
+ render() {
60
+ return <div>{this.props.children}</div>;
61
+ }
62
+}
63
80
- render() {
81
- return (
82
- <div>
83
- <div ref="resetDiv" onClick={this.doReset}>
84
- Reset Me By Clicking This.
85
- </div>
86
- <GeneralContainerComponent ref="myContainer">
87
- <ClickCounter ref="myCounter" initialCount={1}/>
88
- </GeneralContainerComponent>
64
+/**
65
+ * Notice how refs ownership is maintained even when injecting a component
66
+ * into a different parent.
67
+ */
68
+class TestRefsComponent extends React.Component {
69
+ doReset = () => {
70
+ this.refs.myCounter.triggerReset();
71
+ };
72
+
73
+ render() {
74
+ return (
75
+ <div>
76
+ <div ref="resetDiv" onClick={this.doReset}>
77
+ Reset Me By Clicking This.
78
</div>
90
- );
91
- }
79
+ <GeneralContainerComponent ref="myContainer">
80
+ <ClickCounter ref="myCounter" initialCount={1}/>
81
+ </GeneralContainerComponent>
82
+ </div>
83
+ );
84
}
85
+}
86
87
+/**
88
+ * Render a TestRefsComponent and ensure that the main refs are wired up.
89
+ */
90
+var renderTestRefsComponent = function() {
91
var testRefsComponent =
92
ReactTestUtils.renderIntoDocument(<TestRefsComponent />);
93
expect(testRefsComponent instanceof TestRefsComponent).toBe(true);
@@ -149,8 +146,11 @@ describe('reactiverefs', () => {
146
expectClickLogsLengthToBe(testRefsComponent, 1);
147
148
});
149
+
150
});
151
152
+
153
+
154
/**
155
* Tests that when a ref hops around children, we can track that correctly.
156
*/
src/renderers/shared/fiber/ReactFiberClassComponent.js
+1
@@ -291,6 +291,7 @@ module.exports = function(
291
292
instance.props = props;
293
instance.state = state;
294
+ instance.refs = emptyObject;
295
instance.context = getMaskedContext(workInProgress, unmaskedContext);
296
297
if (typeof instance.componentWillMount === 'function') {