maxjhandsome
/
react
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add more information to 'Input elements must be either controlled or uncontrolled' warning

This commit is contained in:
Boris Yankov 2016-03-25 16:36:48 +02:00
parent dcd092560d
commit 1018e50a1a
2 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/renderers/dom/client/wrappers/ReactDOMInput.js
View File

@ -92,6 +92,8 @@ var ReactDOMInput = {
inst._currentElement._owner
);
var owner = inst._currentElement._owner;
if (props.valueLink !== undefined && !didWarnValueLink) {
warning(
false,
@ -113,11 +115,14 @@ var ReactDOMInput = {
) {
warning(
false,
'%s contains an input of type %s with both checked and defaultChecked props. ' +
'Input elements must be either controlled or uncontrolled ' +
'(specify either the checked prop, or the defaultChecked prop, but not ' +
'both). Decide between using a controlled or uncontrolled input ' +
'element and remove one of these props. More info: ' +
'https://fb.me/react-controlled-components'
'https://fb.me/react-controlled-components',
owner && owner.getName() || 'A component',
props.type
);
didWarnCheckedDefaultChecked = true;
}
@ -128,11 +133,14 @@ var ReactDOMInput = {
) {
warning(
false,
'%s contains an input of type %s with both value and defaultValue props. ' +
'Input elements must be either controlled or uncontrolled ' +
'(specify either the value prop, or the defaultValue prop, but not ' +
'both). Decide between using a controlled or uncontrolled input ' +
'element and remove one of these props. More info: ' +
'https://fb.me/react-controlled-components'
'https://fb.me/react-controlled-components',
owner && owner.getName() || 'A component',
props.type
);
didWarnValueDefaultValue = true;
}

2
src/renderers/dom/client/wrappers/__tests__/ReactDOMInput-test.js
View File

@ -422,6 +422,7 @@ describe('ReactDOMInput', function() {
<input type="radio" checked={true} defaultChecked={true} readOnly={true} />
);
expect(console.error.argsForCall[0][0]).toContain(
'A component contains an input of type radio with both checked and defaultChecked props. ' +
'Input elements must be either controlled or uncontrolled ' +
'(specify either the checked prop, or the defaultChecked prop, but not ' +
'both). Decide between using a controlled or uncontrolled input ' +
@ -440,6 +441,7 @@ describe('ReactDOMInput', function() {
<input type="text" value="foo" defaultValue="bar" readOnly={true} />
);
expect(console.error.argsForCall[0][0]).toContain(
'A component contains an input of type text with both value and defaultValue props. ' +
'Input elements must be either controlled or uncontrolled ' +
'(specify either the value prop, or the defaultValue prop, but not ' +
'both). Decide between using a controlled or uncontrolled input ' +