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.
Paul O’Shannessy committed
Feb 19, 2015 at 11:25 UTC
ad31cfa4dc0f59c646281ffdbd09c55681a572f0
2 files changed
+23
src/classic/class/ReactClass.js
+8
@@ -828,6 +828,14 @@ var ReactClass = {
828
// This constructor is overridden by mocks. The argument is used
829
// by mocks to assert on what gets mounted.
830
831
+ if (__DEV__) {
832
+ warning(
833
+ this instanceof Constructor,
834
+ 'Something is calling a React component directly. Use a factory or ' +
835
+ 'JSX instead. See: http://fb.me/react-legacyfactory'
836
+ );
837
+ }
838
+
839
// Wire up auto-binding
840
if (this.__reactAutoBindMap) {
841
bindAutoBindMethods(this);
src/classic/class/__tests__/ReactClass-test.js
+15
@@ -363,4 +363,19 @@ describe('ReactClass-spec', function() {
363
).not.toThrow();
364
});
365
366
+ it('should throw when using legacy factories', function() {
367
+ var Component = React.createClass({
368
+ render() {
369
+ return <div />;
370
+ }
371
+ });
372
+
373
+ expect(() => Component()).toThrow();
374
+ expect(console.warn.calls.length).toBe(1);
375
+ expect(console.warn.argsForCall[0][0]).toBe(
376
+ 'Warning: Something is calling a React component directly. Use a ' +
377
+ 'factory or JSX instead. See: http://fb.me/react-legacyfactory'
378
+ );
379
+ });
380
+
381
});