validateProperty() — react Function Reference

Architecture documentation for the validateProperty() function in ReactDOMInvalidARIAHook.js from the react codebase.

Function javascript BabelCompiler Validation called by 1

Entity Profile

BabelCompiler→ Validation→ validateProperty() — react Function Reference

Dependency Diagram

graph TD
  c654ba65_be42_8d5d_c60f_cee8e46e996d["validateProperty()"]
  c1dc9c2d_185d_8161_e658_7c3c75929b15["ReactDOMInvalidARIAHook.js"]
  c654ba65_be42_8d5d_c60f_cee8e46e996d -->|defined in| c1dc9c2d_185d_8161_e658_7c3c75929b15
  36218cb9_f10d_54d5_d8e9_e1baaf81dcfc["validateProperties()"]
  36218cb9_f10d_54d5_d8e9_e1baaf81dcfc -->|calls| c654ba65_be42_8d5d_c60f_cee8e46e996d
  style c654ba65_be42_8d5d_c60f_cee8e46e996d fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/react-dom-bindings/src/shared/ReactDOMInvalidARIAHook.js lines 16–76

function validateProperty(tagName, name) {
  if (__DEV__) {
    if (hasOwnProperty.call(warnedProperties, name) && warnedProperties[name]) {
      return true;
    }

    if (rARIACamel.test(name)) {
      const ariaName = 'aria-' + name.slice(4).toLowerCase();
      const correctName = validAriaProperties.hasOwnProperty(ariaName)
        ? ariaName
        : null;

      // If this is an aria-* attribute, but is not listed in the known DOM
      // DOM properties, then it is an invalid aria-* attribute.
      if (correctName == null) {
        console.error(
          'Invalid ARIA attribute `%s`. ARIA attributes follow the pattern aria-* and must be lowercase.',
          name,
        );
        warnedProperties[name] = true;
        return true;
      }
      // aria-* attributes should be lowercase; suggest the lowercase version.
      if (name !== correctName) {
        console.error(
          'Invalid ARIA attribute `%s`. Did you mean `%s`?',
          name,
          correctName,
        );
        warnedProperties[name] = true;
        return true;
      }
    }

    if (rARIA.test(name)) {
      const lowerCasedName = name.toLowerCase();
      const standardName = validAriaProperties.hasOwnProperty(lowerCasedName)
        ? lowerCasedName
        : null;

      // If this is an aria-* attribute, but is not listed in the known DOM
      // DOM properties, then it is an invalid aria-* attribute.
      if (standardName == null) {
        warnedProperties[name] = true;
        return false;
      }
      // aria-* attributes should be lowercase; suggest the lowercase version.
      if (name !== standardName) {
        console.error(
          'Unknown ARIA attribute `%s`. Did you mean `%s`?',
          name,
          standardName,
        );
        warnedProperties[name] = true;
        return true;
      }
    }
  }

  return true;
}