Angular Material Radio button - Ripple effect persists until clicking away.
- Vorherrschende Sprache
- TypeScript
- Sterne
- 25k
- Forks
- 6.8k
- Ø Merge
- 1 T. 8 Std.
- Gemergte PRs (30 T.)
- 91
Beschreibung
### 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_
Beitragsleitfaden
Rechercherichtung
Beginne mit den im Issue verlinkten Angular Material-Radio-Beispielen und vergleiche das Verhalten von Angular 10 und Angular 11, um die Regression einzugrenzen. Reproduziere den dauerhaft sichtbaren Ripple nach der Auswahl eines Radio-Buttons und überprüfe anschließend, dass er verschwindet, ohne dass ein Klick an einer anderen Stelle erforderlich ist, einschließlich im Dokumentationsbeispiel.
Vom Indexierungsmodell aus dem Issue-Text verfasst.
Bewertung
- Tech-Stack
- angular, typescript
- Bereich
- frontend
- Issue-Typ
- Bug
- Schwierigkeit
- 3/5
- Geschätzter Aufwand
- 1-2 Tage
- Aktivitätsstatus
- Veraltet
- Klarheit
- Größtenteils klar
- Anfängerfreundlichkeit
- 35/100