onBlur validation, returns null error object

[lucksp]

We want to use the onBlur validation, since the onChange starts validation too soon on text inputs, while the user is typing.

However, now when I validate, if there's an error in 1 of the arrays, the other array shows up as null:

"errors": {
    "wifi": {
      "networks": [
        null, // this field section item has no errors
        {
          "bearers": "REQUIRED" // this field section item has errors
        }
      ]
    }
  },

And if I add a 3rd item to the networks, and remove it, then the original 2 networks show as null:

"errors": {
    "wifi": {
      "networks": [
        null,
        null
      ]
    }
  },

we are using YUP to validate:

export const ConfigValidationSchema = Yup.object().shape({
  wifi: Yup.object().shape({
    networks: Yup.array().of(
      Yup.object().shape({
        bearers: Yup.array().of(Yup.string()).required('REQUIRED'),
        hidden: Yup.boolean(),
        password: Yup.string().when('vvip', {
          is: true,
          then: Yup.string()
            .required('REQUIRED')
            .min(8, passwordValidationMessage)
            .max(63, passwordValidationMessage)
            .matches(/^[a-zA-z0-9]+$/, passwordValidationMessage),
        }),
        confirmPassword: Yup.string().test(
          'confirmPassword',
          'PASSWORDS DO NOT MATCH',
          function confirmIt(item) {
            return item === this.parent.password;
          }
        ),
        radio: Yup.array().of(Yup.number()).required('REQUIRED'),
        ssid: Yup.string()
          .trim()
          .required('REQUIRED')
          .test('confirmSSIDName', ssidValidationMessage, function confirmIt(item) {
            const notAllowed = ["'", ',', '"', '.', '\\'];
            return item && !notAllowed.some(notAllow => item.includes(notAllow));
          }),
        vvip: Yup.boolean(),
      })
    ),
 
  }),

What could be causing the null values in the errors, instead of just returning empty?

If I click any field in the form the errors go away...

[lucksp]

Updating to include a codesandbox: https://codesandbox.io/s/formik-fieldarray-from-docs-1-0b0uh?file=/src/ConfigForm.js

Steps to replicate:

1. click on ADD SSID button
2. check the 2.4GHz radio on the new item. ==> Expect the "ADD" button to be disabled
3. click REMOVE button on the new item. Expected ==> ADD button is re-enabled. Actual: Disabled and errors are:

"wifi": {
    "networks": [
      null,
      null,

So it seems like the validation state is not updated correctly or finished?