argoproj / argoproj/argo-workflows
Make shared UI description tooltip triggers keyboard accessible
- Dominant language
- Go
- Stars
- 17k
- Forks
- 3.7k
- Avg merge
- 1d 20h
- Merged PRs (30d)
- 138
Description
## Summary
Description tooltips across the Argo Workflows UI commonly use an icon-only `` as the `Tooltip` trigger. These triggers are neither keyboard-focusable nor given an accessible name, so keyboard and assistive-technology users cannot reliably discover the explanatory content.
This work was intentionally kept out of the artifact-description feature PR so the pattern can be updated consistently across the application.
## Required changes
Define and apply one accessible trigger pattern for shared description tooltips. The trigger must be keyboard-focusable and have an appropriate accessible name, while preserving the existing tooltip content and question-circle presentation.
Likely affected areas include:
- `ui/src/workflows/components/submit-workflow-panel.tsx`
- `ui/src/workflows/components/retry-workflow-node-panel.tsx`
- `ui/src/shared/components/parameters-input.tsx`
- `ui/src/workflows/components/workflow-details/suspend-inputs.tsx`
- `ui/src/workflows/components/workflows-summary-container/workflows-summary-container.tsx`
- Other usages of the shared `Tooltip` component with icon-only triggers
## Rationale
Updating only the artifact-description tooltip would leave equivalent description tooltips inconsistent elsewhere in the UI. A shared approach ensures that keyboard focus and accessible naming are applied uniformly.
## Acceptance criteria
- Icon-only description tooltip triggers are reachable with keyboard navigation.
- Each trigger exposes a meaningful accessible name or label.
- The shared `Tooltip` opens when its trigger receives focus.
- Existing tooltip descriptions and visual presentation remain intact.
- Tests cover the chosen accessible trigger behavior and representative usages.
## Backlinks
- Feature PR: https://github.com/argoproj/argo-workflows/pull/16570
- Review discussion: https://github.com/argoproj/argo-workflows/pull/16570#discussion_r3682354055
Requested by: @panicboat
Contributor guide
Research direction
Start by reviewing the listed TSX components and searching for other icon-only description tooltip triggers using the shared Tooltip component. Define one keyboard-focusable, meaningfully named trigger pattern while preserving the question-circle presentation and tooltip content. Add tests for focus behavior and representative usages, then verify the acceptance criteria across the affected components.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- accessibility, frontend, testing
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 72/100