From 7f99711b139c78dd46bc51033929a95bf9543a5b Mon Sep 17 00:00:00 2001 From: Sebastian Markbage Date: Wed, 29 Mar 2023 18:20:38 -0400 Subject: [PATCH] Join type checks into one switch --- .../src/shared/ReactDOMUnknownPropertyHook.js | 121 +++++++++--------- 1 file changed, 60 insertions(+), 61 deletions(-) diff --git a/packages/react-dom-bindings/src/shared/ReactDOMUnknownPropertyHook.js b/packages/react-dom-bindings/src/shared/ReactDOMUnknownPropertyHook.js index bd4312c57dd60..4bf1f8aebed7a 100644 --- a/packages/react-dom-bindings/src/shared/ReactDOMUnknownPropertyHook.js +++ b/packages/react-dom-bindings/src/shared/ReactDOMUnknownPropertyHook.js @@ -181,75 +181,74 @@ function validateProperty(tagName, name, value, eventRegistry) { } } - if (typeof value === 'boolean') { - const prefix = name.toLowerCase().slice(0, 5); - const acceptsBooleans = - propertyInfo !== null - ? propertyInfo.acceptsBooleans - : prefix === 'data-' || prefix === 'aria-'; - if (!acceptsBooleans) { - if (value) { - console.error( - 'Received `%s` for a non-boolean attribute `%s`.\n\n' + - 'If you want to write it to the DOM, pass a string instead: ' + - '%s="%s" or %s={value.toString()}.', - value, - name, - name, - value, - name, - ); - } else { + switch (typeof value) { + case 'boolean': { + const prefix = name.toLowerCase().slice(0, 5); + const acceptsBooleans = + propertyInfo !== null + ? propertyInfo.acceptsBooleans + : prefix === 'data-' || prefix === 'aria-'; + if (!acceptsBooleans) { + if (value) { + console.error( + 'Received `%s` for a non-boolean attribute `%s`.\n\n' + + 'If you want to write it to the DOM, pass a string instead: ' + + '%s="%s" or %s={value.toString()}.', + value, + name, + name, + value, + name, + ); + } else { + console.error( + 'Received `%s` for a non-boolean attribute `%s`.\n\n' + + 'If you want to write it to the DOM, pass a string instead: ' + + '%s="%s" or %s={value.toString()}.\n\n' + + 'If you used to conditionally omit it with %s={condition && value}, ' + + 'pass %s={condition ? value : undefined} instead.', + value, + name, + name, + value, + name, + name, + name, + ); + } + warnedProperties[name] = true; + return true; + } + return true; + } + case 'function': + case 'symbol': // eslint-disable-line + // Warn when a known attribute is a bad type + warnedProperties[name] = true; + return false; + case 'string': + // Warn when passing the strings 'false' or 'true' into a boolean prop + if ( + (value === 'false' || value === 'true') && + propertyInfo !== null && + propertyInfo.type === BOOLEAN + ) { console.error( - 'Received `%s` for a non-boolean attribute `%s`.\n\n' + - 'If you want to write it to the DOM, pass a string instead: ' + - '%s="%s" or %s={value.toString()}.\n\n' + - 'If you used to conditionally omit it with %s={condition && value}, ' + - 'pass %s={condition ? value : undefined} instead.', + 'Received the string `%s` for the boolean attribute `%s`. ' + + '%s ' + + 'Did you mean %s={%s}?', value, name, + value === 'false' + ? 'The browser will interpret it as a truthy value.' + : 'Although this works, it will not work as expected if you pass the string "false".', name, value, - name, - name, - name, ); + warnedProperties[name] = true; + return true; } - } - warnedProperties[name] = true; - return true; - } - - // Warn when a known attribute is a bad type - switch (typeof value) { - case 'function': - case 'symbol': // eslint-disable-line - warnedProperties[name] = true; - return false; - } - - // Warn when passing the strings 'false' or 'true' into a boolean prop - if ( - (value === 'false' || value === 'true') && - propertyInfo !== null && - propertyInfo.type === BOOLEAN - ) { - console.error( - 'Received the string `%s` for the boolean attribute `%s`. ' + - '%s ' + - 'Did you mean %s={%s}?', - value, - name, - value === 'false' - ? 'The browser will interpret it as a truthy value.' - : 'Although this works, it will not work as expected if you pass the string "false".', - name, - value, - ); - warnedProperties[name] = true; - return true; } - return true; } }