Skip to content

schema-validated invoice marketplace form with inline errors and live regions #1034

Description

@mikewheeleer

Summary

The invoice marketplace form validates loosely and announces nothing, so errors are easy to miss. Add schema validation with inline, accessible per-field errors and a summary live region.

Why this matters

Silent or inaccessible validation frustrates users and fails a11y. Schema-driven, announced errors are correct and inclusive.

Requirements

  • Validate the invoice marketplace form against a schema; show inline per-field errors.
  • Summarize errors in a live region and move focus to the first invalid field on submit.
  • Errors clear as the user fixes each field.
  • Submit is blocked while invalid, with a clear reason.

Technical guidance

  • Associate each error with its input via aria-describedby.
  • Announce the summary politely, not assertively, unless on submit.

Edge cases — each must have a test

  • invalid field -> inline message + described-by wired
  • submit with errors -> focus first invalid, summary announced
  • fix a field -> its error clears
  • all valid -> submits
  • messages are specific per field

Acceptance criteria

  • All requirements and every edge case above implemented and covered by tests
  • New unit and integration tests; existing tests still pass and no regressions
  • Structured, typed errors (no leaked internals; stable codes)
  • npm run lint, npm test, and npm run build all pass locally
  • Code follows the repo's existing conventions; no duplication or dead code
  • Short docs/comments explaining the design and any non-obvious decisions
  • PR description explains the approach and includes Closes #<issue>

Out of scope

  • Async/server-side validation
  • Multi-step wizard

Rewards

Part of the GrantFox OSS / Official Campaign (FWC26) — this task may be rewarded. PR quality is assessed by AI: depth, correctness under edge cases, meaningful tests, and clean design are what earn the reward. Shallow changes (typos, formatting, trivial docs) do not qualify.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions