fix(material/schematics): gracefully skip broken css files

also don't treat files like something.css.map as a CSS file.

Author: mmalerba

integration/mdc-migration/golden/src/broken.css

@@ -0,0 +1,5 @@
+/* Does not compile (missing semicolons) */
+.mat-button {
+  width: 100
+  height: 100
+}

integration/mdc-migration/golden/src/dont-migrate-me.css.skip

@@ -0,0 +1,4 @@
+/* Should not be migrated (filename is not .css or .scss) */
+.mat-button {
+  width: 100px;
+}

integration/mdc-migration/sample-project/src/broken.css

@@ -0,0 +1,5 @@
+/* Does not compile (missing semicolons) */
+.mat-button {
+  width: 100
+  height: 100
+}

integration/mdc-migration/sample-project/src/dont-migrate-me.css.skip

@@ -0,0 +1,4 @@
+/* Should not be migrated (filename is not .css or .scss) */
+.mat-button {
+  width: 100px;
+}

src/cdk/schematics/ng-update/find-stylesheets.ts

@@ -10,7 +10,7 @@ import {join, Path} from '@angular-devkit/core';
 import {Tree} from '@angular-devkit/schematics';
 
 /** Regular expression that matches stylesheet paths */
-const STYLESHEET_REGEX = /.*\.(css|scss)/;
+const STYLESHEET_REGEX = /.*\.(css|scss)$/;
 
 /**
  * Finds stylesheets in the given directory from within the specified tree.

src/material/schematics/ng-generate/mdc-migration/rules/theming-styles.ts

@@ -22,10 +22,10 @@ export class ThemingStylesMigration extends Migration<ComponentMigrator[], Schem
     this.fileSystem
       .edit(stylesheet.filePath)
       .remove(stylesheet.start, stylesheet.content.length)
-      .insertRight(stylesheet.start, this.migrate(stylesheet.content));
+      .insertRight(stylesheet.start, this.migrate(stylesheet.content, stylesheet.filePath));
   }
 
-  migrate(styles: string): string {
+  migrate(styles: string, filename: string): string {
     const processor = new postcss.Processor([
       {
         postcssPlugin: 'theming-styles-migration-plugin',
@@ -37,7 +37,12 @@ export class ThemingStylesMigration extends Migration<ComponentMigrator[], Schem
       },
     ]);
 
-    return processor.process(styles, {syntax: scss}).toString();
+    try {
+      return processor.process(styles, {syntax: scss}).toString();
+    } catch (e) {
+      console.warn(`Failed to process stylesheet: `, filename);
+      return styles;
+    }
   }
 
   atUseHandler(atRule: postcss.AtRule) {

src/material/schematics/ng-generate/mdc-migration/rules/ts-migration/runtime-migration.ts

@@ -134,7 +134,7 @@ export class RuntimeCodeMigration extends Migration<ComponentMigrator[], Schemat
     node: ts.StringLiteralLike | ts.Identifier,
     migration: TemplateMigration | ThemingStylesMigration,
   ) {
-    let migratedText = migration.migrate(node.text);
+    let migratedText = migration.migrate(node.text, node.getSourceFile().fileName);
     let migratedTextLines = migratedText.split('\n');
 
     // Update quotes based on if its multiline or not to avoid compilation errors

src/material/schematics/ng-update/migrations/legacy-components-v15/index.ts

@@ -37,7 +37,11 @@ export class LegacyComponentsMigration extends Migration<null> {
         RootExit: root => this._handleRootNode(root, stylesheet.filePath, namespace),
       },
     ]);
-    processor.process(stylesheet.content, {syntax: scss}).sync();
+    try {
+      processor.process(stylesheet.content, {syntax: scss}).sync();
+    } catch (e) {
+      console.warn(`Failed to process stylesheet: `, stylesheet.filePath);
+    }
   }
 
   /** Returns the namespace of the given at-rule if it is importing from @angular/material. */