Skip to content

Commit

Permalink
Added unit tests for creating an element with a ref in a constructor.…
Browse files Browse the repository at this point in the history
… Only set ReactCurrentOwner.current in dev mode when the component has no constructor. (#10025)

nhunzaker: I've added an additional line to the ref test that sets the
NODE_ENV invironment variable. This allows the test to pass.
  • Loading branch information
iansu authored and sophiebits committed Sep 26, 2017
1 parent 8af9dbf commit 1347b4a
Show file tree
Hide file tree
Showing 2 changed files with 77 additions and 1 deletion.
Expand Up @@ -372,7 +372,7 @@ var ReactCompositeComponent = {
publicContext,
updateQueue,
) {
if (__DEV__) {
if (__DEV__ && !doConstruct) {
ReactCurrentOwner.current = this;
try {
return this._constructComponentWithoutOwner(
Expand Down
76 changes: 76 additions & 0 deletions src/renderers/shared/stack/reconciler/__tests__/refs-test.js
Expand Up @@ -13,6 +13,7 @@

var React = require('React');
var ReactTestUtils = require('ReactTestUtils');
var ReactDOMFeatureFlags = require('ReactDOMFeatureFlags');

var reactComponentExpect = require('reactComponentExpect');

Expand Down Expand Up @@ -283,3 +284,78 @@ describe('ref swapping', () => {
__DEV__ = originalDev;
});
});

describe('creating element with ref in constructor', () => {
class RefTest extends React.Component {
constructor(props) {
super(props);
this.p = <p ref="p">Hello!</p>;
}

render() {
return <div>{this.p}</div>;
}
}

var devErrorMessage =
'addComponentAsRefTo(...): Only a ReactOwner can have refs. You might ' +
"be adding a ref to a component that was not created inside a component's " +
'`render` method, or you have multiple copies of React loaded ' +
'(details: https://fb.me/react-refs-must-have-owner).';

var prodErrorMessage =
'Minified React error #119; visit ' +
'http://facebook.github.io/react/docs/error-decoder.html?invariant=119 for the full message ' +
'or use the non-minified dev environment for full errors and additional helpful warnings.';

var fiberDevErrorMessage =
'Element ref was specified as a string (p) but no owner was ' +
'set. You may have multiple copies of React loaded. ' +
'(details: https://fb.me/react-refs-must-have-owner).';

var fiberProdErrorMessage =
'Minified React error #149; visit ' +
'http://facebook.github.io/react/docs/error-decoder.html?invariant=149&args[]=p ' +
'for the full message or use the non-minified dev environment for full errors and additional ' +
'helpful warnings.';

it('throws an error when __DEV__ = true', () => {
ReactTestUtils = require('ReactTestUtils');

var originalDev = __DEV__;
__DEV__ = true;

try {
expect(function() {
ReactTestUtils.renderIntoDocument(<RefTest />);
}).toThrowError(
ReactDOMFeatureFlags.useFiber ? fiberDevErrorMessage : devErrorMessage,
);
} finally {
__DEV__ = originalDev;
}
});

it('throws an error when __DEV__ = false', () => {
ReactTestUtils = require('ReactTestUtils');

var originalDev = __DEV__;
var originalEnv = process.env.NODE_ENV;

__DEV__ = false;
process.env.NODE_ENV = 'production';

try {
expect(function() {
ReactTestUtils.renderIntoDocument(<RefTest />);
}).toThrowError(
ReactDOMFeatureFlags.useFiber
? fiberProdErrorMessage
: prodErrorMessage,
);
} finally {
__DEV__ = originalDev;
process.env.NODE_ENV = originalEnv;
}
});
});

0 comments on commit 1347b4a

Please sign in to comment.