Hacktoberfest 2026 : les issues que les mainteneurs ont marquées pour octobre, ouvertes et accessibles aux débutants. Parcourir les issues Hacktoberfest

a11y: shortlist drops focus to body on Clear and last Remove, and adding an item gives no in-view feedback

Fermée
  • Quelque chose ne va pas ?
#156 0 commentaires 0 réactions 0 personnes assignées Voir sur GitHub

Les mainteneurs répondent en général sous 1 jour

Personne n'a encore pris cette issue.

Évaluation

Difficulté
4/5
Temps estimé
1-2 jours
Accessibilité débutants
57/100
Type d'issue
Bug
Clarté
Clairement spécifiée
Activité
Active
Stack technique
javascript
Domaine
accessibility, frontend

Piste de recherche

Start with site/public/shortlist.js, especially lines 117 and 124, and inspect renderPanel() plus the existing polite live region and sticky controls. Reproduce Clear and last Remove to check focus, then add an item from a lower visible card to observe feedback and layout movement. Done means focus stays off body, additions announce and show the count in view, and adding causes no layout shift without scroll anchoring.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Description

accessibility priority: medium

Why it matters

Keyboard and screen-reader users lose their place twice (focus lands on <body>), and every user who stars a card deep in the list gets no visible confirmation beyond the button label change, because the panel appears above the grid, often screens away. In browsers without scroll anchoring (WebKit) the list also jumps under the thumb.

Evidence (at 69387df, local build)

  • Click "Clear shortlist" -> document.activeElement === document.body. Add one, click "Remove" -> body. site/public/shortlist.js:117 focuses #shortlist, which renderPanel() has just set hidden; line 124 update([]) hides the panel containing the focused button.
  • Adding from the 4th visible card at 375 px: the panel is inserted about 360 px above the card with a height of 310 px; Chrome's scroll anchoring compensated, Safari has none. The only feedback is the button text "On shortlist".

Suggested approach

When the panel hides, focus #search or #result-count; announce "Added to shortlist (N)" / "Removed ..." through the existing polite live region; show a persistent "Shortlist (N)" control in the sticky controls (or on the floating to-top button) that scrolls to and focuses the panel. Rendering the panel as a one-line sticky summary under the controls would also remove the layout jump.

Done when

Focus never lands on <body> after a shortlist action; adding announces and shows a count in view; no layout shift in browsers without scroll anchoring.

Langage dominant
JavaScript
Étoiles
58
Forks
15
Merge moyen
16 h 53 min
PR mergées (30 j)
14

Préparer son environnement

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Autres issues de TMHSDigital/Free-Game-Dev-Assets

Toutes les issues de TMHSDigital/Free-Game-Dev-Assets

Issues similaires

Plus d'issues JavaScript

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.