form icon indicating copy to clipboard operation
form copied to clipboard

Record fields with numbers as keys does not work as excpected

Open maksymskuibida opened this issue 1 year ago • 0 comments

Describe the bug

I've added Record field, so, type looks like this

interface FormType {
    items: Record<number, {quantity: number}>
}

Types in form work well, Field with name items.${number}.quantity works. So, items in state are {} and when I change quantity for item with 64, it replaces items value with [null, null, null, ..., 64]

I also discovered, that if record keys are strings(contains any non-numeric character), it works fine.

Your minimal, reproducible example

https://codesandbox.io/p/devbox/zen-black-47s6fg?workspaceId=ca4463b1-f681-4a01-8bea-2aa832081a3a

Steps to reproduce

To reproduce a bug with number keys

  1. Run example
  2. Change something in inputs
  3. Press submit
  4. Check console

To verify that it works with string keys

  1. Uncomment next lines: items: Record<string, { quantity?: number }>;, <form.Field key={item} name={\items.item-${item}.quantity`}>`
  2. Comment next lines after uncommented
  3. Change something in inputs
  4. Press submit
  5. Check console

Expected behavior

Even if I use numeric keys, it should work as record, not create array. Probably it could be recognised from array fields by existing of []

How often does this bug happen?

None

Screenshots or Videos

No response

Platform

TanStack Form adapter

react-form

TanStack Form version

v34.0

TypeScript version

No response

Additional context

No response

maksymskuibida avatar Oct 19 '24 22:10 maksymskuibida