bug(form-field): mdc-notched-outline__notch shows overlapping border

[scarrasco-pgr]

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

If the form field is contained in a parent that contains the transform CSS property e.g. transform: translate3d(40px, -38px, 0px); then the notch shows an overlapping border.

Reproduction

StackBlitz link: https://stackblitz.com/edit/hcnjyvfa?file=src%2Fexample%2Fcdk-drag-drop-root-element-example.html
Steps to reproduce:

1. Move the dialog around
2. Adjust the zoom level

Expected Behavior

For the notch to not contain an overlapping border

Actual Behavior

Notch contains an overlapping border

Environment

Angular CLI: 19.2.0
Node: 18.20.3
Package Manager: npm 10.2.3
OS: linux x64

Angular: 19.2.0
... animations, cli, common, compiler, compiler-cli, core, forms
... localize, platform-browser, platform-browser-dynamic, router

Package Version

@angular-devkit/architect 0.1902.0
@angular-devkit/build-angular 19.2.0
@angular-devkit/core 19.2.0
@angular-devkit/schematics 19.2.0
@angular/cdk 19.2.1
@angular/material 19.2.1
@angular/material-moment-adapter 19.2.1
@schematics/angular 19.2.0
rxjs 7.4.0
typescript 5.8.2
zone.js 0.15.0

[crisbeto]

Duplicate of #29821.

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