Skip to content

Commit 7a433f6

Browse files
crisbetojelbourn
authored andcommitted
build: set up schematics for v9 (#17101)
Adds the setup so we can add migration schematics for v9.
1 parent 1dce54e commit 7a433f6

File tree

6 files changed

+80
-57
lines changed

6 files changed

+80
-57
lines changed

src/cdk/schematics/migration.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,11 @@
1616
"description": "Updates the Angular CDK to v8",
1717
"factory": "./ng-update/index#updateToV8"
1818
},
19+
"migration-v9": {
20+
"version": "9",
21+
"description": "Updates the Angular CDK to v9",
22+
"factory": "./ng-update/index#updateToV9"
23+
},
1924
"ng-post-update": {
2025
"description": "Prints out results after ng-update.",
2126
"factory": "./ng-update/index#postUpdate",

src/cdk/schematics/ng-update/index.ts

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,21 +12,26 @@ import {TargetVersion} from '../update-tool/target-version';
1212
import {cdkUpgradeData} from './upgrade-data';
1313
import {createUpgradeRule} from './upgrade-rules';
1414

15-
/** Entry point for the migration schematics with target of Angular Material 6.0.0 */
15+
/** Entry point for the migration schematics with target of Angular CDK 6.0.0 */
1616
export function updateToV6(): Rule {
1717
return createUpgradeRule(TargetVersion.V6, [], cdkUpgradeData, onMigrationComplete);
1818
}
1919

20-
/** Entry point for the migration schematics with target of Angular Material 7.0.0 */
20+
/** Entry point for the migration schematics with target of Angular CDK 7.0.0 */
2121
export function updateToV7(): Rule {
2222
return createUpgradeRule(TargetVersion.V7, [], cdkUpgradeData, onMigrationComplete);
2323
}
2424

25-
/** Entry point for the migration schematics with target of Angular Material 8.0.0 */
25+
/** Entry point for the migration schematics with target of Angular CDK 8.0.0 */
2626
export function updateToV8(): Rule {
2727
return createUpgradeRule(TargetVersion.V8, [], cdkUpgradeData, onMigrationComplete);
2828
}
2929

30+
/** Entry point for the migration schematics with target of Angular CDK 9.0.0 */
31+
export function updateToV9(): Rule {
32+
return createUpgradeRule(TargetVersion.V9, [], cdkUpgradeData, onMigrationComplete);
33+
}
34+
3035
/** Function that will be called when the migration completed. */
3136
function onMigrationComplete(targetVersion: TargetVersion, hasFailures: boolean) {
3237
console.log();

src/cdk/schematics/ng-update/update-schematic.md

Lines changed: 55 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,44 @@
1-
# ng-update schematic
1+
# ng-update schematic
22

33
**Note** The CDK ng-update schematic is the foundation for the Angular Material update schematic. This is achieved by making the ng-update code for the CDK as reusable as possible.
4-
4+
55
This means that this document also applies for the Angular Material `ng-update`.
66

77
---
8-
8+
99
The `ng-update` schematic consists of multiple migration entry-points where every entry-point
10-
targets a specific Angular CDK or Angular Material version.
10+
targets a specific Angular CDK or Angular Material version.
1111

1212

1313
As of right now, we have multiple migration entry-points that handle the breaking changes for a
14-
given target version:
15-
14+
given target version:
15+
1616
| Target Version | Description |
1717
|----------------|------------------------|
18-
| V6 | Upgrade from any version to v6.0.0 |
19-
| V7 | Upgrade from any version to v7.0.0 |
20-
| V8 | Upgrade from any version to v8.0.0 |
21-
18+
| V6 | Upgrade from any version to v6.0.0 |
19+
| V7 | Upgrade from any version to v7.0.0 |
20+
| V8 | Upgrade from any version to v8.0.0 |
21+
| V9 | Upgrade from any version to v9.0.0 |
22+
2223
Note that the migrations run _in order_ if multiple versions are implicitly targeted. For
2324
example, consider an application which uses Angular Material v5.0.0. In case the developer runs
2425
`ng update`, the Angular CLI **only** installs V7 and runs the V6 and V7 migrations _in order_.
25-
26+
2627
This shows that we technically need to keep all migrations in the code base because
2728
the CLI usually only installs the latest version and expects all migrations for past
2829
major versions to be present.
29-
30-
## Update concept
31-
30+
31+
## Update concept
32+
3233
The goal of the update schematic is to automatically migrate code that is affected by breaking
3334
changes of the target version. Most of the time we can apply such automatic migrations, but
3435
there are also a few breaking changes that cannot be migrated automatically.
35-
36+
3637
In that case, our goal should be to notify the developer about the breaking change that needs
3738
attention.
38-
39-
## Transforming TypeScript files
40-
39+
40+
## Transforming TypeScript files
41+
4142
In order to automatically migrate TypeScript source files, we take advantage of the TypeScript
4243
Compiler API which allows us to parse and work with the AST of project source files. We built
4344
a small framework for analyzing and updating project source files that is called `update-tool`.
@@ -53,8 +54,8 @@ leveraged `tslint` caused various problems:
5354
* TSLint is not guaranteed to be installed in CLI projects. See: https://github.com/angular/angular-cli/issues/14555
5455
* TSLint replacements lead to memory leaks due to the retained TypeScript nodes
5556
* No way to have a *global analysis* phase since lint rules are only able to visit source files.
56-
* No flexibility. i.e.
57-
* No way to ensure source files are only analyzed a single time
57+
* No flexibility. i.e.
58+
* No way to ensure source files are only analyzed a single time
5859
* No way to implement a progress bar
5960
* No easy way to add support for HTML templates or stylesheets
6061

@@ -74,49 +75,49 @@ All of these problems that `tslint` had, have been solved when we built the
7475
There also other various concepts for transforming TypeScript source files, but most of them
7576
don't provide a simple API for replacements and reporting. Read more about the possible
7677
approaches below:
77-
78-
|Description | Evaluation |
79-
|------------|------------|
80-
| Regular Expressions | Too brittle. No type checking possible. Regular Expression _can_ be used in combination with some real AST walking |
81-
| TypeScript transforms (no emit) | This would be a good solution but there is no API to serialize the transformed AST into source code without using the `ts.Printer`. The printer can be used to serialize the AST but it breaks formatting, code style and more. This is not acceptable for a migration. |
78+
79+
|Description | Evaluation |
80+
|------------|------------|
81+
| Regular Expressions | Too brittle. No type checking possible. Regular Expression _can_ be used in combination with some real AST walking |
82+
| TypeScript transforms (no emit) | This would be a good solution but there is no API to serialize the transformed AST into source code without using the `ts.Printer`. The printer can be used to serialize the AST but it breaks formatting, code style and more. This is not acceptable for a migration. |
8283

8384
### Upgrade data for target versions
84-
85+
8586
The upgrade data for migrations is separated based on the target version. This is necessary in
86-
order to allow migrations run sequentially. For example:
87-
87+
order to allow migrations run sequentially. For example:
88+
8889
* In V6: `onChange` has been renamed to `changed`
8990
* In V7: `changed` has been renamed to `onValueChange`
90-
91+
9192
If we would not run the migrations in order, or don't separate the upgrade data, we would not be
9293
able to properly handle the migrations for each target version. e.g. someone is on
9394
5.0.0 and *only* wants to upgrade to 6.0.0. In that case he would end up with `onValueChange`
94-
because the non-separated upgrade data would just include: _`onChange` => `onValueChange`_
95-
95+
because the non-separated upgrade data would just include: _`onChange` => `onValueChange`_
96+
9697
Also besides separating the upgrade data based on the target version, we split the upgrade data
97-
based on the type of code that is affected by these migrations:
98-
99-
* See here: [src/material/schematics/update/material/data](https://github.com/angular/components/tree/master/src/material/schematics/update/material/data)
100-
98+
based on the type of code that is affected by these migrations:
99+
100+
* See here: [src/material/schematics/update/material/data](https://github.com/angular/components/tree/master/src/material/schematics/update/material/data)
101+
101102
### Adding upgrade data
102-
103+
103104
Adding upgrade data is now a **mandatory** step before breaking changes should be merged
104105
into `upstream`. For simple and common breaking changes, there should be already an upgrade
105-
data file that just needs the new change inserted.
106-
106+
data file that just needs the new change inserted.
107+
107108
In case there is no upgrade data for a breaking change, we need to evaluate if there should be
108109
a single `misc` migration rule that is tied to that specific breaking change, or if we should
109-
create a new migration rule in a more generic way.
110+
create a new migration rule in a more generic way.
110111

111112
---
112113

113-
**Example**: Adding upgrade data for a property rename
114+
**Example**: Adding upgrade data for a property rename
114115
**Scenario**: In Angular Material V7.0.0, we rename `MatRipple#color` to `MatRipple#newColor`.
115-
116+
116117
First, look for an existing upgrade data file that covers similar breaking changes. In that case
117118
an existing upgrade data file for `property-names` already exists. Insert the new breaking change
118-
within the proper `VersionTarget`.
119-
119+
within the proper `VersionTarget`.
120+
120121
_src/material/schematics/ng-update/material/data/property-names.ts_
121122
```ts
122123
export const propertyNames: VersionChanges<MaterialPropertyNameData> = {
@@ -138,21 +139,21 @@ export const propertyNames: VersionChanges<MaterialPropertyNameData> = {
138139
};
139140
```
140141
Once the data is inserted into the upgrade data file, the update schematic will properly migrate
141-
`MatRipple#color` to `MatRipple#newColor` if someone upgrades to Angular Material V7.0.0.
142-
142+
`MatRipple#color` to `MatRipple#newColor` if someone upgrades to Angular Material V7.0.0.
143+
143144
But that's not all. It's encouraged to add a test-case for the new migration data. In this case,
144145
a test case already exists for the type of migration and we just need to add our breaking change
145-
to it. Read more about adding a test case in the next section.
146-
146+
to it. Read more about adding a test case in the next section.
147+
147148
### Adding a breaking change to a test case
148-
149+
149150
Considering we added a breaking change to the update schematic, it's encouraged to add a proper
150-
test case for the new change that has been added.
151-
151+
test case for the new change that has been added.
152+
152153
In the scenario where a property from `MatRipple` has been renamed in V7, we don't need to create
153154
a new test-case file because there is already a test case for the `property-names` upgrade data.
154-
In that case, we just need to add the breaking change to the existing test case.
155-
155+
In that case, we just need to add the breaking change to the existing test case.
156+
156157
_src/material/schematics/ng-update/test-cases/v7/property-names_input.ts_
157158
```ts
158159
...
@@ -176,7 +177,7 @@ class A implements OnInit {
176177
}
177178
```
178179

179-
_src/material/schematics/ng-update/test-cases/v7/property-names_expected_output.ts_
180+
_src/material/schematics/ng-update/test-cases/v7/property-names_expected_output.ts_
180181
```ts
181182
...
182183

@@ -188,7 +189,7 @@ class MatRipple {
188189
}
189190

190191
/*
191-
* Actual test cases using the previously defined definitions.
192+
* Actual test cases using the previously defined definitions.
192193
*/
193194
class A implements OnInit {
194195
constructor(private a: MatRipple) {}

src/cdk/schematics/update-tool/target-version.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ export enum TargetVersion {
1111
V6 = 'version 6',
1212
V7 = 'version 7',
1313
V8 = 'version 8',
14+
V9 = 'version 9',
1415
}
1516

1617
/**

src/material/schematics/migration.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,11 @@
1616
"description": "Updates Angular Material to v8",
1717
"factory": "./ng-update/index#updateToV8"
1818
},
19+
"migration-v9": {
20+
"version": "9",
21+
"description": "Updates Angular Material to v9",
22+
"factory": "./ng-update/index#updateToV9"
23+
},
1924
"ng-post-update": {
2025
"description": "Prints out results after ng-update.",
2126
"factory": "./ng-update/index#postUpdate",

src/material/schematics/ng-update/index.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,12 @@ export function updateToV8(): Rule {
4949
TargetVersion.V8, materialMigrationRules, materialUpgradeData, onMigrationComplete);
5050
}
5151

52+
/** Entry point for the migration schematics with target of Angular Material v9 */
53+
export function updateToV9(): Rule {
54+
return createUpgradeRule(
55+
TargetVersion.V9, materialMigrationRules, materialUpgradeData, onMigrationComplete);
56+
}
57+
5258
/** Function that will be called when the migration completed. */
5359
function onMigrationComplete(targetVersion: TargetVersion, hasFailures: boolean) {
5460
console.log();

0 commit comments

Comments
 (0)