feat(core): add dynamic queries schematic (#32231)
Adds a schematic that will remove the explicit `static: false` flag from dynamic queries. E.g.
```ts
import { Directive, ViewChild, ContentChild, ElementRef } from '@angular/core';
@Directive()
export class MyDirective {
@ViewChild('child', { static: false }) child: any;
@ViewChild('secondChild', { read: ElementRef, static: false }) secondChild: ElementRef;
@ContentChild('thirdChild', { static: false }) thirdChild: any;
}
```
```ts
import { Directive, ViewChild, ContentChild, ElementRef } from '@angular/core';
@Directive()
export class MyDirective {
@ViewChild('child') child: any;
@ViewChild('secondChild', { read: ElementRef }) secondChild: ElementRef;
@ContentChild('thirdChild') thirdChild: any;
}
```
PR Close #32231
2019-08-21 01:40:30 -04:00
|
|
|
/**
|
|
|
|
* @license
|
2020-05-19 15:08:49 -04:00
|
|
|
* Copyright Google LLC All Rights Reserved.
|
feat(core): add dynamic queries schematic (#32231)
Adds a schematic that will remove the explicit `static: false` flag from dynamic queries. E.g.
```ts
import { Directive, ViewChild, ContentChild, ElementRef } from '@angular/core';
@Directive()
export class MyDirective {
@ViewChild('child', { static: false }) child: any;
@ViewChild('secondChild', { read: ElementRef, static: false }) secondChild: ElementRef;
@ContentChild('thirdChild', { static: false }) thirdChild: any;
}
```
```ts
import { Directive, ViewChild, ContentChild, ElementRef } from '@angular/core';
@Directive()
export class MyDirective {
@ViewChild('child') child: any;
@ViewChild('secondChild', { read: ElementRef }) secondChild: ElementRef;
@ContentChild('thirdChild') thirdChild: any;
}
```
PR Close #32231
2019-08-21 01:40:30 -04:00
|
|
|
*
|
|
|
|
* 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
|
|
|
|
*/
|
|
|
|
|
2020-04-02 05:01:43 -04:00
|
|
|
import {Rule, SchematicsException, Tree} from '@angular-devkit/schematics';
|
|
|
|
import {relative} from 'path';
|
feat(core): add dynamic queries schematic (#32231)
Adds a schematic that will remove the explicit `static: false` flag from dynamic queries. E.g.
```ts
import { Directive, ViewChild, ContentChild, ElementRef } from '@angular/core';
@Directive()
export class MyDirective {
@ViewChild('child', { static: false }) child: any;
@ViewChild('secondChild', { read: ElementRef, static: false }) secondChild: ElementRef;
@ContentChild('thirdChild', { static: false }) thirdChild: any;
}
```
```ts
import { Directive, ViewChild, ContentChild, ElementRef } from '@angular/core';
@Directive()
export class MyDirective {
@ViewChild('child') child: any;
@ViewChild('secondChild', { read: ElementRef }) secondChild: ElementRef;
@ContentChild('thirdChild') thirdChild: any;
}
```
PR Close #32231
2019-08-21 01:40:30 -04:00
|
|
|
import * as ts from 'typescript';
|
|
|
|
|
|
|
|
import {getProjectTsConfigPaths} from '../../utils/project_tsconfig_paths';
|
2020-04-02 05:01:43 -04:00
|
|
|
import {createMigrationProgram} from '../../utils/typescript/compiler_host';
|
2019-09-24 06:19:23 -04:00
|
|
|
|
feat(core): add dynamic queries schematic (#32231)
Adds a schematic that will remove the explicit `static: false` flag from dynamic queries. E.g.
```ts
import { Directive, ViewChild, ContentChild, ElementRef } from '@angular/core';
@Directive()
export class MyDirective {
@ViewChild('child', { static: false }) child: any;
@ViewChild('secondChild', { read: ElementRef, static: false }) secondChild: ElementRef;
@ContentChild('thirdChild', { static: false }) thirdChild: any;
}
```
```ts
import { Directive, ViewChild, ContentChild, ElementRef } from '@angular/core';
@Directive()
export class MyDirective {
@ViewChild('child') child: any;
@ViewChild('secondChild', { read: ElementRef }) secondChild: ElementRef;
@ContentChild('thirdChild') thirdChild: any;
}
```
PR Close #32231
2019-08-21 01:40:30 -04:00
|
|
|
import {identifyDynamicQueryNodes, removeOptionsParameter, removeStaticFlag} from './util';
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Runs the dynamic queries migration for all TypeScript projects in the current CLI workspace.
|
|
|
|
*/
|
|
|
|
export default function(): Rule {
|
2020-04-02 05:01:43 -04:00
|
|
|
return (tree: Tree) => {
|
feat(core): add dynamic queries schematic (#32231)
Adds a schematic that will remove the explicit `static: false` flag from dynamic queries. E.g.
```ts
import { Directive, ViewChild, ContentChild, ElementRef } from '@angular/core';
@Directive()
export class MyDirective {
@ViewChild('child', { static: false }) child: any;
@ViewChild('secondChild', { read: ElementRef, static: false }) secondChild: ElementRef;
@ContentChild('thirdChild', { static: false }) thirdChild: any;
}
```
```ts
import { Directive, ViewChild, ContentChild, ElementRef } from '@angular/core';
@Directive()
export class MyDirective {
@ViewChild('child') child: any;
@ViewChild('secondChild', { read: ElementRef }) secondChild: ElementRef;
@ContentChild('thirdChild') thirdChild: any;
}
```
PR Close #32231
2019-08-21 01:40:30 -04:00
|
|
|
const {buildPaths, testPaths} = getProjectTsConfigPaths(tree);
|
|
|
|
const basePath = process.cwd();
|
|
|
|
const allPaths = [...buildPaths, ...testPaths];
|
|
|
|
|
|
|
|
if (!allPaths.length) {
|
|
|
|
throw new SchematicsException(
|
|
|
|
'Could not find any tsconfig file. Cannot migrate dynamic queries.');
|
|
|
|
}
|
|
|
|
|
|
|
|
for (const tsconfigPath of allPaths) {
|
|
|
|
runDynamicQueryMigration(tree, tsconfigPath, basePath);
|
|
|
|
}
|
|
|
|
};
|
|
|
|
}
|
|
|
|
|
|
|
|
function runDynamicQueryMigration(tree: Tree, tsconfigPath: string, basePath: string) {
|
2020-04-02 05:01:43 -04:00
|
|
|
const {program} = createMigrationProgram(tree, tsconfigPath, basePath);
|
feat(core): add dynamic queries schematic (#32231)
Adds a schematic that will remove the explicit `static: false` flag from dynamic queries. E.g.
```ts
import { Directive, ViewChild, ContentChild, ElementRef } from '@angular/core';
@Directive()
export class MyDirective {
@ViewChild('child', { static: false }) child: any;
@ViewChild('secondChild', { read: ElementRef, static: false }) secondChild: ElementRef;
@ContentChild('thirdChild', { static: false }) thirdChild: any;
}
```
```ts
import { Directive, ViewChild, ContentChild, ElementRef } from '@angular/core';
@Directive()
export class MyDirective {
@ViewChild('child') child: any;
@ViewChild('secondChild', { read: ElementRef }) secondChild: ElementRef;
@ContentChild('thirdChild') thirdChild: any;
}
```
PR Close #32231
2019-08-21 01:40:30 -04:00
|
|
|
const typeChecker = program.getTypeChecker();
|
|
|
|
const sourceFiles = program.getSourceFiles().filter(
|
|
|
|
f => !f.isDeclarationFile && !program.isSourceFileFromExternalLibrary(f));
|
|
|
|
const printer = ts.createPrinter();
|
|
|
|
|
|
|
|
sourceFiles.forEach(sourceFile => {
|
|
|
|
const result = identifyDynamicQueryNodes(typeChecker, sourceFile);
|
|
|
|
|
|
|
|
if (result.removeProperty.length || result.removeParameter.length) {
|
|
|
|
const update = tree.beginUpdate(relative(basePath, sourceFile.fileName));
|
|
|
|
|
|
|
|
result.removeProperty.forEach(node => {
|
|
|
|
update.remove(node.getStart(), node.getWidth());
|
|
|
|
update.insertRight(
|
|
|
|
node.getStart(),
|
|
|
|
printer.printNode(ts.EmitHint.Unspecified, removeStaticFlag(node), sourceFile));
|
|
|
|
});
|
|
|
|
|
|
|
|
result.removeParameter.forEach(node => {
|
|
|
|
update.remove(node.getStart(), node.getWidth());
|
|
|
|
update.insertRight(
|
|
|
|
node.getStart(),
|
|
|
|
printer.printNode(ts.EmitHint.Unspecified, removeOptionsParameter(node), sourceFile));
|
|
|
|
});
|
|
|
|
|
|
|
|
tree.commitUpdate(update);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|