Progress — accessibility
Keyboard
- Progress is not interactive: nothing to focus, nothing to press. Any action tied to the job (cancel, retry, open the result) is a separate button next to it.
ARIA
- The track is
role="progressbar"witharia-labelnaming the process ("Zpracování přepisu", "Zpracování dokumentů") — required by the component (ariaLabel). aria-valuemin="0",aria-valuemax="100";aria-valuenowonly when the value is known. In the indeterminate state it is omitted, which is how assistive technology recognises an unknown value.aria-valuetextcombines the step and the shown number ("Oprava jmen, 61 %"), so a screen reader hears the step, not a bare percentage.- Step glyphs (check, Loader, dashed circle) are decorative; the step state is carried by the visible label and its order.
- When the state changes over time (running → done / failed), the host wraps Progress in a polite live region (
aria-live="polite") so the change is announced without stealing focus.
Focus
- Progress takes no focus and never moves it. Focus stays where the user left it while the job runs.
Contrast
- Label
--fgand meta--fg-secondaryon the surface; the failure reason uses--critical-ink. - The fill colours (
--accent,--positive,--critical) sit on--border; the state is never carried by colour alone — the label and meta say it in words.
Motion
prefers-reduced-motion: reduceturns off the width transition, and the indeterminate segment becomes a full, 40 % opaque track instead of a moving one.
Known limits
- The indeterminate state has no value to announce; only the label and meta convey progress.
- Step changes are announced only if the host provides the live region.
Source: docs/loading/progress.a11y.md · GitLab