mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
refactor(forms): Temporarily disable the typed forms migration. (#44828)
It's best to disable this optional migration in the minor release, although it shouldn't run anyway -- we don't want people accidentally running it. This PR will be rolled back after the minor is out. PR Close #44828
This commit is contained in:
Dylan Hunn
committed by
Andrew Kushnir
Andrew Kushnir
parent
fe3e4d6865
commit
a38ae0aefa
@@ -19,11 +19,6 @@
|
||||
"version": "14.0.0-beta",
|
||||
"description": "As of Angular version 13, `entryComponents` are no longer necessary.",
|
||||
"factory": "./migrations/entry-components/index"
|
||||
},
|
||||
"migration-v14-typed-forms": {
|
||||
"version": "9999.0.0",
|
||||
"description": "Experimental migration that adds <any>s for Typed Forms.",
|
||||
"factory": "./migrations/typed-forms/index"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -80,208 +80,214 @@ describe('Typed Forms migration', () => {
|
||||
shx.rm('-r', tmpDirPath);
|
||||
});
|
||||
|
||||
describe(`should add ${anySymbolName} to constructors`, () => {
|
||||
it('for FormControl', async () => {
|
||||
writeFile('/index.ts', `
|
||||
import { FormControl } from '@angular/forms';
|
||||
@Component({template: ''})
|
||||
export class MyComp {
|
||||
const fc1 = new FormControl();
|
||||
new FormControl(42);
|
||||
constructor() {}
|
||||
}
|
||||
`);
|
||||
await runMigration();
|
||||
expect(tree.readContent('/index.ts'))
|
||||
.toContain(`const fc1 = new FormControl<${anySymbolName}>();`);
|
||||
expect(tree.readContent('/index.ts')).toContain(`new FormControl<${anySymbolName}>(42);`);
|
||||
});
|
||||
// These tests are disabled because the migration is removed from migration.json, and cannot be
|
||||
// run.
|
||||
|
||||
it('for FormGroup', async () => {
|
||||
writeFile('/index.ts', `
|
||||
import { FormGroup } from '@angular/forms';
|
||||
@Component({template: ''})
|
||||
export class MyComp {
|
||||
const fg = new FormGroup({foo: 3});
|
||||
constructor() {}
|
||||
}
|
||||
`);
|
||||
await runMigration();
|
||||
expect(tree.readContent('/index.ts'))
|
||||
.toContain(`const fg = new FormGroup<${anySymbolName}>({foo: 3});`);
|
||||
});
|
||||
// describe(`should add ${anySymbolName} to constructors`, () => {
|
||||
// it('for FormControl', async () => {
|
||||
// writeFile('/index.ts', `
|
||||
// import { FormControl } from '@angular/forms';
|
||||
// @Component({template: ''})
|
||||
// export class MyComp {
|
||||
// const fc1 = new FormControl();
|
||||
// new FormControl(42);
|
||||
// constructor() {}
|
||||
// }
|
||||
// `);
|
||||
// await runMigration();
|
||||
// expect(tree.readContent('/index.ts'))
|
||||
// .toContain(`const fc1 = new FormControl<${anySymbolName}>();`);
|
||||
// expect(tree.readContent('/index.ts')).toContain(`new FormControl<${anySymbolName}>(42);`);
|
||||
// });
|
||||
|
||||
it('for FormArray', async () => {
|
||||
writeFile('/index.ts', `
|
||||
import { FormArray } from '@angular/forms';
|
||||
@Component({template: ''})
|
||||
export class MyComp {
|
||||
const fa = new FormArray([null]);
|
||||
constructor() {}
|
||||
}
|
||||
`);
|
||||
await runMigration();
|
||||
expect(tree.readContent('/index.ts'))
|
||||
.toContain(`const fa = new FormArray<${anySymbolName}[]>([null]);`);
|
||||
});
|
||||
// it('for FormGroup', async () => {
|
||||
// writeFile('/index.ts', `
|
||||
// import { FormGroup } from '@angular/forms';
|
||||
// @Component({template: ''})
|
||||
// export class MyComp {
|
||||
// const fg = new FormGroup({foo: 3});
|
||||
// constructor() {}
|
||||
// }
|
||||
// `);
|
||||
// await runMigration();
|
||||
// expect(tree.readContent('/index.ts'))
|
||||
// .toContain(`const fg = new FormGroup<${anySymbolName}>({foo: 3});`);
|
||||
// });
|
||||
|
||||
it('for FormControl with a qualified import', async () => {
|
||||
writeFile('/index.ts', `
|
||||
import { FormControl as FC } from '@angular/forms';
|
||||
@Component({template: ''})
|
||||
export class MyComp {
|
||||
const fc = new FC({foo: 3});
|
||||
constructor() {}
|
||||
}
|
||||
`);
|
||||
await runMigration();
|
||||
expect(tree.readContent('/index.ts'))
|
||||
.toContain(`const fc = new FC<${anySymbolName}>({foo: 3});`);
|
||||
});
|
||||
// it('for FormArray', async () => {
|
||||
// writeFile('/index.ts', `
|
||||
// import { FormArray } from '@angular/forms';
|
||||
// @Component({template: ''})
|
||||
// export class MyComp {
|
||||
// const fa = new FormArray([null]);
|
||||
// constructor() {}
|
||||
// }
|
||||
// `);
|
||||
// await runMigration();
|
||||
// expect(tree.readContent('/index.ts'))
|
||||
// .toContain(`const fa = new FormArray<${anySymbolName}[]>([null]);`);
|
||||
// });
|
||||
|
||||
it('for FormArray with a qualified import', async () => {
|
||||
writeFile('/index.ts', `
|
||||
import { FormArray as FA } from '@angular/forms';
|
||||
@Component({template: ''})
|
||||
export class MyComp {
|
||||
const fa = new FA([null]);
|
||||
constructor() {}
|
||||
}
|
||||
`);
|
||||
await runMigration();
|
||||
expect(tree.readContent('/index.ts'))
|
||||
.toContain(`const fa = new FA<${anySymbolName}[]>([null]);`);
|
||||
});
|
||||
// it('for FormControl with a qualified import', async () => {
|
||||
// writeFile('/index.ts', `
|
||||
// import { FormControl as FC } from '@angular/forms';
|
||||
// @Component({template: ''})
|
||||
// export class MyComp {
|
||||
// const fc = new FC({foo: 3});
|
||||
// constructor() {}
|
||||
// }
|
||||
// `);
|
||||
// await runMigration();
|
||||
// expect(tree.readContent('/index.ts'))
|
||||
// .toContain(`const fc = new FC<${anySymbolName}>({foo: 3});`);
|
||||
// });
|
||||
|
||||
it('but not for controls that already have type arguments', async () => {
|
||||
writeFile('/index.ts', `
|
||||
import { FormControl } from '@angular/forms';
|
||||
@Component({template: ''})
|
||||
export class MyComp {
|
||||
const fc1 = new FormControl<${anySymbolName}>();
|
||||
constructor() {}
|
||||
}
|
||||
`);
|
||||
await runMigration();
|
||||
expect(tree.readContent('/index.ts'))
|
||||
.toContain(`const fc1 = new FormControl<${anySymbolName}>();`);
|
||||
});
|
||||
});
|
||||
// it('for FormArray with a qualified import', async () => {
|
||||
// writeFile('/index.ts', `
|
||||
// import { FormArray as FA } from '@angular/forms';
|
||||
// @Component({template: ''})
|
||||
// export class MyComp {
|
||||
// const fa = new FA([null]);
|
||||
// constructor() {}
|
||||
// }
|
||||
// `);
|
||||
// await runMigration();
|
||||
// expect(tree.readContent('/index.ts'))
|
||||
// .toContain(`const fa = new FA<${anySymbolName}[]>([null]);`);
|
||||
// });
|
||||
|
||||
describe(`should add ${anySymbolName} to FormBuilder method`, () => {
|
||||
it('control', async () => {
|
||||
writeFile('/index.ts', `
|
||||
import { FormBuilder } from '@angular/forms';
|
||||
@Component({template: ''})
|
||||
export class MyComp {
|
||||
constructor() {
|
||||
const fb = new FormBuilder();
|
||||
const fc = fb.control(43);
|
||||
const fd = new FormBuilder().control(42);
|
||||
}
|
||||
}
|
||||
`);
|
||||
await runMigration();
|
||||
expect(tree.readContent('/index.ts')).toContain(`.control<${anySymbolName}>(43);`);
|
||||
expect(tree.readContent('/index.ts'))
|
||||
.toContain(`const fd = new FormBuilder().control<${anySymbolName}>(42)`);
|
||||
});
|
||||
// it('but not for controls that already have type arguments', async () => {
|
||||
// writeFile('/index.ts', `
|
||||
// import { FormControl } from '@angular/forms';
|
||||
// @Component({template: ''})
|
||||
// export class MyComp {
|
||||
// const fc1 = new FormControl<${anySymbolName}>();
|
||||
// constructor() {}
|
||||
// }
|
||||
// `);
|
||||
// await runMigration();
|
||||
// expect(tree.readContent('/index.ts'))
|
||||
// .toContain(`const fc1 = new FormControl<${anySymbolName}>();`);
|
||||
// });
|
||||
// });
|
||||
|
||||
it('group', async () => {
|
||||
writeFile('/index.ts', `
|
||||
import { FormBuilder } from '@angular/forms';
|
||||
@Component({template: ''})
|
||||
export class MyComp {
|
||||
constructor() {
|
||||
const fb = new FormBuilder();
|
||||
const fc = fb.group({});
|
||||
const fd = new FormBuilder().group({});
|
||||
}
|
||||
}
|
||||
`);
|
||||
await runMigration();
|
||||
expect(tree.readContent('/index.ts')).toContain(`fb.group<${anySymbolName}>({});`);
|
||||
expect(tree.readContent('/index.ts'))
|
||||
.toContain(`const fd = new FormBuilder().group<${anySymbolName}>({})`);
|
||||
});
|
||||
// describe(`should add ${anySymbolName} to FormBuilder method`, () => {
|
||||
// it('control', async () => {
|
||||
// writeFile('/index.ts', `
|
||||
// import { FormBuilder } from '@angular/forms';
|
||||
// @Component({template: ''})
|
||||
// export class MyComp {
|
||||
// constructor() {
|
||||
// const fb = new FormBuilder();
|
||||
// const fc = fb.control(43);
|
||||
// const fd = new FormBuilder().control(42);
|
||||
// }
|
||||
// }
|
||||
// `);
|
||||
// await runMigration();
|
||||
// expect(tree.readContent('/index.ts')).toContain(`.control<${anySymbolName}>(43);`);
|
||||
// expect(tree.readContent('/index.ts'))
|
||||
// .toContain(`const fd = new FormBuilder().control<${anySymbolName}>(42)`);
|
||||
// });
|
||||
|
||||
it('array', async () => {
|
||||
writeFile('/index.ts', `
|
||||
import { FormBuilder } from '@angular/forms';
|
||||
@Component({template: ''})
|
||||
export class MyComp {
|
||||
constructor() {
|
||||
const fb = new FormBuilder();
|
||||
const fc = fb.array([0]);
|
||||
const fd = new FormBuilder().array([0]);
|
||||
}
|
||||
}
|
||||
`);
|
||||
await runMigration();
|
||||
expect(tree.readContent('/index.ts')).toContain(`fb.array<${anySymbolName}[]>([0]);`);
|
||||
expect(tree.readContent('/index.ts'))
|
||||
.toContain(`const fd = new FormBuilder().array<${anySymbolName}[]>([0])`);
|
||||
});
|
||||
});
|
||||
// it('group', async () => {
|
||||
// writeFile('/index.ts', `
|
||||
// import { FormBuilder } from '@angular/forms';
|
||||
// @Component({template: ''})
|
||||
// export class MyComp {
|
||||
// constructor() {
|
||||
// const fb = new FormBuilder();
|
||||
// const fc = fb.group({});
|
||||
// const fd = new FormBuilder().group({});
|
||||
// }
|
||||
// }
|
||||
// `);
|
||||
// await runMigration();
|
||||
// expect(tree.readContent('/index.ts')).toContain(`fb.group<${anySymbolName}>({});`);
|
||||
// expect(tree.readContent('/index.ts'))
|
||||
// .toContain(`const fd = new FormBuilder().group<${anySymbolName}>({})`);
|
||||
// });
|
||||
|
||||
describe('should add import', () => {
|
||||
it('any when not already imported', async () => {
|
||||
writeFile('/index.ts', `
|
||||
import { FormBuilder } from '@angular/forms';
|
||||
@Component({template: ''})
|
||||
export class MyComp { }
|
||||
`);
|
||||
await runMigration();
|
||||
expect(tree.readContent('/index.ts'))
|
||||
.toContain(`import { ${anySymbolName}, FormBuilder } from '@angular/forms';`);
|
||||
});
|
||||
// it('array', async () => {
|
||||
// writeFile('/index.ts', `
|
||||
// import { FormBuilder } from '@angular/forms';
|
||||
// @Component({template: ''})
|
||||
// export class MyComp {
|
||||
// constructor() {
|
||||
// const fb = new FormBuilder();
|
||||
// const fc = fb.array([0]);
|
||||
// const fd = new FormBuilder().array([0]);
|
||||
// }
|
||||
// }
|
||||
// `);
|
||||
// await runMigration();
|
||||
// expect(tree.readContent('/index.ts')).toContain(`fb.array<${anySymbolName}[]>([0]);`);
|
||||
// expect(tree.readContent('/index.ts'))
|
||||
// .toContain(`const fd = new FormBuilder().array<${anySymbolName}[]>([0])`);
|
||||
// });
|
||||
// });
|
||||
|
||||
it('exclusively when not already imported', async () => {
|
||||
writeFile('/index.ts', `
|
||||
import { ${anySymbolName}, FormBuilder } from '@angular/forms';
|
||||
@Component({template: ''})
|
||||
export class MyComp { }
|
||||
`);
|
||||
await runMigration();
|
||||
expect(tree.readContent('/index.ts'))
|
||||
.toContain(`import { ${anySymbolName}, FormBuilder } from '@angular/forms';`);
|
||||
});
|
||||
});
|
||||
// describe('should add import', () => {
|
||||
// it('any when not already imported', async () => {
|
||||
// writeFile('/index.ts', `
|
||||
// import { FormBuilder } from '@angular/forms';
|
||||
// @Component({template: ''})
|
||||
// export class MyComp { }
|
||||
// `);
|
||||
// await runMigration();
|
||||
// expect(tree.readContent('/index.ts'))
|
||||
// .toContain(`import { ${anySymbolName}, FormBuilder } from '@angular/forms';`);
|
||||
// });
|
||||
|
||||
describe('should handle', () => {
|
||||
it('an integrated example', async () => {
|
||||
writeFile('/index.ts', `
|
||||
import { Component } from '@angular/core';
|
||||
import { AbstractControl, FormArray, FormBuilder, FormControl as FC, FormGroup } from '@angular/forms';
|
||||
// it('exclusively when not already imported', async () => {
|
||||
// writeFile('/index.ts', `
|
||||
// import { ${anySymbolName}, FormBuilder } from '@angular/forms';
|
||||
// @Component({template: ''})
|
||||
// export class MyComp { }
|
||||
// `);
|
||||
// await runMigration();
|
||||
// expect(tree.readContent('/index.ts'))
|
||||
// .toContain(`import { ${anySymbolName}, FormBuilder } from '@angular/forms';`);
|
||||
// });
|
||||
// });
|
||||
|
||||
@Component({template: ''})
|
||||
export class MyComponent {
|
||||
private _control = new FC(42);
|
||||
private _group = new FormGroup({});
|
||||
private _array = new FormArray([]);
|
||||
// describe('should handle', () => {
|
||||
// it('an integrated example', async () => {
|
||||
// writeFile('/index.ts', `
|
||||
// import { Component } from '@angular/core';
|
||||
// import { AbstractControl, FormArray, FormBuilder, FormControl as FC, FormGroup } from
|
||||
// '@angular/forms';
|
||||
|
||||
private fb = new FormBuilder();
|
||||
// @Component({template: ''})
|
||||
// export class MyComponent {
|
||||
// private _control = new FC(42);
|
||||
// private _group = new FormGroup({});
|
||||
// private _array = new FormArray([]);
|
||||
|
||||
build() {
|
||||
const c = this.fb.control(42);
|
||||
const g = this.fb.group({one: this.fb.control('')});
|
||||
const a = this.fb.array([42]);
|
||||
const fc2 = new FC(0);
|
||||
}
|
||||
}
|
||||
`);
|
||||
await runMigration();
|
||||
[`import { ${
|
||||
anySymbolName}, AbstractControl, FormArray, FormBuilder, FormControl as FC, FormGroup } from '@angular/forms';`,
|
||||
`private _control = new FC<${anySymbolName}>(42)`,
|
||||
`private _group = new FormGroup<${anySymbolName}>({})`,
|
||||
`private _array = new FormArray<${anySymbolName}[]>([])`,
|
||||
`const fc2 = new FC<${anySymbolName}>(0)`, `const c = this.fb.control<${anySymbolName}>(42)`,
|
||||
`const g = this.fb.group<${anySymbolName}>({one: this.fb.control<${anySymbolName}>('')})`,
|
||||
`const a = this.fb.array<${anySymbolName}[]>([42])`]
|
||||
.forEach(t => expect(tree.readContent('/index.ts')).toContain(t));
|
||||
});
|
||||
});
|
||||
// private fb = new FormBuilder();
|
||||
|
||||
// build() {
|
||||
// const c = this.fb.control(42);
|
||||
// const g = this.fb.group({one: this.fb.control('')});
|
||||
// const a = this.fb.array([42]);
|
||||
// const fc2 = new FC(0);
|
||||
// }
|
||||
// }
|
||||
// `);
|
||||
// await runMigration();
|
||||
// [`import { ${
|
||||
// anySymbolName}, AbstractControl, FormArray, FormBuilder, FormControl as FC, FormGroup
|
||||
// } from '@angular/forms';`,
|
||||
// `private _control = new FC<${anySymbolName}>(42)`,
|
||||
// `private _group = new FormGroup<${anySymbolName}>({})`,
|
||||
// `private _array = new FormArray<${anySymbolName}[]>([])`,
|
||||
// `const fc2 = new FC<${anySymbolName}>(0)`, `const c =
|
||||
// this.fb.control<${anySymbolName}>(42)`, `const g = this.fb.group<${anySymbolName}>({one:
|
||||
// this.fb.control<${anySymbolName}>('')})`, `const a =
|
||||
// this.fb.array<${anySymbolName}[]>([42])`]
|
||||
// .forEach(t => expect(tree.readContent('/index.ts')).toContain(t));
|
||||
// });
|
||||
// });
|
||||
|
||||
function writeFile(filePath: string, contents: string) {
|
||||
host.sync.write(normalize(filePath), virtualFs.stringToFileBuffer(contents));
|
||||
|
||||
Reference in New Issue
Block a user