Skip to content

bug(material/radio): Focus styling remains applied after mouseup #25090

Closed
@RobinKamps

Description

@RobinKamps

Is this a regression?

  • Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

sadly, the material radiobutton stays focused after being selected.
This could be intended by the material specs - #14290
But other material components like checkbox or inputs does not have this behavior.
The material specs ( https://material.io/components/selection-controls#radio-buttons ) mention a "Pressed Focus" state - but the animation does show a different behavior after click: https://kstatic.googleusercontent.com/files/bed79fcf6804cded983c22cde6ee42734fce03e47589c4f3d4338405c67cd0b7e28a30c4fbcf9eea0403fb2e8846c4264d432451a31eb7bd364e94d30b1e77d2

perhaps the behavior to keep a "pressed focused" state or to remove focus (and defocus just like all other elements/checkboxes) could be made optional.

Reproduction

Steps to reproduce:
head to https://material.angular.io/components/radio/examples and click a radio button

Expected Behavior

the focus / animation / big transparent ripple circle should disappear

Actual Behavior

the focus / animation / big transparent ripple circle does not disappear

Environment

  • Angular:
  • CDK/Material:
  • Browser(s):
  • Operating System (e.g. Windows, macOS, Ubuntu):

Metadata

Metadata

Assignees

Labels

P3An issue that is relevant to core functions, but does not impede progress. Important, but not urgentarea: material/radioregressionThis issue is related to a regression

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions