fix(cdk/schematics): remove file extensions in tilde migration (#24169)

Expands the tilde migration to also drop the `.scss` file extensions.

Fixes #24162.

(cherry picked from commit 4132006)

src/cdk/schematics/ng-update/migrations/tilde-import-v13/tilde-import-migration.ts

@@ -21,10 +21,11 @@ export class TildeImportMigration extends DevkitMigration<null> {
     if (extension === '.scss' || extension === '.css') {
       const content = stylesheet.content;
       const migratedContent = content.replace(
-        /@(?:import|use) +['"]~@angular\/.*['"].*;?/g,
-        match => {
-          const index = match.indexOf('~@angular');
-          return match.slice(0, index) + match.slice(index + 1);
+        /@(?:import|use) +['"](~@angular\/.*)['"].*;?/g,
+        (match, importPath) => {
+          const index = match.indexOf(importPath);
+          const newImportPath = importPath.replace(/^~|\.scss$/g, '');
+          return match.slice(0, index) + newImportPath + match.slice(index + importPath.length);
         },
       );
 

src/cdk/schematics/ng-update/test-cases/v13/misc/tilde-import-v13.spec.ts

@@ -124,4 +124,26 @@ describe('v13 tilde import migration', () => {
       `@include mat-core();`,
     ]);
   });
+
+  it('should remove remove .scss file extension', async () => {
+    writeLines(TEST_PATH, [
+      `@use '~@angular/material.scss' as mat;`,
+      `@import '~@angular/material/theming.scss';`,
+      `@import '~@angular/cdk/overlay-prebuilt.css';`,
+
+      `@include mat.button-theme();`,
+      `@include mat-core();`,
+    ]);
+
+    await runMigration();
+
+    expect(splitFile(TEST_PATH)).toEqual([
+      `@use '@angular/material' as mat;`,
+      `@import '@angular/material/theming';`,
+      `@import '@angular/cdk/overlay-prebuilt.css';`,
+
+      `@include mat.button-theme();`,
+      `@include mat-core();`,
+    ]);
+  });
 });