Integration engineering

Make approval and swap status understandable to assistive tools

Announce approval and swap status changes clearly without relying on color, focus jumps or constantly repeating quote updates.

A multi-step swap should remain understandable when a user cannot see a spinner or color change. Expose the current action, its outcome and the next available action in text and accessible status semantics.

WCAG's status-message guidance explains that relevant updates should be programmatically determinable without requiring focus to move to them. Apply that principle to asynchronous quote, approval and settlement messages.

Name the stage precisely

Use distinct messages for waiting for wallet review, approval submitted, approval confirmed, swap submitted and swap confirmed. “Success” after approval can wrongly imply that the token exchange finished.

Include useful context such as the asset or step when multiple actions are present. A transaction link should have a descriptive label rather than only an abbreviated hash with no purpose.

Control announcement frequency

A live quote can change repeatedly. Announcing every tick can overwhelm the user and hide an important approval failure. Reserve status announcements for meaningful state changes, and keep routine price updates available for deliberate inspection.

Use urgent announcements sparingly. An actionable error may deserve immediate attention; an ordinary refreshed estimate usually does not.

Preserve keyboard continuity

When a wallet action returns, keep focus behavior predictable. Do not recreate the entire form or send focus to the top of the page merely because polling updated a label. If a dialog closes, restore a useful place in the workflow.

Explain disabled actions in nearby text. A disabled button alone does not tell the user whether they need balance, approval, a fresh quote or a network change.

Review the workflow with keyboard navigation and assistive technology, including rejection, timeout and partial settlement paths. Accessibility checks should cover the states that occur after submission as well as the initial form; those are often where generic component defaults stop conveying the right meaning.

Sources & verification (1)

Source-check date is recorded in the article details. URLs are provided for manual verification. Use Copy to keep this page open.

  1. Understanding status messages

    Programmatically determinable status without moving focus

    https://www.w3.org/WAI/WCAG22/Understanding/status-messages.html

Continue reading

Swap API integration: quote, approve, simulate, submit