fix(material/schematics): ensure test files are included in migration (#25757)

Author: mmalerba

integration/mdc-migration/golden/src/app/components/autocomplete/autocomplete.component.spec.ts

@@ -1,7 +1,7 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {ReactiveFormsModule} from '@angular/forms';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatLegacyAutocompleteModule as MatAutocompleteModule} from '@angular/material/legacy-autocomplete';
+import {MatAutocompleteModule} from '@angular/material/autocomplete';
 import {AutocompleteComponent} from './autocomplete.component';
 
 describe('AutocompleteComponent', () => {

integration/mdc-migration/golden/src/app/components/button/button.component.spec.ts

@@ -1,6 +1,6 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatLegacyButtonModule as MatButtonModule} from '@angular/material/legacy-button';
+import {MatButtonModule} from '@angular/material/button';
 import {ButtonComponent} from './button.component';
 
 describe('ButtonComponent', () => {

integration/mdc-migration/golden/src/app/components/card/card.component.spec.ts

@@ -1,6 +1,6 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatLegacyCardModule as MatCardModule} from '@angular/material/legacy-card';
+import {MatCardModule} from '@angular/material/card';
 import {CardComponent} from './card.component';
 
 describe('CardComponent', () => {

integration/mdc-migration/golden/src/app/components/checkbox/checkbox.component.spec.ts

@@ -1,6 +1,6 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatLegacyCheckboxModule as MatCheckboxModule} from '@angular/material/legacy-checkbox';
+import {MatCheckboxModule} from '@angular/material/checkbox';
 import {CheckboxComponent} from './checkbox.component';
 
 describe('CheckboxComponent', () => {

integration/mdc-migration/golden/src/app/components/chips/chips.component.spec.ts

@@ -1,7 +1,7 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatLegacyChipsModule as MatChipsModule} from '@angular/material/legacy-chips';
-import {MatLegacyFormFieldModule as MatFormFieldModule} from '@angular/material/legacy-form-field';
+import {MatChipsModule} from '@angular/material/chips';
+import {MatFormFieldModule} from '@angular/material/form-field';
 import {MatIconModule} from '@angular/material/icon';
 
 import {ChipsComponent} from './chips.component';

integration/mdc-migration/golden/src/app/components/form-field/form-field.component.spec.ts

@@ -1,7 +1,7 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatLegacyFormFieldModule as MatFormFieldModule} from '@angular/material/legacy-form-field';
-import {MatLegacyInputModule as MatInputModule} from '@angular/material/legacy-input';
+import {MatFormFieldModule} from '@angular/material/form-field';
+import {MatInputModule} from '@angular/material/input';
 import {FormFieldComponent} from './form-field.component';
 
 describe('FormFieldComponent', () => {

integration/mdc-migration/golden/src/app/components/input/input.component.spec.ts

@@ -1,6 +1,6 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatLegacyInputModule as MatInputModule} from '@angular/material/legacy-input';
+import {MatInputModule} from '@angular/material/input';
 import {InputComponent} from './input.component';
 
 describe('InputComponent', () => {

integration/mdc-migration/golden/src/app/components/list/list.component.spec.ts

@@ -1,6 +1,6 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatLegacyListModule as MatListModule} from '@angular/material/legacy-list';
+import {MatListModule} from '@angular/material/list';
 import {ListComponent} from './list.component';
 
 describe('ListComponent', () => {

integration/mdc-migration/golden/src/app/components/menu/menu.component.spec.ts

@@ -1,7 +1,7 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
 import {MatIconModule} from '@angular/material/icon';
-import {MatLegacyMenuModule as MatMenuModule} from '@angular/material/legacy-menu';
+import {MatMenuModule} from '@angular/material/menu';
 
 import {MenuComponent} from './menu.component';
 

integration/mdc-migration/golden/src/app/components/paginator/paginator.component.spec.ts

@@ -1,5 +1,5 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
-import {MatLegacyPaginatorModule as MatPaginatorModule} from '@angular/material/legacy-paginator';
+import {MatPaginatorModule} from '@angular/material/paginator';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
 import {PaginatorComponent} from './paginator.component';
 

integration/mdc-migration/golden/src/app/components/progress-bar/progress-bar.component.spec.ts

@@ -1,5 +1,5 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
-import {MatLegacyProgressBarModule as MatProgressBarModule} from '@angular/material/legacy-progress-bar';
+import {MatProgressBarModule} from '@angular/material/progress-bar';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
 import {ProgressBarComponent} from './progress-bar.component';
 

integration/mdc-migration/golden/src/app/components/progress-spinner/progress-spinner.component.spec.ts

@@ -1,6 +1,6 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatProgressSpinnerModule} from '@angular/material/legacy-progress-spinner';
+import {MatProgressSpinnerModule} from '@angular/material/progress-spinner';
 import {ProgressSpinnerComponent} from './progress-spinner.component';
 
 describe('ProgressSpinnerComponent', () => {

integration/mdc-migration/golden/src/app/components/radio/radio.component.spec.ts

@@ -1,6 +1,6 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatLegacyRadioModule as MatRadioModule} from '@angular/material/legacy-radio';
+import {MatRadioModule} from '@angular/material/radio';
 import {RadioComponent} from './radio.component';
 
 describe('RadioComponent', () => {

integration/mdc-migration/golden/src/app/components/select/select.component.spec.ts

@@ -1,6 +1,6 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatLegacySelectModule as MatSelectModule} from '@angular/material/legacy-select';
+import {MatSelectModule} from '@angular/material/select';
 import {SelectComponent} from './select.component';
 
 describe('SelectComponent', () => {

integration/mdc-migration/golden/src/app/components/slide-toggle/slide-toggle.component.spec.ts

@@ -1,6 +1,6 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatSlideToggleModule} from '@angular/material/legacy-slide-toggle';
+import {MatSlideToggleModule} from '@angular/material/slide-toggle';
 import {SlideToggleComponent} from './slide-toggle.component';
 
 describe('SlideToggleComponent', () => {

integration/mdc-migration/golden/src/app/components/slider/slider.component.spec.ts

@@ -1,6 +1,6 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatLegacySliderModule as MatSliderModule} from '@angular/material/legacy-slider';
+import {MatSliderModule} from '@angular/material/slider';
 import {SliderComponent} from './slider.component';
 
 describe('SliderComponent', () => {

integration/mdc-migration/golden/src/app/components/table/table.component.spec.ts

@@ -1,6 +1,6 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatTableModule} from '@angular/material/legacy-table';
+import {MatTableModule} from '@angular/material/table';
 import {TableComponent} from './table.component';
 
 describe('TableComponent', () => {

integration/mdc-migration/golden/src/app/components/tabs/tabs.component.spec.ts

@@ -1,6 +1,6 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatTabsModule} from '@angular/material/legacy-tabs';
+import {MatTabsModule} from '@angular/material/tabs';
 import {TabsComponent} from './tabs.component';
 
 describe('TabsComponent', () => {

integration/mdc-migration/golden/src/app/components/tooltip/tooltip.component.spec.ts

@@ -1,6 +1,6 @@
 import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MatLegacyTooltipModule as MatTooltipModule} from '@angular/material/legacy-tooltip';
+import {MatTooltipModule} from '@angular/material/tooltip';
 import {TooltipComponent} from './tooltip.component';
 
 describe('TooltipComponent', () => {

integration/mdc-migration/migration-test.bzl

@@ -31,7 +31,7 @@ def migration_test(name, srcs, approve):
             # See: https://github.com/yarnpkg/yarn/issues/2165.
             # TODO(devversion): determine if a solution/workaround could live in the test runner.
             "yarn install --cache-folder .yarn_cache_folder/",
-            "yarn ng generate @angular/material:mdc-migration --components all --tsconfig tsconfig.app.json",
+            "yarn ng generate @angular/material:mdc-migration --components all",
             # TODO(amysorto): add back once MDC components are in @angular/material
             # "yarn test",
             " ".join([

src/cdk/schematics/utils/index.ts

@@ -16,4 +16,5 @@ export * from './project-index-file';
 export * from './project-main-file';
 export * from './project-style-file';
 export * from './project-targets';
+export * from './project-tsconfig-paths';
 export * from './schematic-options';

src/material/schematics/ng-generate/mdc-migration/index.ts

@@ -7,14 +7,20 @@
  */
 
 import {ComponentMigrator, MIGRATORS} from './rules';
-import {DevkitFileSystem, UpdateProject, findStylesheetFiles} from '@angular/cdk/schematics';
+import {
+  DevkitFileSystem,
+  UpdateProject,
+  findStylesheetFiles,
+  WorkspacePath,
+  getWorkspaceConfigGracefully,
+  getTargetTsconfigPath,
+} from '@angular/cdk/schematics';
 import {Rule, SchematicContext, Tree} from '@angular-devkit/schematics';
 
 import {RuntimeCodeMigration} from './rules/ts-migration/runtime-migration';
 import {Schema} from './schema';
 import {TemplateMigration} from './rules/template-migration';
 import {ThemingStylesMigration} from './rules/theming-styles';
-import {dirname} from 'path';
 
 /** Groups of components that must be migrated together. */
 const migrationGroups = [
@@ -55,48 +61,86 @@ function getComponentsToMigrate(requested: string[]): Set<string> {
   return componentsToMigrate;
 }
 
-export default function (options: Schema): Rule {
-  const componentsToMigrate = getComponentsToMigrate(options.components);
-  const tsconfigPath = options.tsconfig;
-  const migrationDir = options.directory ?? dirname(tsconfigPath);
-
-  console.log('Migrating:', [...componentsToMigrate]);
-  console.log('Directory:', migrationDir);
+function runMigrations(
+  context: SchematicContext,
+  fileSystem: DevkitFileSystem,
+  tsconfigPath: WorkspacePath,
+  migrators: ComponentMigrator[],
+  analyzedFiles: Set<WorkspacePath>,
+  additionalStylesheetPaths: string[],
+): boolean {
+  const program = UpdateProject.createProgramFromTsconfig(tsconfigPath, fileSystem);
+  const project = new UpdateProject(context, program, fileSystem, analyzedFiles, context.logger);
+  return !project.migrate(
+    [ThemingStylesMigration, TemplateMigration, RuntimeCodeMigration],
+    null,
+    migrators,
+    additionalStylesheetPaths,
+  ).hasFailures;
+}
 
-  const migrators: ComponentMigrator[] = [];
-  for (let i = 0; i < MIGRATORS.length; i++) {
-    if (componentsToMigrate.has(MIGRATORS[i].component)) {
-      migrators.push(MIGRATORS[i]);
+export default function (options: Schema): Rule {
+  return async (tree: Tree, context: SchematicContext) => {
+    const logger = context.logger;
+    const workspace = await getWorkspaceConfigGracefully(tree);
+    if (workspace === null) {
+      logger.error('Could not find workspace configuration file.');
+      return;
     }
-  }
 
-  return (tree: Tree, context: SchematicContext) => {
+    const projectNames = workspace.projects.keys();
     const fileSystem = new DevkitFileSystem(tree);
-    const program = UpdateProject.createProgramFromTsconfig(
-      fileSystem.resolve(tsconfigPath),
-      fileSystem,
-    );
+    const analyzedFiles = new Set<WorkspacePath>();
+    const componentsToMigrate = getComponentsToMigrate(options.components);
+    const migrators = MIGRATORS.filter(m => componentsToMigrate.has(m.component));
+    let additionalStylesheetPaths = options.directory
+      ? findStylesheetFiles(tree, options.directory)
+      : [];
+    let success = true;
 
-    const additionalStylesheetPaths = findStylesheetFiles(tree, migrationDir);
-    const project = new UpdateProject(context, program, fileSystem, new Set(), context.logger);
-    const {hasFailures} = project.migrate(
-      [ThemingStylesMigration, TemplateMigration, RuntimeCodeMigration],
-      null,
-      migrators,
-      additionalStylesheetPaths,
-    );
+    logger.info(`Migrating components:\n${[...componentsToMigrate].join('\n')}`);
+
+    for (const projectName of projectNames) {
+      const project = workspace.projects.get(projectName)!;
+      const tsconfigPaths = [
+        getTargetTsconfigPath(project, 'build'),
+        getTargetTsconfigPath(project, 'test'),
+      ].filter((p): p is WorkspacePath => !!p);
+
+      if (!tsconfigPaths.length) {
+        logger.warn(
+          `Skipping migration for project ${projectName}. Unable to determine 'tsconfig.json' file in workspace config.`,
+        );
+        continue;
+      }
+
+      if (!options.directory) {
+        additionalStylesheetPaths = findStylesheetFiles(tree, project.root);
+      }
+
+      logger.info(`Migrating project: ${projectName}`);
+
+      for (const tsconfigPath of tsconfigPaths) {
+        success &&= runMigrations(
+          context,
+          fileSystem,
+          tsconfigPath,
+          migrators,
+          analyzedFiles,
+          additionalStylesheetPaths,
+        );
+      }
+    }
 
     // Commit all recorded edits in the update recorder. We apply the edits after all
     // migrations ran because otherwise offsets in the TypeScript program would be
     // shifted and individual migrations could no longer update the same source file.
     fileSystem.commitEdits();
 
-    if (hasFailures) {
-      context.logger.error('Unable to migrate project. See errors above.');
+    if (!success) {
+      logger.error('Unable to migrate project. See errors above.');
     } else {
-      context.logger.info('Successfully migrated the project.');
+      logger.info('Successfully migrated the project.');
     }
-
-    return tree;
   };
 }

src/material/schematics/ng-generate/mdc-migration/schema.d.ts

@@ -7,10 +7,6 @@
  */
 
 export interface Schema {
-  /**
-   * Workspace-relative path to the TypeScript project that should be migrated.
-   */
-  tsconfig: string;
   /**
    * Workspace-relative path to a directory which will be migrated.
    *

src/material/schematics/ng-generate/mdc-migration/schema.json

@@ -4,11 +4,6 @@
   "title": "Material MDC Migration Schema",
   "type": "object",
   "properties": {
-    "tsconfig": {
-      "type": "string",
-      "format": "path",
-      "description": "Workspace-relative path to the TypeScript project that should be migrated."
-    },
     "directory": {
       "type": "string",
       "format": "path",