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

Accessibility: annotations are mouse-only, and four smaller gaps

Aperta
  • Qualcosa non va?
#17 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
4/5
Tempo stimato
3-5 giorni
Idoneità per principianti
48/100
Tipo di issue
Bug
Chiarezza
Abbastanza chiara
Stato di attività
Attiva
Stack tecnologico
typescript
Ambito
accessibility, frontend

Direzione di ricerca

Inizia tracciando il flusso del canvas dell’editor e della selezione delle annotazioni, quindi esamina useEditorShortcuts e l’input del colore e gli slider del pannello delle annotazioni. L’obiettivo principale è consentire l’accesso da tastiera a disegno, selezione, spostamento, eliminazione, sticker, oscuramento e testo; inoltre, affronta le lacune indicate relative a nomi, testo del valore, landmark e contrasto. Verifica il risultato con un passaggio da tastiera e un controllo dell’albero dell’accessibilità.

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

Descrizione

AI assisted type: enhancement

Going through the editor with the keyboard and the accessibility tree after #16, mostly to see what we would have to fix before calling this done. Writing down what I found so it does not get lost.

The good news first, since it is most of it: every control has an accessible name, nothing focusable is hidden behind aria-hidden, the focus outline shows up everywhere, the canvas carries role="img" and a label in all six modes, the rail exposes the active mode through aria-pressed, the live region already announces mode switches and annotations appearing and disappearing, and animation respects prefers-reduced-motion. Tab also leaves the editor instead of trapping, which is right for something embedded in a page.

What is missing:

  • Annotations cannot be reached with a keyboard at all. The canvas has no tabindex, annotations are not focusable, and the selection toolbar only exists once something has been selected with a pointer. Drawing, selecting, moving and deleting are mouse-only, and the arrow-key nudging and Delete in useEditorShortcuts only work after a pointer selection, so they are unreachable too. Same for stickers, redaction and text. This is the limitation we already listed in the beta.1 changelog, it just has evidence now. It is also the only finding here that blocks a whole feature rather than degrading it.
  • The colour input has no name. input[type=color] in the annotate panel has neither aria-label nor title, and it is the only unnamed control in the editor.
  • Sliders announce a bare number. They are labelled and carry min and max, but none of them set aria-valuetext, so exposure reads "0" and not "0 stops". The range is -100 to 100 and that scale means something we are not saying.
  • No headings or landmarks. Not an issue when a host page provides its own structure, but there is nothing to navigate by in the fullscreen case.
  • Contrast on the chrome is not guaranteed. The zoom readout is at opacity: 0.8 on a translucent pill over whatever photo is loaded, so the ratio depends on the image and cannot be asserted. Worth deciding on rather than leaving to chance.

The first one is the one worth doing. The rest are small enough to take in one pass.

👾 The audit behind this was run with Claude Code.

Lingua principale
TypeScript
Stelle
2
Fork
0
Merge medio
1h 15m
PR unite (30g)
31

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 nextcloud-libraries/nextcloud-image-editor

Tutte le issue di nextcloud-libraries/nextcloud-image-editor

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.