feat(material/schematics): add handling for all-component-themes (#25528

)
angular · Aug 25, 2022 · 226696d · 226696d
1 parent 4a3ae58
commit 226696d
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 3 deletions.
diff --git a/src/material/schematics/ng-update/migrations/legacy-components-v15/index.ts b/src/material/schematics/ng-update/migrations/legacy-components-v15/index.ts
@@ -55,7 +55,12 @@ export class LegacyComponentsMigration extends Migration<null> {
     if (!namespace || !node.source?.start) {
       return;
     }
-    if (this._isLegacyMixin(node, namespace)) {
+    if (node.params.startsWith(`${namespace}.all-component-`)) {
+      this._replaceAt(filePath, node.source.start.offset, {
+        old: `${namespace}.all-`,
+        new: `${namespace}.all-legacy-`,
+      });
+    } else if (this._isLegacyMixin(node, namespace)) {
       this._replaceAt(filePath, node.source.start.offset, {
         old: `${namespace}.`,
         new: `${namespace}.legacy-`,
@@ -65,6 +70,9 @@ export class LegacyComponentsMigration extends Migration<null> {
 
   /** Returns true if the given at-include rule is a use of a legacy component mixin. */
   private _isLegacyMixin(node: postcss.AtRule, namespace: string): boolean {
+    if (!node.params.startsWith(`${namespace}.`)) {
+      return false;
+    }
     for (let i = 0; i < MIXINS.length; i++) {
       if (node.params.startsWith(`${namespace}.${MIXINS[i]}`)) {
         return true;

diff --git a/src/material/schematics/ng-update/test-cases/v15/legacy-components-v15.spec.ts b/src/material/schematics/ng-update/test-cases/v15/legacy-components-v15.spec.ts
@@ -170,8 +170,20 @@ describe('v15 legacy components migration', () => {
     }
 
     it('updates all mixins', async () => {
-      const oldFile: string[] = [`@use '@angular/material' as mat;`];
-      const newFile: string[] = [`@use '@angular/material' as mat;`];
+      const oldFile: string[] = [
+        `@use '@angular/material' as mat;`,
+        `@include mat.all-component-themes($theme);`,
+        `@include mat.all-component-colors($theme);`,
+        `@include mat.all-component-densities($theme);`,
+        `@include mat.all-component-typographies($theme);`,
+      ];
+      const newFile: string[] = [
+        `@use '@angular/material' as mat;`,
+        `@include mat.all-legacy-component-themes($theme);`,
+        `@include mat.all-legacy-component-colors($theme);`,
+        `@include mat.all-legacy-component-densities($theme);`,
+        `@include mat.all-legacy-component-typographies($theme);`,
+      ];
       for (let i = 0; i < COMPONENTS.length; i++) {
         oldFile.push(
           ...[