don't validate propTypes in production
Switch to warnings so code execution doesn't differ between prod and dev.
Jamison Dance committed
Jan 26, 2015 at 15:54 UTC
f61ca8d307a7f33ad2772d639572fd0e348ca55e
3 files changed
+69
-40
src/classic/class/ReactClass.js
+24
-16
@@ -327,11 +327,13 @@ var RESERVED_SPEC_KEYS = {
327
}
328
},
329
childContextTypes: function(Constructor, childContextTypes) {
330
- validateTypeDef(
331
- Constructor,
332
- childContextTypes,
333
- ReactPropTypeLocations.childContext
334
- );
330
+ if (__DEV__) {
331
+ validateTypeDef(
332
+ Constructor,
333
+ childContextTypes,
334
+ ReactPropTypeLocations.childContext
335
+ );
336
+ }
337
Constructor.childContextTypes = assign(
338
{},
339
Constructor.childContextTypes,
@@ -339,11 +341,13 @@ var RESERVED_SPEC_KEYS = {
341
);
342
},
343
contextTypes: function(Constructor, contextTypes) {
342
- validateTypeDef(
343
- Constructor,
344
- contextTypes,
345
- ReactPropTypeLocations.context
346
- );
344
+ if (__DEV__) {
345
+ validateTypeDef(
346
+ Constructor,
347
+ contextTypes,
348
+ ReactPropTypeLocations.context
349
+ );
350
+ }
351
Constructor.contextTypes = assign(
352
{},
353
Constructor.contextTypes,
@@ -365,11 +369,13 @@ var RESERVED_SPEC_KEYS = {
369
}
370
},
371
propTypes: function(Constructor, propTypes) {
368
- validateTypeDef(
369
- Constructor,
370
- propTypes,
371
- ReactPropTypeLocations.prop
372
- );
372
+ if (__DEV__) {
373
+ validateTypeDef(
374
+ Constructor,
375
+ propTypes,
376
+ ReactPropTypeLocations.prop
377
+ );
378
+ }
379
Constructor.propTypes = assign(
380
{},
381
Constructor.propTypes,
@@ -384,7 +390,9 @@ var RESERVED_SPEC_KEYS = {
390
function validateTypeDef(Constructor, typeDef, location) {
391
for (var propName in typeDef) {
392
if (typeDef.hasOwnProperty(propName)) {
387
- invariant(
393
+ // use a warning instead of an invariant so components
394
+ // don't show up in prod but not in __DEV__
395
+ warning(
396
typeof typeDef[propName] === 'function',
397
'%s: %s type `%s` is invalid; it must be a function, usually from ' +
398
'React.PropTypes.',
src/classic/class/__tests__/ReactClass-test.js
+36
-17
@@ -74,8 +74,11 @@ describe('ReactClass-spec', function() {
74
.toBe(propValidator);
75
});
76
77
- it('should throw on invalid prop types', function() {
78
- expect(function() {
77
+ it('should warn on invalid prop types', function() {
78
+ var warn = console.warn;
79
+ console.warn = mocks.getMockFunction();
80
+ try {
81
+
82
React.createClass({
83
displayName: 'Component',
84
propTypes: {
@@ -85,14 +88,20 @@ describe('ReactClass-spec', function() {
88
return <span>{this.props.prop}</span>;
89
}
90
});
88
- }).toThrow(
89
- 'Invariant Violation: Component: prop type `prop` is invalid; ' +
90
- 'it must be a function, usually from React.PropTypes.'
91
- );
91
+ expect(console.warn.mock.calls.length).toBe(1);
92
+ expect(console.warn.mock.calls[0][0]).toBe(
93
+ 'Warning: Component: prop type `prop` is invalid; ' +
94
+ 'it must be a function, usually from React.PropTypes.'
95
+ );
96
+ } finally {
97
+ console.warn = warn;
98
+ }
99
});
100
94
- it('should throw on invalid context types', function() {
95
- expect(function() {
101
+ it('should warn on invalid context types', function() {
102
+ var warn = console.warn;
103
+ console.warn = mocks.getMockFunction();
104
+ try {
105
React.createClass({
106
displayName: 'Component',
107
contextTypes: {
@@ -102,14 +111,20 @@ describe('ReactClass-spec', function() {
111
return <span>{this.props.prop}</span>;
112
}
113
});
105
- }).toThrow(
106
- 'Invariant Violation: Component: context type `prop` is invalid; ' +
107
- 'it must be a function, usually from React.PropTypes.'
108
- );
114
+ expect(console.warn.mock.calls.length).toBe(1);
115
+ expect(console.warn.mock.calls[0][0]).toBe(
116
+ 'Warning: Component: context type `prop` is invalid; ' +
117
+ 'it must be a function, usually from React.PropTypes.'
118
+ );
119
+ } finally {
120
+ console.warn = warn;
121
+ }
122
});
123
124
it('should throw on invalid child context types', function() {
112
- expect(function() {
125
+ var warn = console.warn;
126
+ console.warn = mocks.getMockFunction();
127
+ try {
128
React.createClass({
129
displayName: 'Component',
130
childContextTypes: {
@@ -119,10 +134,14 @@ describe('ReactClass-spec', function() {
134
return <span>{this.props.prop}</span>;
135
}
136
});
122
- }).toThrow(
123
- 'Invariant Violation: Component: child context type `prop` is invalid; ' +
124
- 'it must be a function, usually from React.PropTypes.'
125
- );
137
+ expect(console.warn.mock.calls.length).toBe(1);
138
+ expect(console.warn.mock.calls[0][0]).toBe(
139
+ 'Warning: Component: child context type `prop` is invalid; ' +
140
+ 'it must be a function, usually from React.PropTypes.'
141
+ );
142
+ } finally {
143
+ console.warn = warn;
144
+ }
145
});
146
147
it('should warn when mispelling shouldComponentUpdate', function() {
src/classic/element/ReactElementValidator.js
+9
-7
@@ -381,13 +381,15 @@ var ReactElementValidator = {
381
element
382
);
383
var name = componentClass.displayName || componentClass.name;
384
- if (componentClass.propTypes) {
385
- checkPropTypes(
386
- name,
387
- componentClass.propTypes,
388
- element.props,
389
- ReactPropTypeLocations.prop
390
- );
384
+ if (__DEV__) {
385
+ if (componentClass.propTypes) {
386
+ checkPropTypes(
387
+ name,
388
+ componentClass.propTypes,
389
+ element.props,
390
+ ReactPropTypeLocations.prop
391
+ );
392
+ }
393
}
394
if (typeof componentClass.getDefaultProps === 'function') {
395
warning(