DatePicker not validating correctly when string provided as input

coleweinman commented 1 month ago

Duplicates

[X] I have searched the existing issues

Latest version

[X] I have tested the latest version

Current behavior 😯

Currently when a DatePickerElement takes an initial value of a string, the form will error when trying to submit.

Uncaught (in promise) TypeError: value.isValid is not a function
    at AdapterDayjs.isValid (@mui_x-date-pickers_AdapterDayjs.js?v=62e7efff:560:20)
    at m (chunk-QZE5PPPI.js?v=62e7efff:65:34)
    at Object.internal (react-hook-form-mui_date-pickers.js?v=62e7efff:19264:333)
    at validateField (chunk-QZE5PPPI.js?v=62e7efff:675:67)
    at executeBuiltInValidation (chunk-QZE5PPPI.js?v=62e7efff:1343:36)

Expected behavior 🤔

If the DatePickerElement is provided a string value, the date picker should correctly validate and display the date.

Steps to reproduce 🕹

Steps:

https://stackblitz.com/edit/github-hxddty-k8d1km?file=src%2FApp.tsx

Try to submit the form. Look at console error.

Note: I also tried modifying the input and output function (currently commented out) however this didn't fix the issue.

sadik-malik commented 1 month ago

Thanks for pointing this out, @coleweinman. This will be fixed in the next package release.

coleweinman commented 1 month ago

@sadik-malik I'm still getting this error on the latest update. Looks like the fix checks if the value is null but in this case the value is a string. It needs to be transformed using the transform.input function to validate correct?

sadik-malik commented 1 month ago

@coleweinman, string values were being passed to the validation function because they were not falsy. I have raised a PR to convert string values to Date objects before passing them to the validation function.

For now, please use a day.js Date object instead of a string.

dohomi / react-hook-form-mui