Skip to content

Commit 1fd4543

Browse files
authored
Don't use checkPropTypes for internals (#18488)
We use console.error for internal warnings.
1 parent 2ff27ec commit 1fd4543

File tree

6 files changed

+46
-70
lines changed

6 files changed

+46
-70
lines changed

packages/react-dom/src/__tests__/ReactDOMInput-test.js

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -54,31 +54,31 @@ describe('ReactDOMInput', () => {
5454
expect(() => {
5555
ReactDOM.render(<input type="text" value={0} />, container);
5656
}).toErrorDev(
57-
'Failed prop type: You provided a `value` prop to a form field without an `onChange` handler.',
57+
'Warning: You provided a `value` prop to a form field without an `onChange` handler.',
5858
);
5959
});
6060

6161
it('should warn for controlled value of "" with missing onChange', () => {
6262
expect(() => {
6363
ReactDOM.render(<input type="text" value="" />, container);
6464
}).toErrorDev(
65-
'Failed prop type: You provided a `value` prop to a form field without an `onChange` handler.',
65+
'Warning: You provided a `value` prop to a form field without an `onChange` handler.',
6666
);
6767
});
6868

6969
it('should warn for controlled value of "0" with missing onChange', () => {
7070
expect(() => {
7171
ReactDOM.render(<input type="text" value="0" />, container);
7272
}).toErrorDev(
73-
'Failed prop type: You provided a `value` prop to a form field without an `onChange` handler.',
73+
'Warning: You provided a `value` prop to a form field without an `onChange` handler.',
7474
);
7575
});
7676

7777
it('should warn for controlled value of false with missing onChange', () => {
7878
expect(() =>
7979
ReactDOM.render(<input type="checkbox" checked={false} />, container),
8080
).toErrorDev(
81-
'Failed prop type: You provided a `checked` prop to a form field without an `onChange` handler.',
81+
'Warning: You provided a `checked` prop to a form field without an `onChange` handler.',
8282
);
8383
});
8484

