angular / angular/components

Angular Material Radio button - Ripple effect persists until clicking away.

Aperta
#23,807 10 commenti 0 reazioni 0 assegnatari Vedi su GitHub
area: material/radio P3
Lingua principale
TypeScript
Stelle
25k
Fork
6.8k
Merge medio
1g 8h
PR unite (30g)
91

Descrizione

### Which @angular/* package(s) are the source of the bug?

Don't known / other

### Is this a regression?

Yes

### Description

Clicking on a radio button now persists the ripple effect. This issue seems to have appeared since Angular 11 and still exists in Angular 12. This bug can be seen in angular material documentation.

Angular 10. No persistent ripple.
https://v10.material.angular.io/components/radio/overview

Angular 11. Persistent ripple issue which clears after clicking somewhere on the screen
https://v11.material.angular.io/components/radio/overview

Although not perfect I've added the following css to hide the bug as a workaround.

`
.mat-radio-button:not(.mat-radio-disabled).cdk-program-focused .mat-radio-persistent-ripple {
opacity: 0;
}
`

I couldn't find a ticket regarding this issue so thought it's worth raising one.

### Please provide a link to a minimal reproduction of the bug

https://v11.material.angular.io/components/radio/overview

### Please provide the exception or error you saw

_No response_

### Please provide the environment you discovered this bug in

_No response_

### Anything else?

_No response_

Guida per i contributori

Apri la guida per i contributori

Direzione di ricerca

Inizia con gli esempi dei radio button di Angular Material collegati nell’issue e confronta il comportamento di Angular 10 e Angular 11 per isolare la regressione. Riproduci il ripple persistente dopo aver selezionato un radio button, quindi verifica che scompaia senza richiedere un clic altrove, anche nell’esempio della documentazione.

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

Valutazione

Stack tecnologico
angular, typescript
Ambito
frontend
Tipo di issue
Bug
Difficoltà
3/5
Tempo stimato
1-2 giorni
Stato di attività
Ferma
Chiarezza
Abbastanza chiara
Idoneità per principianti
35/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.