bug(form-field): mat-form-field text overlap with suffix icon

[Mradmedamine]

trafficstars

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

when having mat-form-field with long label text the text overlap with suffix icon

Reproduction

StackBlitz link: https://stackblitz.com/edit/sktdb4nx-laqmu1py?file=src%2Fexample%2Fform-field-appearance-example.html Steps to reproduce:

1. just put a long text on a mat-form-field with suffix icon

Expected Behavior

no overlap with long text

Actual Behavior

the text overlaps with the icon

Environment

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

[ThornWalli]

Hello,

have already experienced the same behavior with Angluar 18.

Stackblitz: https://stackblitz.com/edit/stackblitz-starters-jdfeo5oc?file=src%2Fapp%2Fapp.component.html

[andrewseguin]

Besides "no overlap", what behavior are you expecting here? Ellipsis is not ideal since we do not want to hide visual text, especially a label.