Make custom PropTypes return error rather than whatever
The new rule for PropTypes is that it should return an error object if validation fails, not throw, not warn.
Cheng Lou committed
Apr 18, 2014 at 12:47 UTC
0a5c22264b2e628e533657c576c90a18282813b8
2 files changed
+33
-35
src/browser/ui/dom/components/LinkedValueUtils.js
+21
-22
@@ -22,7 +22,6 @@
22
var ReactPropTypes = require('ReactPropTypes');
23
24
var invariant = require('invariant');
25
-var warning = require('warning');
25
26
var hasReadOnlyValue = {
27
'button': true,
@@ -36,9 +35,9 @@ var hasReadOnlyValue = {
35
36
function _assertSingleLink(input) {
37
invariant(
39
- input.props.checkedLink == null || input.props.valueLink == null,
40
- 'Cannot provide a checkedLink and a valueLink. If you want to use ' +
41
- 'checkedLink, you probably don\'t want to use valueLink and vice versa.'
38
+ input.props.checkedLink == null || input.props.valueLink == null,
39
+ 'Cannot provide a checkedLink and a valueLink. If you want to use ' +
40
+ 'checkedLink, you probably don\'t want to use valueLink and vice versa.'
41
);
42
}
43
function _assertValueLink(input) {
@@ -84,33 +83,33 @@ var LinkedValueUtils = {
83
Mixin: {
84
propTypes: {
85
value: function(props, propName, componentName) {
87
- if (__DEV__) {
88
- warning(
89
- !props[propName] ||
86
+ if (!props[propName] ||
87
hasReadOnlyValue[props.type] ||
88
props.onChange ||
89
props.readOnly ||
93
- props.disabled,
94
- 'You provided a `value` prop to a form field without an ' +
95
- '`onChange` handler. This will render a read-only field. If ' +
96
- 'the field should be mutable use `defaultValue`. Otherwise, ' +
97
- 'set either `onChange` or `readOnly`.'
98
- );
90
+ props.disabled) {
91
+ return;
92
}
93
+ return new Error(
94
+ 'You provided a `value` prop to a form field without an ' +
95
+ '`onChange` handler. This will render a read-only field. If ' +
96
+ 'the field should be mutable use `defaultValue`. Otherwise, ' +
97
+ 'set either `onChange` or `readOnly`.'
98
+ );
99
},
100
checked: function(props, propName, componentName) {
102
- if (__DEV__) {
103
- warning(
104
- !props[propName] ||
101
+ if (!props[propName] ||
102
props.onChange ||
103
props.readOnly ||
107
- props.disabled,
108
- 'You provided a `checked` prop to a form field without an ' +
109
- '`onChange` handler. This will render a read-only field. If ' +
110
- 'the field should be mutable use `defaultChecked`. Otherwise, ' +
111
- 'set either `onChange` or `readOnly`.'
112
- );
104
+ props.disabled) {
105
+ return;
106
}
107
+ return new Error(
108
+ 'You provided a `checked` prop to a form field without an ' +
109
+ '`onChange` handler. This will render a read-only field. If ' +
110
+ 'the field should be mutable use `defaultChecked`. Otherwise, ' +
111
+ 'set either `onChange` or `readOnly`.'
112
+ );
113
},
114
onChange: ReactPropTypes.func
115
}
src/browser/ui/dom/components/ReactDOMSelect.js
+12
-13
@@ -24,7 +24,6 @@ var ReactBrowserComponentMixin = require('ReactBrowserComponentMixin');
24
var ReactCompositeComponent = require('ReactCompositeComponent');
25
var ReactDOM = require('ReactDOM');
26
27
-var invariant = require('invariant');
27
var merge = require('merge');
28
29
// Store a reference to the <select> `ReactDOMComponent`.
@@ -39,19 +38,19 @@ function selectValueType(props, propName, componentName) {
38
return;
39
}
40
if (props.multiple) {
42
- invariant(
43
- Array.isArray(props[propName]),
44
- 'The `%s` prop supplied to <select> must be an array if `multiple` is ' +
45
- 'true.',
46
- propName
47
- );
41
+ if (!Array.isArray(props[propName])) {
42
+ return new Error(
43
+ `The \`${propName}\` prop supplied to <select> must be an array if ` +
44
+ `\`multiple\` is true.`
45
+ );
46
+ }
47
} else {
49
- invariant(
50
- !Array.isArray(props[propName]),
51
- 'The `%s` prop supplied to <select> must be a scalar value if ' +
52
- '`multiple` is false.',
53
- propName
54
- );
48
+ if (Array.isArray(props[propName])) {
49
+ return new Error(
50
+ `The \`${propName}\` prop supplied to <select> must be a scalar ` +
51
+ `value if \`multiple\` is false.`
52
+ );
53
+ }
54
}
55
}
56