import {ATTRIBUTE_NAME_CHAR} from './DOMProperty';
import isCustomComponent from './isCustomComponent';
import validAriaProperties from './validAriaProperties';
import hasOwnProperty from 'shared/hasOwnProperty';
const warnedProperties = {};
const rARIA = new RegExp('^(aria)-[' + ATTRIBUTE_NAME_CHAR + ']*$');
const rARIACamel = new RegExp('^(aria)[A-Z][' + ATTRIBUTE_NAME_CHAR + ']*$');
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 (correctName == null) {
console.error(
'Invalid ARIA attribute `%s`. ARIA attributes follow the pattern aria-* and must be lowercase.',
name,
);
warnedProperties[name] = true;
return true;
}
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 (standardName == null) {
warnedProperties[name] = true;
return false;
}
if (name !== standardName) {
console.error(
'Unknown ARIA attribute `%s`. Did you mean `%s`?',
name,
standardName,
);
warnedProperties[name] = true;
return true;
}
}
}
return true;
}
function warnInvalidARIAProps(type, props) {
if (__DEV__) {
const invalidProps = [];
for (const key in props) {
const isValid = validateProperty(type, key);
if (!isValid) {
invalidProps.push(key);
}
}
const unknownPropString = invalidProps
.map(prop => '`' + prop + '`')
.join(', ');
if (invalidProps.length === 1) {
console.error(
'Invalid aria prop %s on <%s> tag. ' +
'For details, see https://reactjs.org/link/invalid-aria-props',
unknownPropString,
type,
);
} else if (invalidProps.length > 1) {
console.error(
'Invalid aria props %s on <%s> tag. ' +
'For details, see https://reactjs.org/link/invalid-aria-props',
unknownPropString,
type,
);
}
}
}
export function validateProperties(type, props) {
if (isCustomComponent(type, props)) {
return;
}
warnInvalidARIAProps(type, props);
}