add comments

Author: mmalerba

src/cdk/text-field/_text-field.scss

@@ -20,9 +20,14 @@
     resize: none;
   }
 
+  // This class is temporarily applied to the textarea when it is being measured. It is immediately
+  // removed when measuring is complete. We use `!important` rules here to make sure user-specified
+  // rules do not interfere with the measurement.
   textarea.cdk-textarea-autosize-measuring {
     height: auto !important;
     overflow: hidden !important;
+    // Having 2px top and bottom padding seems to fix a bug where Chrome gets an incorrect
+    // measurement. We just have to account for it later and subtract it off the final result.
     padding: 2px 0 !important;
     box-sizing: content-box !important;
   }

src/cdk/text-field/autosize.ts

@@ -190,9 +190,8 @@ export class CdkTextareaAutosize implements AfterViewInit, DoCheck, OnDestroy {
     textarea.classList.add('cdk-textarea-autosize-measuring');
     textarea.placeholder = '';
 
-    // Use the scrollHeight to know how large the textarea *would* be if fit its entire value.
-    // We subtract 4 from the scrollHeight because of the 2px top and bottom padding. Having the
-    // extra 2px on either side seems to fix inaccurate measurements in Chrome.
+    // The cdk-textarea-autosize-measuring class includes a 2px padding to workaround an issue with
+    // Chrome, so we account for that extra space here by subtracting 4 (2px top + 2px bottom).
     textarea.style.height = `${textarea.scrollHeight - 4}px`;
 
     textarea.classList.remove('cdk-textarea-autosize-measuring');

src/lib/input/input.scss

@@ -94,6 +94,8 @@ textarea.mat-input-element {
 }
 
 textarea.mat-input-element {
+  // The 2px padding prevents scrollbars from appearing on Chrome even when they aren't needed.
+  // We also add a negative margin to negate the effect of the padding on the layout.
   padding: 2px 0;
   margin: -2px 0;
 }