Error during YUP validation “Cannot read property 'length' of undefined”

Question

I got the following code block:

 const schema = useMemo(
    () =>
      yup.object().shape({
        name: yup
          .string()
          .trim()
          .required("Missing name")
          .max(40, "Too long"),
        template: yup
          .string()
          .trim()
          .max(2000, "Too long")
          .matches(/^https?:\/\//, "Invalid protocol")
          .required("Missing template")
          .test("variablesUsage", "Missing vars", function (
            value
          ) {
            return vars.some(v => value.includes(`{${v}}`))
          }),
        enabled: yup.boolean(),
      }),
    [message, vars]
  )

The problem is that everytime i type something in "name" field, I get the following error in console: "Uncaught (in promise) TypeError: Cannot read property 'length' of undefined"

It works fine if I remove the.test from "template", however I could not find the root cause of this error.

Basically, in.test, there are some specific keywords, at least 1 of these keywords must be present in "template"

Answer 1

It seems like the error was caused by this line

return vars.some(v => value.includes(`{${v}}`))

I have added the following line:

if (value == null) {return false;}

And it is working.