Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

bug(ui): V2 AnimatedNumber exposes animation digits and reversed reading order to screen readers

Aperta Adatta ai principianti
  • Qualcosa non va?
#54,653 2 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

@argszero ci sta già lavorando.

Dal 12/10/2026.

  • #54977 di @argszero — aperta

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
74/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
typescript
Ambito
accessibility, frontend

Direzione di ricerca

Leggi packages/ui/src/components/animated-number.tsx e il relativo CSS, quindi riproduci l’albero di accessibilità in Chromium per un valore fisso e durante un aggiornamento. Verifica come il componente espone il suo valore numerico stabile e le celle dell’animazione visiva alle tecnologie assistive. Il lavoro è completato quando l’albero di accessibilità espone un unico numero corrente nell’ordine corretto per tutta la durata dell’animazione.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

reproduced
Description

V2's AnimatedNumber still exposes animation cells to assistive technology and gives multi-digit numbers the wrong reading order.

With the unmodified production component and CSS rendered in Chromium / Solid 1.9.15:

  • Value 12 looks correct in LTR, but the accessibility snapshot contains text 2, then 1.
  • During a 5 to 6 update, the accessibility snapshot exposes 0123456789 three times instead of the actual count. The existing motion-duration CSS variable was increased only to capture this transient state.

The component reverses digits in DOM order and renders 30 cells per animated strip, without aria-hidden on the visual digits. The parent span's aria-label does not replace those children in the observed accessibility tree: production component.

CSS hides the strip at rest, but exposes it while animating; visual row-reverse does not repair accessibility reading order: production CSS. A current consumer is ToolCountLabel.

OpenCode version

2.0.26 source build, latest v2 commit 4617210822bdbb31e5749751afbfb4584ccedac8 (audited 2026-10-12). Both component and CSS are unchanged at current dev commit 707de5832656e89cc0f04436aa1cd5f4f91c5763.

Steps to reproduce

Render <AnimatedNumber value={12} /> with its production CSS, inspect its accessibility tree, then increment a single-digit value during animation.

Expected: one correctly ordered, current numeric value. Expose stable text for that value and hide the visual animation from assistive technology regardless of motion state.

Related reports

V2 continuation of Problem 2 in #41408, closed during V1 migration triage. #43643 concerns visual RTL ordering in the same component. Streaming-content exposure is tracked separately in #54652 and addressed by PR #51084, which does not fix this component.

Lingua principale
TypeScript
Stelle
213k
Fork
28.4k
Merge medio
7h 50m
PR unite (30g)
295

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di anomalyco/opencode

Tutte le issue di anomalyco/opencode

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.