refactor(migrations): Add optional path param for control flow migration (angular#52403)

This adds the option to pass in a path to the control flow migration in order to run the migration against one single file.

PR Close angular#52403

Author: thePunderWoman

packages/core/schematics/ng-generate/control-flow-migration/README.md

@@ -3,7 +3,10 @@
 Angular v17 introduces a new control flow syntax. This migration replaces the
 existing usages of `*ngIf`, `*ngFor`, and `*ngSwitch` to their equivalent block
 syntax. Existing ng-templates are preserved in case they are used elsewhere in
-the template.
+the template. It has the following option:
+
+* `path` - Relative path within the project that the migration should apply to. Can be used to
+migrate specific sub-directories individually. Defaults to the project root.
 
 NOTE: This is a developer preview migration
 

packages/core/schematics/ng-generate/control-flow-migration/index.ts

@@ -7,19 +7,25 @@
  */
 
 import {Rule, SchematicContext, SchematicsException, Tree} from '@angular-devkit/schematics';
-import {relative} from 'path';
+import {join, relative} from 'path';
 
+import {normalizePath} from '../../utils/change_tracker';
 import {getProjectTsConfigPaths} from '../../utils/project_tsconfig_paths';
 import {canMigrateFile, createMigrationProgram} from '../../utils/typescript/compiler_host';
 
 import {AnalyzedFile, MigrateError} from './types';
 import {analyze, migrateTemplate} from './util';
 
-export default function(): Rule {
+interface Options {
+  path: string;
+}
+
+export default function(options: Options): Rule {
   return async (tree: Tree, context: SchematicContext) => {
     const {buildPaths, testPaths} = await getProjectTsConfigPaths(tree);
     const basePath = process.cwd();
-    const allPaths = [...buildPaths, ...testPaths];
+    const pathToMigrate = normalizePath(join(basePath, options.path));
+    const allPaths = options.path !== './' ? [...buildPaths, ...testPaths] : [pathToMigrate];
 
     if (!allPaths.length) {
       throw new SchematicsException(
@@ -30,7 +36,8 @@ export default function(): Rule {
     let errors: string[] = [];
 
     for (const tsconfigPath of allPaths) {
-      const migrateErrors = runControlFlowMigration(tree, tsconfigPath, basePath);
+      const migrateErrors =
+          runControlFlowMigration(tree, tsconfigPath, basePath, pathToMigrate, options);
       errors = [...errors, ...migrateErrors];
     }
 
@@ -43,10 +50,24 @@ export default function(): Rule {
   };
 }
 
-function runControlFlowMigration(tree: Tree, tsconfigPath: string, basePath: string): string[] {
+function runControlFlowMigration(
+    tree: Tree, tsconfigPath: string, basePath: string, pathToMigrate: string,
+    schematicOptions: Options): string[] {
+  if (schematicOptions.path.startsWith('..')) {
+    throw new SchematicsException(
+        'Cannot run control flow migration outside of the current project.');
+  }
+
   const program = createMigrationProgram(tree, tsconfigPath, basePath);
-  const sourceFiles =
-      program.getSourceFiles().filter(sourceFile => canMigrateFile(basePath, sourceFile, program));
+  const sourceFiles = program.getSourceFiles().filter(
+      sourceFile => sourceFile.fileName.startsWith(pathToMigrate) &&
+          canMigrateFile(basePath, sourceFile, program));
+
+  if (sourceFiles.length === 0) {
+    throw new SchematicsException(`Could not find any files to migrate under the path ${
+        pathToMigrate}. Cannot run the control flow migration.`);
+  }
+
   const analysis = new Map<string, AnalyzedFile>();
   const migrateErrors = new Map<string, MigrateError[]>();
 

packages/core/schematics/ng-generate/control-flow-migration/schema.json

@@ -3,5 +3,12 @@
   "$id": "AngularControlFlowMigration",
   "title": "Angular Control Flow Migration Schema",
   "type": "object",
-  "properties": {}
-}
+  "properties": {
+    "path": {
+      "type": "string",
+      "description": "Path relative to the project root which should be migrated",
+      "x-prompt": "Which path in your project should be migrated?",
+      "default": "./"
+    }
+  }
+}

packages/core/schematics/test/control_flow_migration_spec.ts

@@ -26,8 +26,8 @@ describe('control flow migration', () => {
     host.sync.write(normalize(filePath), virtualFs.stringToFileBuffer(contents));
   }
 
-  function runMigration() {
-    return runner.runSchematic('control-flow-migration', {}, tree);
+  function runMigration(path: string|undefined = undefined) {
+    return runner.runSchematic('control-flow-migration', {path}, tree);
   }
 
   beforeEach(() => {
@@ -64,6 +64,85 @@ describe('control flow migration', () => {
     shx.rm('-r', tmpDirPath);
   });
 
+  describe('path', () => {
+    it('should throw an error if no files match the passed-in path', async () => {
+      let error: string|null = null;
+
+      writeFile('dir.ts', `
+        import {Directive} from '@angular/core';
+
+        @Directive({selector: '[dir]'})
+        export class MyDir {}
+      `);
+
+      try {
+        await runMigration('./foo');
+      } catch (e: any) {
+        error = e.message;
+      }
+
+      expect(error).toMatch(
+          /Could not find any files to migrate under the path .*\/foo\. Cannot run the control flow migration/);
+    });
+
+    it('should throw an error if a path outside of the project is passed in', async () => {
+      let error: string|null = null;
+
+      writeFile('dir.ts', `
+        import {Directive} from '@angular/core';
+
+        @Directive({selector: '[dir]'})
+        export class MyDir {}
+      `);
+
+      try {
+        await runMigration('../foo');
+      } catch (e: any) {
+        error = e.message;
+      }
+
+      expect(error).toBe('Cannot run control flow migration outside of the current project.');
+    });
+
+    it('should only migrate the paths that were passed in', async () => {
+      let error: string|null = null;
+
+      writeFile('comp.ts', `
+        import {Component} from '@angular/core';
+        import {NgIf} from '@angular/common';
+
+        @Component({
+          imports: [NgIf],
+          template: \`<div><span *ngIf="toggle">This should be hidden</span></div>\`
+        })
+        class Comp {
+          toggle = false;
+        }
+      `);
+
+      writeFile('skip.ts', `
+        import {Component} from '@angular/core';
+        import {NgIf} from '@angular/common';
+
+        @Component({
+          imports: [NgIf],
+          template: \`<div *ngIf="show">Show me</div>\`
+        })
+        class Comp {
+          show = false;
+        }
+      `);
+
+      await runMigration('./comp.ts');
+      const migratedContent = tree.readContent('/comp.ts');
+      const skippedContent = tree.readContent('/skip.ts');
+
+      expect(migratedContent)
+          .toContain('template: `<div>@if (toggle) {<span>This should be hidden</span>}</div>`');
+      expect(skippedContent).toContain('template: `<div *ngIf="show">Show me</div>`');
+    });
+  });
+
   describe('ngIf', () => {
     it('should migrate an inline template', async () => {
       writeFile('/comp.ts', `