mirror of
https://github.com/angular/angular
synced 2026-05-24 09:28:37 +00:00
fix(migrations): cf migration fix migrating empty switch default (#53237)
This should address cases when using ng-containers with ngSwitchCase / ngSwitchDefault and migrating them safely when they are empty. fixes: #53235 PR Close #53237
This commit is contained in:
parent
c9f8e75b6f
commit
fadfee4324
2 changed files with 45 additions and 2 deletions
|
|
@ -432,8 +432,12 @@ export function getMainBlock(etm: ElementToMigrate, tmpl: string, offset: number
|
|||
// removable containers are ng-templates or ng-containers that no longer need to exist
|
||||
// post migration
|
||||
if (isRemovableContainer(etm)) {
|
||||
const {childStart, childEnd} = etm.getChildSpan(offset);
|
||||
return {start: '', middle: tmpl.slice(childStart, childEnd), end: ''};
|
||||
let middle = '';
|
||||
if (etm.hasChildren()) {
|
||||
const {childStart, childEnd} = etm.getChildSpan(offset);
|
||||
middle = tmpl.slice(childStart, childEnd);
|
||||
}
|
||||
return {start: '', middle, end: ''};
|
||||
} else if (isI18nTemplate(etm, i18nAttr)) {
|
||||
// here we're removing an ng-template used for control flow and i18n and
|
||||
// converting it to an ng-container with i18n
|
||||
|
|
|
|||
|
|
@ -2391,6 +2391,45 @@ describe('control flow migration', () => {
|
|||
'template: `<div>@switch (testOpts) { @case (1) { <p>Option 1</p> } @case (2) { <p>Option 2</p> } @default { <p>Option 3</p> }}</div>');
|
||||
});
|
||||
|
||||
it('should handle empty default cases', async () => {
|
||||
writeFile('/comp.ts', `
|
||||
import {Component} from '@angular/core';
|
||||
import {ngSwitch, ngSwitchCase} from '@angular/common';
|
||||
|
||||
@Component({
|
||||
templateUrl: './comp.html'
|
||||
})
|
||||
class Comp {
|
||||
testOpts = "1";
|
||||
}
|
||||
`);
|
||||
|
||||
writeFile('/comp.html', [
|
||||
`<ng-container [ngSwitch]="type">`,
|
||||
`<ng-container *ngSwitchCase="'foo'"> Foo </ng-container>`,
|
||||
`<ng-container *ngSwitchCase="'bar'"> Bar </ng-container>`,
|
||||
`<ng-container *ngSwitchDefault></ng-container>`,
|
||||
`</ng-container>`,
|
||||
].join('\n'));
|
||||
|
||||
await runMigration();
|
||||
const actual = tree.readContent('/comp.html');
|
||||
const expected = [
|
||||
`\n@switch (type) {`,
|
||||
` @case ('foo') {`,
|
||||
` Foo`,
|
||||
` }`,
|
||||
` @case ('bar') {`,
|
||||
` Bar`,
|
||||
` }`,
|
||||
` @default {`,
|
||||
` }`,
|
||||
`}\n`,
|
||||
].join('\n');
|
||||
|
||||
expect(actual).toBe(expected);
|
||||
});
|
||||
|
||||
it('should migrate a nested class', async () => {
|
||||
writeFile(
|
||||
'/comp.ts',
|
||||
|
|
|
|||
Loading…
Reference in a new issue