fix(components): Fix form not always focusing first error

MichaelParadis commented 3 months ago

Motivations

This PR allowed for nested Input names. However the focus on error functionality wasn't updated there so when there were nested Form Input names it wouldn't focus on the first input with an error due to it determining the input's name incorrectly. This PR works to address that by leveraging react-hook-forms' focusOnError behaviour.

Changes

Added

Changed

Deprecated

Removed

Fixed

Fixed issues where forms wouldn't focus the first form input with an error

Security

Testing

See the mentioned PR for ways of testing in another project. To test in storybook run git revert 44fe660757574769c6cb9e6d77a964ebfd5d206a Navigate to the Form Error Focus Test and verify the correct inputs are focused when the form is submitted and there is a validation error. The link locally is http://localhost:6005/?path=/story/components-forms-and-inputs-form-web--error-focus-test

Changes can be tested via Pre-release

In Atlantis we use Github's built in pull request reviews.

github-actions[bot] commented 3 months ago

Published Pre-release for 44fe660757574769c6cb9e6d77a964ebfd5d206a with versions:

  - @jobber/components@5.20.7-JOB-98794.9+44fe6607

To install the new version(s) for Web run:

npm install @jobber/components@5.20.7-JOB-98794.9+44fe6607

cloudflare-workers-and-pages[bot] commented 3 months ago

Deploying atlantis with Cloudflare Pages

Latest commit:	`f85fc8d`
Status:	✅ Deploy successful!
Preview URL:	https://02f17d34.atlantis.pages.dev
Branch Preview URL:	https://job-98794-fix-form-not-alway.atlantis.pages.dev

View logs

MichaelParadis commented 3 months ago

@jdeichert I updated the Form tests in 0e4a246. I also renamed all instances of test("...") to it(... to match our other files in 28a850b

I added a comment and some tests for mergeRefs in 705f98a

GetJobber / atlantis