From c01af4302f83b666cb8cb45ed29d8a6df0321603 Mon Sep 17 00:00:00 2001 From: Jessica Janiuk Date: Thu, 9 Nov 2023 15:51:10 -0500 Subject: [PATCH] refactor(migrations): code clean up and add comments on exported functions (#52755) This cleans up a bit of code to make maintenance easier. It also adds comments for all the exported methods so they are clear to anyone in the future. PR Close #52755 --- .../ng-generate/control-flow-migration/ifs.ts | 2 +- .../control-flow-migration/index.ts | 18 ++--------- .../control-flow-migration/migration.ts | 31 +++++++++++++++++++ .../control-flow-migration/types.ts | 3 ++ .../control-flow-migration/util.ts | 22 +++++++++++++ 5 files changed, 60 insertions(+), 16 deletions(-) create mode 100644 packages/core/schematics/ng-generate/control-flow-migration/migration.ts diff --git a/packages/core/schematics/ng-generate/control-flow-migration/ifs.ts b/packages/core/schematics/ng-generate/control-flow-migration/ifs.ts index 8b5ffd27b3d..49ed4af7b51 100644 --- a/packages/core/schematics/ng-generate/control-flow-migration/ifs.ts +++ b/packages/core/schematics/ng-generate/control-flow-migration/ifs.ts @@ -64,7 +64,7 @@ export function migrateIf(template: string): {migrated: string, errors: MigrateE return {migrated: result, errors}; } -export function migrateNgIf(etm: ElementToMigrate, tmpl: string, offset: number): Result { +function migrateNgIf(etm: ElementToMigrate, tmpl: string, offset: number): Result { const matchThen = etm.attr.value.match(/;\s*then/gm); const matchElse = etm.attr.value.match(/;\s*else/gm); diff --git a/packages/core/schematics/ng-generate/control-flow-migration/index.ts b/packages/core/schematics/ng-generate/control-flow-migration/index.ts index cf20669cb39..f5664072185 100644 --- a/packages/core/schematics/ng-generate/control-flow-migration/index.ts +++ b/packages/core/schematics/ng-generate/control-flow-migration/index.ts @@ -13,11 +13,9 @@ import {normalizePath} from '../../utils/change_tracker'; import {getProjectTsConfigPaths} from '../../utils/project_tsconfig_paths'; import {canMigrateFile, createMigrationProgram} from '../../utils/typescript/compiler_host'; -import {migrateFor} from './fors'; -import {migrateIf} from './ifs'; -import {migrateSwitch} from './switches'; +import {migrateTemplate} from './migration'; import {AnalyzedFile, MigrateError} from './types'; -import {analyze, processNgTemplates} from './util'; +import {analyze} from './util'; interface Options { path: string; @@ -88,17 +86,7 @@ function runControlFlowMigration( const template = content.slice(start, end); const length = (end ?? content.length) - start; - const ifResult = migrateIf(template); - const forResult = migrateFor(ifResult.migrated); - const switchResult = migrateSwitch(forResult.migrated); - - const errors = [ - ...ifResult.errors, - ...forResult.errors, - ...switchResult.errors, - ]; - - const migrated = processNgTemplates(switchResult.migrated); + const {migrated, errors} = migrateTemplate(template); if (migrated !== null) { update.remove(start, length); diff --git a/packages/core/schematics/ng-generate/control-flow-migration/migration.ts b/packages/core/schematics/ng-generate/control-flow-migration/migration.ts new file mode 100644 index 00000000000..3d8568015bd --- /dev/null +++ b/packages/core/schematics/ng-generate/control-flow-migration/migration.ts @@ -0,0 +1,31 @@ +/** + * @license + * Copyright Google LLC All Rights Reserved. + * + * Use of this source code is governed by an MIT-style license that can be + * found in the LICENSE file at https://angular.io/license + */ + +import {migrateFor} from './fors'; +import {migrateIf} from './ifs'; +import {migrateSwitch} from './switches'; +import {MigrateError} from './types'; +import {processNgTemplates} from './util'; + +/** + * Actually migrates a given template to the new syntax + */ +export function migrateTemplate(template: string): {migrated: string, errors: MigrateError[]} { + const ifResult = migrateIf(template); + const forResult = migrateFor(ifResult.migrated); + const switchResult = migrateSwitch(forResult.migrated); + + const migrated = processNgTemplates(switchResult.migrated); + + const errors = [ + ...ifResult.errors, + ...forResult.errors, + ...switchResult.errors, + ]; + return {migrated, errors}; +} diff --git a/packages/core/schematics/ng-generate/control-flow-migration/types.ts b/packages/core/schematics/ng-generate/control-flow-migration/types.ts index adfaa76cb0f..2c9c01cad7f 100644 --- a/packages/core/schematics/ng-generate/control-flow-migration/types.ts +++ b/packages/core/schematics/ng-generate/control-flow-migration/types.ts @@ -75,6 +75,9 @@ export class ElementToMigrate { } } +/** + * Represents an ng-template inside a template being migrated to new control flow + */ export class Template { el: Element; count: number = 0; diff --git a/packages/core/schematics/ng-generate/control-flow-migration/util.ts b/packages/core/schematics/ng-generate/control-flow-migration/util.ts index d612c43817b..a8c1d2b42d4 100644 --- a/packages/core/schematics/ng-generate/control-flow-migration/util.ts +++ b/packages/core/schematics/ng-generate/control-flow-migration/util.ts @@ -82,6 +82,9 @@ function getNestedCount(etm: ElementToMigrate, aggregator: number[]) { } } +/** + * parses the template string into the Html AST + */ export function parseTemplate(template: string): ParseTreeResult|null { let parsed: ParseTreeResult; try { @@ -108,6 +111,9 @@ export function parseTemplate(template: string): ParseTreeResult|null { return parsed; } +/** + * calculates the level of nesting of the items in the collector + */ export function calculateNesting( visitor: ElementCollector|TemplateCollector, hasLineBreaks: boolean): void { // start from top of template @@ -133,10 +139,16 @@ function escapeRegExp(val: string) { return val.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); // $& means the whole matched string } +/** + * determines if a given template string contains line breaks + */ export function hasLineBreaks(template: string): boolean { return /\r|\n/.test(template); } +/** + * properly adjusts template offsets based on current nesting levels + */ export function reduceNestingOffset( el: ElementToMigrate, nestLevel: number, offset: number, postOffsets: number[]): number { if (el.nestCount <= nestLevel) { @@ -178,6 +190,9 @@ function wrapIntoI18nContainer(i18nAttr: Attribute, content: string) { return `${content}`; } +/** + * Counts, replaces, and removes any necessary ng-templates post control flow migration + */ export function processNgTemplates(template: string): string { // count usage const templates = countTemplateUsage(template); @@ -201,6 +216,10 @@ export function processNgTemplates(template: string): string { return template; } +/** + * retrieves the original block of text in the template for length comparison during migration + * processing + */ export function getOriginals( etm: ElementToMigrate, tmpl: string, offset: number): {start: string, end: string} { // original opening block @@ -221,6 +240,9 @@ export function getOriginals( return {start, end: ''}; } +/** + * builds the proper contents of what goes inside a given control flow block after migration + */ export function getMainBlock(etm: ElementToMigrate, tmpl: string, offset: number): {start: string, middle: string, end: string} { const i18nAttr = etm.el.attrs.find(x => x.name === 'i18n');