bug(RadioButton): Enter a required radio group, SR announces "required invalid data"

[clamli]

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

Screen reader announces "required invalid data..." when user enters an empty radio group that is required.

Reproduction

StackBlitz link: https://stackblitz.com/edit/uex8xzys?file=src%2Fexample%2Fradio-ng-model-example.html
Steps to reproduce:

1. Go to https://stackblitz.com/edit/uex8xzys?file=src%2Fexample%2Fradio-ng-model-example.html
2. Turn on screen reader
3. Enter the radio group
4. Hear the screen reader announces "required invalid data...."

Expected Behavior

Screen reader should not announce "invalid".

Actual Behavior

Screen reader announces "invalid".

Environment

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

[crisbeto]

I suspect that this is happening, because there's no value and the inputs are marked as required. Technically I think this is correct since the group is in an invalid state.

[clamli]

Ideally we want SRs to announce "required" which should be sufficient when a required radio group does not have a selection, and I sense this is something we attempted to fix in the past within MatInput which radio button is built on and I do not see attr.aria-invalid on the input inside radio button.

This may relate to the other radio button issue that required is used on individual radio button instead of the entire group.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}