Separator adds a redundant role="separator" to its default <hr>

Aperta Adatta ai principianti
#10,894 2 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

@Janani-bn ci sta già lavorando.

Dal 2/11/2026.

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
html, react, typescript

Direzione di ricerca

Leggi l’implementazione di Separator e la logica di useSeparator che richiama, concentrandoti su come viene passato il tipo di elemento predefinito hr. Riproduci il problema con <Separator />, quindi verifica che l’hr renderizzato non abbia un ruolo ridondante, mentre gli elementi diversi da hr scelti esplicitamente mantengano il comportamento previsto.

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

Descrizione

Provide a general summary of the issue here

<Separator /> renders <hr role="separator">.

Separator falls back to 'hr' (let Element = elementType || 'hr') but passes the original, undefined elementType to useSeparator, whose if (props.elementType !== 'hr') then adds the role. Passing elementType="hr" explicitly avoids it.

HTML validators flag the redundant role (html-validate no-redundant-role).

🤔 Expected Behavior?

an <hr> without role="separator".

😯 Current Behavior

<hr role="separator">, because Separator passes the original elementType (undefined) to useSeparator, not the 'hr' it renders.

💁 Possible Solution

pass elementType: Element to useSeparator.

🔦 Context
🖥️ Steps to Reproduce

<Separator />

Version

react-aria-components 1.21.1

What browsers are you seeing the problem on?

Chrome

If other, please specify.

No response

What operating system are you using?

OS X

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

Lingua principale
TypeScript
Stelle
16k
Fork
1.6k
Merge medio
2g 17h
PR unite (30g)
41

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 adobe/react-spectrum

Tutte le issue di adobe/react-spectrum

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.