From ad31cfa4dc0f59c646281ffdbd09c55681a572f0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Paul=20O=E2=80=99Shannessy?= Date: Thu, 19 Feb 2015 11:25:12 -0800 Subject: [PATCH] Warn when using constructor function directly We no longer support the legacy factory style of calling component constructors directly. We only support createElement or the wrapping of classes with createFactory. Instead of letting this fail in a gross way as we try to run, add a nice warning that shows up before the gross TypeError. --- src/classic/class/ReactClass.js | 8 ++++++++ src/classic/class/__tests__/ReactClass-test.js | 15 +++++++++++++++ 2 files changed, 23 insertions(+) diff --git a/src/classic/class/ReactClass.js b/src/classic/class/ReactClass.js index 39a5b73b2f..67a62c1f0b 100644 --- a/src/classic/class/ReactClass.js +++ b/src/classic/class/ReactClass.js @@ -828,6 +828,14 @@ var ReactClass = { // This constructor is overridden by mocks. The argument is used // by mocks to assert on what gets mounted. + if (__DEV__) { + warning( + this instanceof Constructor, + 'Something is calling a React component directly. Use a factory or ' + + 'JSX instead. See: http://fb.me/react-legacyfactory' + ); + } + // Wire up auto-binding if (this.__reactAutoBindMap) { bindAutoBindMethods(this); diff --git a/src/classic/class/__tests__/ReactClass-test.js b/src/classic/class/__tests__/ReactClass-test.js index eefe02474f..49a0e6b439 100644 --- a/src/classic/class/__tests__/ReactClass-test.js +++ b/src/classic/class/__tests__/ReactClass-test.js @@ -363,4 +363,19 @@ describe('ReactClass-spec', function() { ).not.toThrow(); }); + it('should throw when using legacy factories', function() { + var Component = React.createClass({ + render() { + return
; + } + }); + + expect(() => Component()).toThrow(); + expect(console.warn.calls.length).toBe(1); + expect(console.warn.argsForCall[0][0]).toBe( + 'Warning: Something is calling a React component directly. Use a ' + + 'factory or JSX instead. See: http://fb.me/react-legacyfactory' + ); + }); + });