diff --git a/docs/warnings/unknown-prop.md b/docs/warnings/unknown-prop.md index eb7585f650d14..86883cafcdca8 100644 --- a/docs/warnings/unknown-prop.md +++ b/docs/warnings/unknown-prop.md @@ -3,7 +3,7 @@ title: Unknown Prop Warning layout: single permalink: warnings/unknown-prop.html --- -The unknown-prop warning will fire if you attempt to render a DOM element with a prop that is not recognized by React as a legal DOM attribute/property. You should ensure that your DOM elements do not have spurious props floating around. +The unknown-prop warning will fire if you attempt to render a DOM element with a prop that is either unrecognized by React as a legal DOM attribute/property, or is not a string, number, or boolean value. You should ensure that your DOM elements do not have spurious props floating around. There are a couple of likely reasons this warning could be appearing: diff --git a/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js b/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js index 688934980e51d..806b4f084d772 100644 --- a/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js +++ b/src/renderers/dom/shared/__tests__/ReactDOMComponent-test.js @@ -148,8 +148,10 @@ describe('ReactDOMComponent', () => { ReactDOM.render(
{}} />, container); expectDev(console.error.calls.count(0)).toBe(1); expectDev(normalizeCodeLocInfo(console.error.calls.argsFor(0)[0])).toBe( - 'Warning: Unknown prop `foo` on
tag. Remove this prop from the element. ' + - 'For details, see https://fb.me/react-unknown-prop\n in div (at **)', + 'Warning: Unknown prop `foo` on
tag. Either remove this prop ' + + 'from the element, or pass a string, number, or boolean value to keep ' + + 'it in the DOM. For details, see https://fb.me/react-unknown-prop' + + '\n in div (at **)', ); }); @@ -159,8 +161,10 @@ describe('ReactDOMComponent', () => { ReactDOM.render(
{}} baz={{}} />, container); expectDev(console.error.calls.count(0)).toBe(1); expectDev(normalizeCodeLocInfo(console.error.calls.argsFor(0)[0])).toBe( - 'Warning: Unknown props `foo`, `baz` on
tag. Remove these props from the element. ' + - 'For details, see https://fb.me/react-unknown-prop\n in div (at **)', + 'Warning: Unknown props `foo`, `baz` on
tag. Either remove these ' + + 'props from the element, or pass a string, number, or boolean value to keep ' + + 'them in the DOM. For details, see https://fb.me/react-unknown-prop' + + '\n in div (at **)', ); }); diff --git a/src/renderers/dom/shared/hooks/ReactDOMUnknownPropertyHook.js b/src/renderers/dom/shared/hooks/ReactDOMUnknownPropertyHook.js index aa579f7338c5a..c2030ec73ed28 100644 --- a/src/renderers/dom/shared/hooks/ReactDOMUnknownPropertyHook.js +++ b/src/renderers/dom/shared/hooks/ReactDOMUnknownPropertyHook.js @@ -117,7 +117,8 @@ var warnUnknownProperties = function(type, props, debugID) { if (unknownProps.length === 1) { warning( false, - 'Unknown prop %s on <%s> tag. Remove this prop from the element. ' + + 'Unknown prop %s on <%s> tag. Either remove this prop from the element, ' + + 'or pass a string, number, or boolean value to keep it in the DOM. ' + 'For details, see https://fb.me/react-unknown-prop%s', unknownPropString, type, @@ -126,7 +127,8 @@ var warnUnknownProperties = function(type, props, debugID) { } else if (unknownProps.length > 1) { warning( false, - 'Unknown props %s on <%s> tag. Remove these props from the element. ' + + 'Unknown props %s on <%s> tag. Either remove these props from the element, ' + + 'or pass a string, number, or boolean value to keep them in the DOM. ' + 'For details, see https://fb.me/react-unknown-prop%s', unknownPropString, type,