Hacktoberfest 2026: die Issues, die Maintainer für den Oktober markiert haben – offen und einsteigerfreundlich. Hacktoberfest-Issues durchsuchen

Render the listbox whenever the Select component is rendered

Offen
#853 0 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
2/5
Geschätzter Aufwand
1-3 Stunden
Anfängerfreundlichkeit
35/100
Issue-Typ
Feature
Klarheit
Klar beschrieben
Aktivitätsstatus
Veraltet
Tech-Stack
react, typescript
Bereich
frontend

Rechercherichtung

Beginne mit BaseSelect.tsx und dem vorgeschlagenen PR #804 und konzentriere dich auf SelectTrigger und dessen Option forceRender={true}. Die Arbeit ist abgeschlossen, wenn die Listbox bereits beim initialen Select-Rendern gerendert werden kann und Accessibility-Audits nicht mehr auf eine aria-controls-Referenz auf ein fehlendes Element stoßen.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

Description

As it stand right now, the listbox is added to the DOM after the user interacts with the Select component. This is a problem because it will throw an error when running accessibility tests. Listbox is rendered after the user interacts with the component, but this is not good enough.

Technical description of the issue

The problem is that the [role="combobox"] element has aria-controls attribute equal to the id of the [role="listbox"] element, but since this element does not exist when the page is first rendered, it will throw an error when running accessibility audits.

Proposed solution

Allow rendering (at least optionally) the listbox element from the start. You can do this by passing prop 'forceRender={true}' to SelectTrigger in BaseSelect.tsx, and control this with a prop received from Select. I've created a PR for this, but open to suggestion on how it can be done differently.

Thanks!

Vorherrschende Sprache
TypeScript
Sterne
938
Forks
482
Ø Merge
15 Std. 8 Min.
Gemergte PRs (30 T.)
2

Entwicklungsumgebung

Die Einrichtungsdateien dieses Projekts haben wir noch nicht geprüft. Beginnen Sie mit der README; die allgemeinen Schritte stehen in unserem Leitfaden für den ersten Beitrag.

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus react-component/select

Alle Issues in react-component/select

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.