Use compositeType in warning invariant for refs (#7658)

(cherry picked from commit 06ea71d3fd)
This commit is contained in:
Brandon Dail
2016-09-06 03:49:20 -05:00
committed by Paul O’Shannessy
parent 3f8b8d754c
commit 3ef748abb3
2 changed files with 28 additions and 1 deletions
@@ -1097,7 +1097,9 @@ var ReactCompositeComponentMixin = {
if (__DEV__) {
var componentName = component && component.getName ?
component.getName() : 'a component';
warning(publicComponentInstance != null,
warning(
publicComponentInstance != null ||
component._compositeType !== CompositeTypes.StatelessFunctional,
'Stateless function components cannot be given refs ' +
'(See ref "%s" in %s created by %s). ' +
'Attempts to access this ref will fail.',
@@ -206,6 +206,31 @@ describe('ReactTestRenderer', function() {
expect(log).toEqual([null]);
});
it('warns correctly for refs on SFCs', function() {
spyOn(console, 'error');
function Bar() {
return <div>Hello, world</div>
}
class Foo extends React.Component {
render() {
return <Bar ref="foo" />
}
}
class Baz extends React.Component {
render() {
return <div ref="baz" />
}
}
ReactTestRenderer.create(<Baz />);
ReactTestRenderer.create(<Foo />);
expect(console.error.calls.count()).toBe(1);
expect(console.error.calls.argsFor(0)[0]).toContain(
'Stateless function components cannot be given refs ' +
'(See ref "foo" in Bar created by Foo). ' +
'Attempts to access this ref will fail.'
);
});
it('supports error boundaries', function() {
var log = [];
class Angry extends React.Component {