Formik: Array instead object with numeric keys in `errors`

Created on 5 Mar 2019  路  7Comments  路  Source: formium/formik

馃悰 Bug report

Reproducible example

I try to validate 'schedule.days' object with numeric keys. It really is an object in 'value' and 'touched' , but it is an array in 'errors'.

https://codesandbox.io/s/x7l2r051kq

Just press "Submit"

Current Behavior

"errors": {
  "schedule": {
    "days": [
      null,
      null,
      {
        "from": "schedule.days.2.from must be greater than or equal to 5",
        "to": "schedule.days.2.to must be less than or equal to 7"
      }
    ]
  }
}

Expected behavior

"errors": {
  "schedule": {
    "days": {
       "2": {
        "from": "schedule.days.2.from must be greater than or equal to 5",
        "to": "schedule.days.2.to must be less than or equal to 7"
      }
    }
  }
}

Your environment

| Software | Version(s) |
| ---------------- | ---------- |
| Formik | 1.5.1
| yup | 0.26.10
| React | 16.8.3
| TypeScript | NA
| Browser | Chrome
| npm/Yarn | 5.3.0
| Operating System | Ubuntu 16.04

stale

Most helpful comment

I confirm, it's a weird behavior, I used the following values

92.312: number | null
92.322: number | null
92.332: number | null
92.342: number | null

And got on submit the following result

92: (343) [undefined, 鈥
92.312: null
92.322: null
92.332: null
92.342: 4

All 7 comments

if you have number as the name of the field 鈥斅爄t will create array.
add letter before number 鈥斅爄t will fix the situation

@SilentImp obvious but wrong decision, imho.

As I understand it, the developers intentionally made errors identical in structure to the values in one of the new versions. Current behavior looks like a bug.

Quote from the documentation:

errors:
Form validation errors. Should match the shape of your form's values defined in initialValues.

@jaredpalmer I want to at least understand the current behavior is normal or is it a bug?

I confirm, it's a weird behavior, I used the following values

92.312: number | null
92.322: number | null
92.332: number | null
92.342: number | null

And got on submit the following result

92: (343) [undefined, 鈥
92.312: null
92.322: null
92.332: null
92.342: 4

Just had the same issue, I think it's because of this line: https://github.com/jaredpalmer/formik/blob/master/src/utils.ts#L42

@jaredpalmer I'm not sure how to solve this but if you have any guidance I'd be happy to help

I'm also looking for a resolution to this problem. I have a lot of data that is formatted using the .normalizr pattern, which uses an object id as keys.

https://github.com/paularmstrong/normalizr/blob/master/docs/api.md

I'm not sure what the solution is as of yet, but a similar problem is exhibited in lodash when using _.set(object, path, value). This problem, however, is remedied by switching to _.setWith(object, path, value, Object). Maybe src/utils could leverage that function instead with an optional entity construction parameter since lodash is already a dependency?

Closing due to long inactivity

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jaredpalmer picture jaredpalmer  路  3Comments

pmonty picture pmonty  路  3Comments

emartini picture emartini  路  3Comments

green-pickle picture green-pickle  路  3Comments

dearcodes picture dearcodes  路  3Comments