perf(material/form-field): resolve scrolling performance issues

MDC was setting `will-change` on a couple of elements which caused significant scrolling performance issues on pages with a lot of form fields. These changes reset the `will-change`, because one of the elements wasn't being animated at all and the other one was only animating `transform` which is hardware-accelerated.

Fixes #27249.

Author: crisbeto

src/material/form-field/_mdc-text-field-structure-overrides.scss

@@ -29,6 +29,12 @@
     // and makes migration from the legacy form-field easier for tests that were depending on
     // clicking the label to focus the input.
     pointer-events: all;
+
+    // TODO(b/286481557): should be removed when this is addressed on the MDC side.
+    // MDC sets a will-change on this element, because of the animation. This can cause
+    // scrolling performance degradation on pages with a lot of form fields so we reset it.
+    // The animation is on a `transform` which is hardware-accelerated already.
+    will-change: auto;
   }
 
   // Reset the height that MDC sets on native input elements. We cannot rely on their
@@ -56,6 +62,11 @@
   .mat-mdc-text-field-wrapper {
     height: auto;
     flex: auto;
+
+    // TODO(b/286481557): should be removed when this is addressed on the MDC side.
+    // MDC sets a will-change on this element, despite it not animating. This can cause
+    // scrolling performance degradation on pages with a lot of form fields so we reset it.
+    will-change: auto;
   }
 
   // The icon prefix/suffix is closer to the edge of the form-field than the infix is in a