@@ -95,7 +95,7 @@ describe('ReactDOMInput', () => {
9595
container,
9696
),
9797
).toErrorDev(
98-
'Failed prop type: You provided a `checked` prop to a form field without an `onChange` handler. ' +
98+
'Warning: You provided a `checked` prop to a form field without an `onChange` handler. ' +
9999
'This will render a read-only field. If the field should be mutable use `defaultChecked`. ' +
100100
'Otherwise, set either `onChange` or `readOnly`.',
101101
);
@@ -125,7 +125,7 @@ describe('ReactDOMInput', () => {
125125
expect(() => {
126126
node = ReactDOM.render(<input type="text" value="lion" />, container);
127127
}).toErrorDev(
128-
'Failed prop type: You provided a `value` prop to a form field without an `onChange` handler.',
128+
'Warning: You provided a `value` prop to a form field without an `onChange` handler.',
129129
);
130130

131131
setUntrackedValue.call(node, 'giraffe');
@@ -1172,7 +1172,7 @@ describe('ReactDOMInput', () => {
11721172
container,
11731173
),
11741174
).toErrorDev(
1175-
'Warning: Failed prop type: You provided a `value` prop to a form ' +
1175+
'Warning: You provided a `value` prop to a form ' +
11761176
'field without an `onChange` handler. This will render a read-only ' +
11771177
'field. If the field should be mutable use `defaultValue`. ' +
11781178
'Otherwise, set either `onChange` or `readOnly`.\n' +

packages/react-dom/src/client/ReactDOMInput.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import invariant from 'shared/invariant';
1414
import {setValueForProperty} from './DOMPropertyOperations';
1515
import {getFiberCurrentPropsFromNode} from './ReactDOMComponentTree';
1616
import {getToStringValue, toString} from './ToStringValue';
17-
import ReactControlledValuePropTypes from '../shared/ReactControlledValuePropTypes';
17+
import {checkControlledValueProps} from '../shared/ReactControlledValuePropTypes';
1818
import {updateValueIfChanged} from './inputValueTracking';
1919
import {disableInputAttributeSyncing} from 'shared/ReactFeatureFlags';
2020

@@ -73,7 +73,7 @@ export function getHostProps(element: Element, props: Object) {
7373

7474
export function initWrapperState(element: Element, props: Object) {
7575
if (__DEV__) {
76-
ReactControlledValuePropTypes.checkPropTypes('input', props);
76+
checkControlledValueProps('input', props);
7777

7878
if (
7979
props.checked !== undefined &&

packages/react-dom/src/client/ReactDOMSelect.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
// TODO: direct imports like some-package/src/* are bad. Fix me.
1111
import {getCurrentFiberOwnerNameInDevOrNull} from 'react-reconciler/src/ReactCurrentFiber';
1212

13-
import ReactControlledValuePropTypes from '../shared/ReactControlledValuePropTypes';
13+
import {checkControlledValueProps} from '../shared/ReactControlledValuePropTypes';
1414
import {getToStringValue, toString} from './ToStringValue';
1515

1616
let didWarnValueDefaultValue;
@@ -38,7 +38,7 @@ const valuePropNames = ['value', 'defaultValue'];
3838
*/
3939
function checkSelectPropTypes(props) {
4040
if (__DEV__) {
41-
ReactControlledValuePropTypes.checkPropTypes('select', props);
41+
checkControlledValueProps('select', props);
4242

4343
for (let i = 0; i < valuePropNames.length; i++) {
4444
const propName = valuePropNames[i];

packages/react-dom/src/client/ReactDOMTextarea.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99

1010
import invariant from 'shared/invariant';
1111

12-
import ReactControlledValuePropTypes from '../shared/ReactControlledValuePropTypes';
12+
import {checkControlledValueProps} from '../shared/ReactControlledValuePropTypes';
1313
import {getCurrentFiberOwnerNameInDevOrNull} from 'react-reconciler/src/ReactCurrentFiber';
1414
import {getToStringValue, toString} from './ToStringValue';
1515
import type {ToStringValue} from './ToStringValue';
@@ -64,7 +64,7 @@ export function getHostProps(element: Element, props: Object) {
6464
export function initWrapperState(element: Element, props: Object) {
6565
const node = ((element: any): TextAreaWithWrapperState);
6666
if (__DEV__) {
67-
ReactControlledValuePropTypes.checkPropTypes('textarea', props);
67+
checkControlledValueProps('textarea', props);
6868
if (
6969
props.value !== undefined &&
7070
props.defaultValue !== undefined &&

packages/react-dom/src/server/ReactPartialRenderer.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@ import {
6767
getIntrinsicNamespace,
6868
getChildNamespace,
6969
} from '../shared/DOMNamespaces';
70-
import ReactControlledValuePropTypes from '../shared/ReactControlledValuePropTypes';
70+
import {checkControlledValueProps} from '../shared/ReactControlledValuePropTypes';
7171
import assertValidProps from '../shared/assertValidProps';
7272
import dangerousStyleValue from '../shared/dangerousStyleValue';
7373
import hyphenateStyleName from '../shared/hyphenateStyleName';
@@ -1358,7 +1358,7 @@ class ReactDOMServerRenderer {
13581358
let props = element.props;
13591359
if (tag === 'input') {
13601360
if (__DEV__) {
1361-
ReactControlledValuePropTypes.checkPropTypes('input', props);
1361+
checkControlledValueProps('input', props);
13621362

13631363
if (
13641364
props.checked !== undefined &&
@@ -1410,7 +1410,7 @@ class ReactDOMServerRenderer {
14101410
);
14111411
} else if (tag === 'textarea') {
14121412
if (__DEV__) {
1413-
ReactControlledValuePropTypes.checkPropTypes('textarea', props);
1413+
checkControlledValueProps('textarea', props);
14141414
if (
14151415
props.value !== undefined &&
14161416
props.defaultValue !== undefined &&
@@ -1465,7 +1465,7 @@ class ReactDOMServerRenderer {
14651465
});
14661466
} else if (tag === 'select') {
14671467
if (__DEV__) {
1468-
ReactControlledValuePropTypes.checkPropTypes('select', props);
1468+
checkControlledValueProps('select', props);
14691469

14701470
for (let i = 0; i < valuePropNames.length; i++) {
14711471
const propName = valuePropNames[i];

packages/react-dom/src/shared/ReactControlledValuePropTypes.js

Lines changed: 29 additions & 53 deletions
Original file line numberDiff line numberDiff line change
@@ -5,81 +5,57 @@
55
* LICENSE file in the root directory of this source tree.
66
*/
77

8-
import checkPropTypes from 'shared/checkPropTypes';
9-
import ReactSharedInternals from 'shared/ReactSharedInternals';
108
import {enableDeprecatedFlareAPI} from 'shared/ReactFeatureFlags';
119

12-
let ReactDebugCurrentFrame = null;
13-
14-
const ReactControlledValuePropTypes = {
15-
checkPropTypes: null,
10+
const hasReadOnlyValue = {
11+
button: true,
12+
checkbox: true,
13+
image: true,
14+
hidden: true,
15+
radio: true,
16+
reset: true,
17+
submit: true,
1618
};
1719

18-
if (__DEV__) {
19-
ReactDebugCurrentFrame = ReactSharedInternals.ReactDebugCurrentFrame;
20-
21-
const hasReadOnlyValue = {
22-
button: true,
23-
checkbox: true,
24-
image: true,
25-
hidden: true,
26-
radio: true,
27-
reset: true,
28-
submit: true,
29-
};
30-
31-
const propTypes = {
32-
value: function(props, propName, componentName) {
33-
if (
20+
export function checkControlledValueProps(
21+
tagName: string,
22+
props: Object,
23+
): void {
24+
if (__DEV__) {
25+
if (
26+
!(
3427
hasReadOnlyValue[props.type] ||
3528
props.onChange ||
3629
props.onInput ||
3730
props.readOnly ||
3831
props.disabled ||
39-
props[propName] == null ||
32+
props.value == null ||
4033
(enableDeprecatedFlareAPI && props.DEPRECATED_flareListeners)
41-
) {
42-
return null;
43-
}
44-
return new Error(
34+
)
35+
) {
36+
console.error(
4537
'You provided a `value` prop to a form field without an ' +
4638
'`onChange` handler. This will render a read-only field. If ' +
4739
'the field should be mutable use `defaultValue`. Otherwise, ' +
4840
'set either `onChange` or `readOnly`.',
4941
);
50-
},
51-
checked: function(props, propName, componentName) {
52-
if (
42+
}
43+
44+
if (
45+
!(
5346
props.onChange ||
5447
props.readOnly ||
5548
props.disabled ||
56-
props[propName] == null ||
49+
props.checked == null ||
5750
(enableDeprecatedFlareAPI && props.DEPRECATED_flareListeners)
58-
) {
59-
return null;
60-
}
61-
return new Error(
51+
)
52+
) {
53+
console.error(
6254
'You provided a `checked` prop to a form field without an ' +
6355
'`onChange` handler. This will render a read-only field. If ' +
6456
'the field should be mutable use `defaultChecked`. Otherwise, ' +
6557
'set either `onChange` or `readOnly`.',
6658
);
67-
},
68-
};
69-
70-
/**
71-
* Provide a linked `value` attribute for controlled forms. You should not use
72-
* this outside of the ReactDOM controlled form components.
73-
*/
74-
ReactControlledValuePropTypes.checkPropTypes = function(tagName, props) {
75-
checkPropTypes(
76-
propTypes,
77-
props,
78-
'prop',
79-
tagName,
80-
ReactDebugCurrentFrame.getStackAddendum,
81-
);
82-
};
59+
}
60+
}
8361
}
84-
85-
export default ReactControlledValuePropTypes;

0 commit comments

Comments
 (0)