I would really appreciate another pair of eyes to review why this issue persists.
Basically, a component does some check with validation functions imported from another file
...
const {emailField, phoneFieldUS, postalCodeField} = validators;
class ReturnForm extends React.Component {
...
formHasAnyErrors = () => {
console.log("phoneFieldUS type ", typeof phoneFieldUS)
console.log("postalCodeField type ", typeof postalCodeField)
const zipCodeValid = postalCodeField(form.contactInfo.postalCode);
const emailValid = emailField(form.contactInfo.email);
const mobileValid = phoneFieldUS(form.contactInfo.mobile);
if (!zipCodeValid || !emailValid || !mobileValid) {
return true;
}
return Object.values(errors.contactInfo).find(el => !!el);
};
...
}
And the validators imported looks like this:
exports.default = exports.validators = exports.validatorFactory = exports.statuses = exports.layouts = void 0;
const validatorFactory = (test, pass = () => {}, fail = () => {}) => {
return value => {
const validValue = test(value);
if (validValue === true) {
pass();
} else {
fail();
}
return validValue;
};
};
exports.validatorFactory = validatorFactory;
const validators = {
emailField: validatorFactory(value => {
return /^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/.test(value); // eslint-disable-line max-len
}),
postalCodeField: validatorFactory(value => {
return ((value.length === 5 && /^\d+$/.test(value)) ^ (value.length === 6 && /\d/.test(value) && /[a-zA-Z]/.test(value)))
}),
emptyField: validatorFactory(value => value.length > 0 && !/^\s*$/.test(value)),
phoneFieldUS: validatorFactory(value => /^\(?(\d{3})\)?[-\. ]?(\d{3})[-\. ]?(\d{4})$/.test(value))
};
exports.validators = validators;
What I absolutely don't understand is
console.log("phoneFieldUS type ", typeof phoneFieldUS) // prints function
console.log("postalCodeField type ", typeof postalCodeField) // prints undefined
Hence every time the ReturnForm component is complaining about Uncaught TypeError: postalCodeField is not a function
Like how?????? They're both defined almost the same way?????? Please tell me if I'm missing something, any help appreciated!