fix(material/schematics): add handling for several api changes (#25943)

* fix(material/schematics): add handling for several api changes

* remove tickInterval, valueText, defaultColor,
  defaultTabIndex, onTouched, and displayValue
  for slider template migrations

* fixup! fix(material/schematics): add handling for several api changes

* fixup! fix(material/schematics): add handling for several api changes

Author: wagnermaciel

src/material/schematics/ng-generate/mdc-migration/rules/components/slider/slider-template.spec.ts

@@ -97,19 +97,40 @@ describe('slider template migrator', () => {
     );
     await runMigrationTest(
       `
-      <mat-slider vertical invert></mat-slider>`,
+      <mat-slider tickInterval="2"></mat-slider>`,
       `
-      <!-- TODO: The 'vertical' property no longer exists -->
-      <!-- TODO: The 'invert' property no longer exists -->
+      <!-- TODO: The 'tickInterval' property no longer exists -->
+      <mat-slider><input matSliderThumb /></mat-slider>`,
+    );
+    await runMigrationTest(
+      `
+      <mat-slider valueText></mat-slider>`,
+      `
+      <!-- TODO: The 'valueText' property no longer exists -->
       <mat-slider><input matSliderThumb /></mat-slider>`,
     );
     await runMigrationTest(
       `
-      <button>Click Me</button><mat-slider vertical invert></mat-slider>`,
+      <mat-slider
+        vertical
+        invert
+        [valueText]="myValueText"
+        tickInterval="4"></mat-slider>`,
       `
-      <button>Click Me</button>
+      <!-- TODO: The 'valueText' property no longer exists -->
       <!-- TODO: The 'vertical' property no longer exists -->
       <!-- TODO: The 'invert' property no longer exists -->
+      <!-- TODO: The 'tickInterval' property no longer exists -->
+      <mat-slider><input matSliderThumb /></mat-slider>`,
+    );
+  });
+
+  it('should remove displayValue and comment suggesting to switch to displayWith', async () => {
+    await runMigrationTest(
+      `
+      <mat-slider [displayValue]="myDisplayValue"></mat-slider>`,
+      `
+      <!-- TODO: The 'displayValue' property no longer exists. Use 'displayWith' instead. -->
       <mat-slider><input matSliderThumb /></mat-slider>`,
     );
   });

src/material/schematics/ng-generate/mdc-migration/rules/components/slider/slider-template.ts

@@ -52,12 +52,25 @@ export class SliderTemplateMigrator extends TemplateMigrator {
             updates.push(this._removeBinding(originalHtml, binding.node));
           }
 
-          if (binding.name === 'invert' || binding.name === 'vertical') {
+          if (
+            binding.name === 'invert' ||
+            binding.name === 'vertical' ||
+            binding.name === 'tickInterval' ||
+            binding.name === 'valueText'
+          ) {
             // Remove the binding and leave a comment.
             comments.push(`<!-- TODO: The '${binding.name}' property no longer exists -->`);
             updates.push(this._removeBinding(originalHtml, binding.node));
           }
 
+          if (binding.name === 'displayValue') {
+            // Remove the binding and leave a comment.
+            comments.push(
+              `<!-- TODO: The '${binding.name}' property no longer exists. Use 'displayWith' instead. -->`,
+            );
+            updates.push(this._removeBinding(originalHtml, binding.node));
+          }
+
           // TODO(wagnermaciel): Finish the remapping of other bindings.
         }