Skip to content

refactor(date-field): add RHF component contracts - #413

Draft
IzumiSy wants to merge 7 commits into
mainfrom
test/rhf-component-contracts
Draft

refactor(date-field): add RHF component contracts#413
IzumiSy wants to merge 7 commits into
mainfrom
test/rhf-component-contracts

Conversation

@IzumiSy

@IzumiSy IzumiSy commented Jul 31, 2026

Copy link
Copy Markdown
Contributor

Motivation

The date controls on this branch already move away from Base UI's internal Field/Form wiring and toward a standalone composite-control model.

At the same time, AppShell needs a reliable way to keep form controls compatible with React Hook Form. That compatibility is important enough to treat as an API contract, not just an example or documentation pattern.

Today we have docs and demo usage for RHF, but we do not have component-level tests that exercise real useForm / Controller integration across the control set. That leaves a gap for future form-component work: a refactor can quietly break value, onChange, onBlur, ref, reset behavior, or error rendering without a focused test failing.

This PR closes that gap by adding RHF-backed component tests for the core form controls while also carrying the date-field standalone wiring change.

Design Decision

Date controls stay aligned with Base UI's public composition model

DateField and DatePicker are AppShell-owned composite widgets rather than built-in Base UI field controls. Full automatic Field.Root integration required reaching into Base UI internal context and field-registration APIs.

This branch keeps the simpler standalone contract instead:

  • explicit id / label wiring
  • aria-labelledby
  • aria-describedby
  • isInvalid
  • proxy-input form serialization / native validity

That keeps the date controls on Base UI's supported public surface instead of depending on internal wiring.

RHF compatibility is tested as a control contract

For form-oriented components, RHF interoperability is now treated as a first-class compatibility requirement.

A shared RHF test harness was added so component tests can exercise real useForm / Controller flows with minimal boilerplate. The tests focus on the behavior we want to preserve across refactors:

  • default values render correctly
  • user interaction updates submitted values
  • blur / touched behavior is wired correctly
  • validation errors surface through the intended API
  • reset restores the expected state

Scope of RHF coverage

This PR adds RHF component tests for the controls where integration matters most:

  • Field
  • Form
  • Input
  • Checkbox
  • Select
  • Combobox
  • Autocomplete
  • DateField / DatePicker

The intent is not to test RHF itself, but to lock down the AppShell-side contract those components promise to consumers.

Summary

  • keep DateField / DatePicker as standalone composite controls instead of depending on Base UI internal field wiring
  • add react-hook-form as a test-only dependency for packages/core
  • add a shared RHF component-test harness
  • add RHF-backed integration coverage for the main AppShell form controls

@IzumiSy
IzumiSy force-pushed the test/rhf-component-contracts branch from d271c00 to 412dfc5 Compare July 31, 2026 03:52
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant