Reduced motion leaves no sign that a check for new items is running #310

Closed
opened 2026-10-19 16:22:19 -07:00 by rays · 1 comment
Owner

With prefers-reduced-motion: reduce, app.css:496-498 sets *{animation:none!important;transition:none!important}. The refresh buttons show a scan in progress only by turning (body.scan-any #scanAll .i, body.scan-this .fhead [data-a=scan] .i, app.css:654-655, set in feeds.ts spinStart/spinEnd), so with motion reduced a running check looks exactly like an idle one: no label, no aria-busy, no static change. The same rule leaves the loading spinners (.listload, #pullspin, a feed row's .scanning ring) as still rings, and toasts and phone sheets appear with no fade.

Fix: while checking, set aria-busy="true" and a "Checking…" label on the refresh buttons; under reduced motion swap movement for an opacity fade (spinners, toasts, sheets) instead of removing all feedback.

Found in a UI-polish review of the main window (2026-10-19). Confirmed in Playwright with reducedMotion: 'reduce': #scanAll's label and attributes do not change when pressed; animation-name is none.

With prefers-reduced-motion: reduce, app.css:496-498 sets `*{animation:none!important;transition:none!important}`. The refresh buttons show a scan in progress only by turning (`body.scan-any #scanAll .i`, `body.scan-this .fhead [data-a=scan] .i`, app.css:654-655, set in feeds.ts spinStart/spinEnd), so with motion reduced a running check looks exactly like an idle one: no label, no aria-busy, no static change. The same rule leaves the loading spinners (.listload, #pullspin, a feed row's .scanning ring) as still rings, and toasts and phone sheets appear with no fade. Fix: while checking, set aria-busy="true" and a "Checking…" label on the refresh buttons; under reduced motion swap movement for an opacity fade (spinners, toasts, sheets) instead of removing all feedback. Found in a UI-polish review of the main window (2026-10-19). Confirmed in Playwright with reducedMotion: 'reduce': #scanAll's label and attributes do not change when pressed; animation-name is none.
rays added the bug label 2026-10-19 16:22:19 -07:00
Author
Owner

Fixed in 0696583: the refresh buttons carry aria-busy="true" and the label "Checking for new items…" while a check runs; under reduced motion spinners and the refresh icons pulse in opacity, and toasts and sheets fade in. Browser test added (reducedMotion: 'reduce'). Deployed in ipx-web.

Fixed in 0696583: the refresh buttons carry aria-busy="true" and the label "Checking for new items…" while a check runs; under reduced motion spinners and the refresh icons pulse in opacity, and toasts and sheets fade in. Browser test added (reducedMotion: 'reduce'). Deployed in ipx-web.
rays closed this issue 2026-10-20 08:17:48 -07:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: rays/ipx#310