warnUnknownProperties() — react Function Reference

Architecture documentation for the warnUnknownProperties() function in ReactDOMUnknownPropertyHook.js from the react codebase.

Function javascript BabelCompiler Validation calls 1 called by 1

Entity Profile

BabelCompiler→ Validation→ warnUnknownProperties() — react Function Reference

Dependency Diagram

graph TD
  bf4f5581_ded9_1593_5867_5715d4ea88fa["warnUnknownProperties()"]
  7bf34687_c093_d285_ad96_da146989d7e6["ReactDOMUnknownPropertyHook.js"]
  bf4f5581_ded9_1593_5867_5715d4ea88fa -->|defined in| 7bf34687_c093_d285_ad96_da146989d7e6
  95ba6694_b646_2a5b_f22a_b99163c63d18["validateProperties()"]
  95ba6694_b646_2a5b_f22a_b99163c63d18 -->|calls| bf4f5581_ded9_1593_5867_5715d4ea88fa
  bb8c41ed_876b_b3f5_04bd_024d69716e5a["validateProperty()"]
  bf4f5581_ded9_1593_5867_5715d4ea88fa -->|calls| bb8c41ed_876b_b3f5_04bd_024d69716e5a
  style bf4f5581_ded9_1593_5867_5715d4ea88fa fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-dom-bindings/src/shared/ReactDOMUnknownPropertyHook.js lines 336–367

function warnUnknownProperties(type, props, eventRegistry) {
  if (__DEV__) {
    const unknownProps = [];
    for (const key in props) {
      const isValid = validateProperty(type, key, props[key], eventRegistry);
      if (!isValid) {
        unknownProps.push(key);
      }
    }

    const unknownPropString = unknownProps
      .map(prop => '`' + prop + '`')
      .join(', ');
    if (unknownProps.length === 1) {
      console.error(
        'Invalid value for prop %s on <%s> tag. Either remove it from the element, ' +
          'or pass a string or number value to keep it in the DOM. ' +
          'For details, see https://react.dev/link/attribute-behavior ',
        unknownPropString,
        type,
      );
    } else if (unknownProps.length > 1) {
      console.error(
        'Invalid values for props %s on <%s> tag. Either remove them from the element, ' +
          'or pass a string or number value to keep them in the DOM. ' +
          'For details, see https://react.dev/link/attribute-behavior ',
        unknownPropString,
        type,
      );
    }
  }
}