Skip to content

[Frontend] Send Remittance recipient-address error is rendered in a detached div, not associated with the input #1111

Description

@grantfox-oss

Telegram (ask questions / claim the issue here first): https://t.me/+DOylgFv1jyJlNzM0

Why this matters

frontend/src/app/components/remittance/RemittanceForm.tsx l.159-176: the recipient Input only receives a className border (l.167) and is NOT passed the error prop, so the Input never sets aria-invalid or points aria-describedby at the message; the validation text sits in a sibling div (l.171-176) with no id and no role=alert/aria-live. Assistive tech is never told the field is invalid and the error is not announced when it appears. The amount field on the same form correctly uses error={errors.amount} (l.211), confirming the intended pattern was bypassed for the recipient field.

Acceptance criteria

  • Pass the recipient error via the Input error prop (or add aria-invalid, aria-describedby, and role=alert) so the message is programmatically tied to the field and announced

Files to touch

  • frontend/src/app/components/remittance/RemittanceForm.tsx

Metadata

Metadata

Assignees

Labels

Stellar WaveIssues in the Stellar wave programa11yAccessibility improvementsbugSomething isn't workingfrontendIssues related to frontend development

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions