react-hook-form / resolvers

đŸ“‹ Validation resolvers: Yup, Zod, Superstruct, Joi, Vest, Class Validator, io-ts, Nope, computed-types, typanion, Ajv, TypeBox, ArkType, Valibot, effect-ts and VineJS
https://react-hook-form.com/
MIT License
1.71k stars 155 forks source link

[Yup] yup resolver overrides ref property in errors object with validation metadata when using checkbox input #630

Open marko-hologram opened 11 months ago

marko-hologram commented 11 months ago

Describe the bug When using yup resolver, ref property in errors object doesn't contain the HTML element, but contains some object with metadata related to that field's validation. When not using yup, ref property contains the actual HTML element.

Basic text input is not affected by this.

To Reproduce Steps to reproduce the behavior:

  1. Go to https://codesandbox.io/p/sandbox/dazzling-butterfly-zs8899?file=/src/App.tsx
  2. Open browser dev tools Console tab
  3. Click on "Submit" below form "Form with Yup"
  4. Observe errors object that is logged and notice how isTosAccepted object ref property contains some metadata and not the actual HTML input element like other fields

Library versions: @hookform/resolvers - v3.0.0 react-hook-form - v7.43.9

Codesandbox link (Required) https://codesandbox.io/p/sandbox/dazzling-butterfly-zs8899?file=/src/App.tsx

Expected behavior When using yup resolver, errors object should contain ref to checkbox input when it's present in a form and validated. Validation without yup resolver contains ref to the checkbox input and I would expect resolver behavior to match the library default one.

Screenshots Errors object without using yup resolver. Notice how ref is actually the HTML input checkbox.

image

Errors object when using yup resolver. Notice how ref doesn't contain the HTML input checkbox.

image

Desktop (please complete the following information):

Smartphone (please complete the following information):

Haven't tested on a smartphone.

Additional context I haven't tested with other resolvers from this library.