Use compositeType in warning invariant for refs (#7658)
Brandon Dail committed
Sep 6, 2016 at 03:49 UTC
06ea71d3fdd614e12c659c2f08f371c6b01fe880
2 files changed
+28
-1
src/renderers/shared/stack/reconciler/ReactCompositeComponent.js
+3
-1
@@ -1107,7 +1107,9 @@ var ReactCompositeComponent = {
1107
if (__DEV__) {
1108
var componentName = component && component.getName ?
1109
component.getName() : 'a component';
1110
- warning(publicComponentInstance != null,
1110
+ warning(
1111
+ publicComponentInstance != null ||
1112
+ component._compositeType !== CompositeTypes.StatelessFunctional,
1113
'Stateless function components cannot be given refs ' +
1114
'(See ref "%s" in %s created by %s). ' +
1115
'Attempts to access this ref will fail.',
src/renderers/testing/__tests__/ReactTestRenderer-test.js
+25
@@ -206,6 +206,31 @@ describe('ReactTestRenderer', function() {
206
expect(log).toEqual([null]);
207
});
208
209
+ it('warns correctly for refs on SFCs', function() {
210
+ spyOn(console, 'error');
211
+ function Bar() {
212
+ return <div>Hello, world</div>
213
+ }
214
+ class Foo extends React.Component {
215
+ render() {
216
+ return <Bar ref="foo" />
217
+ }
218
+ }
219
+ class Baz extends React.Component {
220
+ render() {
221
+ return <div ref="baz" />
222
+ }
223
+ }
224
+ ReactTestRenderer.create(<Baz />);
225
+ ReactTestRenderer.create(<Foo />);
226
+ expect(console.error.calls.count()).toBe(1);
227
+ expect(console.error.calls.argsFor(0)[0]).toContain(
228
+ 'Stateless function components cannot be given refs ' +
229
+ '(See ref "foo" in Bar created by Foo). ' +
230
+ 'Attempts to access this ref will fail.'
231
+ );
232
+ });
233
+
234
it('supports error boundaries', function() {
235
var log = [];
236
class Angry extends React.Component {