bug(Button Toggle): Template-driven form not focusable

[BojanSlavkovskii]

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

Up until v18

Description

On Button Toggle, in the examples with forms, the Reactive form is working fine but the "Template-driven form" is not focusable, when you try to tab into it, it just skips it.
All buttons in there has tabindex="-1" where in reactive-form only the first button has tabindex="0", even without any control ( formControl or ngModel ) it works fine and tabindex on the first button is 0 (if nothing is selected).
If there is anything selected when using ngModel, then it works fine as the other two (with formControl and without any control).

UPDATE: If there is button that reset the formControl, you also cannot access the toggle-button.

Reproduction

Material link: https://material.angular.io/components/button-toggle/examples
Steps to reproduce:

1. Go to the second example.
2. Tab into it, and try focusing the first button-toggle-group ( Template-driven form ) without pre-selecting value.

Expected Behavior

Expected behavior is to behave as the one that has FormControl and the one that has nothing in it. It's expected the first button to be focused if value isn't selected.

Actual Behavior

Button-toggle is not focusable if there isn't any selected value like without using ngModel.

Environment

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

[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.}