bug(MatFormField): Resetting will-change breaks stacking context when sticky columns are used with MatTable

[artopaavola]

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

17.2.1

Description

When there is a MatFormField in a MatTable column and that sticky table is scrolled horizontally, the field border does not go "behind" sticky column. This regression was introduced in Angular Material 17.2.2 with this commit f6e8584

Removing the will-change: auto on row 85 in the above commit fixes the issue.

Reproduction

StackBlitz link: https://stackblitz.com/edit/stackblitz-starters-alv6me?file=package.json
Steps to reproduce:

1. Create a MatTable with sticky first column
2. Put a MatFormField in the second column (not the sticky one)
3. Scroll table contents horizontally
4. The MatFormField borders will be on top of the sticky column while all other content including the text written in the MatFormField will correctly go behind the sticky column.

Expected Behavior

All the content in non-sticky columns should go "behind" the sticky column when scrolled horizontally.

Actual Behavior

The MatFormField borders remain on top of the sticky column when scrolled.

Environment

• Angular:
• CDK/Material:

Angular CLI: 17.2.3
Node: 18.19.0
Package Manager: npm 10.2.3
OS: darwin arm64

Angular: 17.2.4
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.1702.3
@angular-devkit/build-angular      17.2.3
@angular-devkit/core               17.2.3
@angular-devkit/schematics         17.2.3
@angular/cdk                       17.2.2
@angular/cli                       17.2.3
@angular/material                  17.2.2
@angular/material-moment-adapter   17.2.2
@schematics/angular                17.2.3
ng-packagr                         17.2.1
rxjs                               7.8.1
typescript                         5.3.3
zone.js                            0.14.4

• Browser(s): Chrome Version 122.0.6261.94 (Official Build) (arm64), Firefox 123.0
• Operating System (e.g. Windows, macOS, Ubuntu): macOS

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