release: cut the v10.1.1 release

This reverts commit 775c30577131cacaa3c1c3c1e7e02a233acf29a8.
internal failure:
https://test.corp.google.com/ui#id=OCL:329948619:BASE:329967516:1599160428139:d63165ae

PR Close #38767

.circleci/config.yml

@@ -656,6 +656,18 @@ jobs:
       - run: yarn tsc -p packages
       - run: yarn tsc -p modules
       - run: yarn bazel build //packages/zone.js:npm_package
+      # Build test fixtures for a test that rely on Bazel-generated fixtures. Note that disabling
+      # specific tests which are reliant on such generated fixtures is not an option as SystemJS
+      # in the Saucelabs legacy job always fetches referenced files, even if the imports would be
+      # guarded by an check to skip in the Saucelabs legacy job. We should be good running such
+      # test in all supported browsers on Saucelabs anyway until this job can be removed.
+      - run:
+          name: Preparing Bazel-generated fixtures required in legacy tests
+          command: |
+            yarn bazel build //packages/core/test:downleveled_es5_fixture
+            # Needed for the ES5 downlevel reflector test in `packages/core/test/reflection`.
+            cp dist/bin/packages/core/test/reflection/es5_downleveled_inheritance_fixture.js \
+              dist/all/@angular/core/test/reflection/es5_downleveled_inheritance_fixture.js
       - run:
           # Waiting on ready ensures that we don't run tests too early without Saucelabs not being ready.
           name: Waiting for Saucelabs tunnel to connect

.github/angular-robot.yml

@@ -73,15 +73,14 @@ merge:
       - "packages/zone.js/scripts/**"
 
   # comment that will be added to a PR when there is a conflict, leave empty or set to false to disable
-  mergeConflictComment: "Hi @{{PRAuthor}}! This PR has merge conflicts due to recent upstream merges.
-\nPlease help to unblock it by resolving these conflicts. Thanks!"
+  mergeConflictComment: "Hi @{{PRAuthor}}! This PR has merge conflicts due to recent upstream merges.\nPlease help to unblock it by resolving these conflicts. Thanks!"
 
   # label to monitor
-  mergeLabel: "PR action: merge"
+  mergeLabel: "action: merge"
 
   # adding any of these labels will also add the merge label
   mergeLinkedLabels:
-    - "PR action: merge-assistance"
+    - "action: merge-assistance"
 
   # list of checks that will determine if the merge label can be added
   checks:
@@ -94,17 +93,17 @@ merge:
 
     # whether the PR shouldn't have a conflict with the base branch
     noConflict: true
-    # list of labels that a PR needs to have, checked with a regexp (e.g. "PR target:" will work for the label "PR target: master")
+    # list of labels that a PR needs to have, checked with a regexp (e.g. "target:" will work for the label "target: master")
     requiredLabels:
-      - "PR target: *"
+      - "target: *"
       - "cla: yes"
 
     # list of labels that a PR shouldn't have, checked after the required labels with a regexp
     forbiddenLabels:
-      - "PR target: TBD"
-      - "PR action: cleanup"
-      - "PR action: review"
-      - "PR state: blocked"
+      - "target: TBD"
+      - "action: cleanup"
+      - "action: review"
+      - "state: blocked"
       - "cla: no"
 
     # list of PR statuses that need to be successful
@@ -121,12 +120,7 @@ merge:
   # the comment that will be added when the merge label is added despite failing checks, leave empty or set to false to disable
   # {{MERGE_LABEL}} will be replaced by the value of the mergeLabel option
   # {{PLACEHOLDER}} will be replaced by the list of failing checks
-  mergeRemovedComment: "I see that you just added the `{{MERGE_LABEL}}` label, but the following checks are still failing:
-\n{{PLACEHOLDER}}
-\n
-\n**If you want your PR to be merged, it has to pass all the CI checks.**
-\n
-\nIf you can't get the PR to a green state due to flakes or broken master, please try rebasing to master and/or restarting the CI job. If that fails and you believe that the issue is not due to your change, please contact the caretaker and ask for help."
+  mergeRemovedComment: "I see that you just added the `{{MERGE_LABEL}}` label, but the following checks are still failing:\n{{PLACEHOLDER}}\n\n**If you want your PR to be merged, it has to pass all the CI checks.**\n\nIf you can't get the PR to a green state due to flakes or broken master, please try rebasing to master and/or restarting the CI job. If that fails and you believe that the issue is not due to your change, please contact the caretaker and ask for help."
 
 # options for the triage plugin
 triage:
@@ -186,4 +180,4 @@ rerunCircleCI:
   # set to true to disable
   disabled: false
   # the label which when added triggers a rerun of the default CircleCI workflow
-  triggerRerunLabel: "PR action: rerun CI at HEAD"
+  triggerRerunLabel: "action: rerun CI at HEAD"

.ng-dev/caretaker.ts

@@ -0,0 +1,19 @@
+import {CaretakerConfig} from '../dev-infra/caretaker/config';
+
+/** The configuration for `ng-dev caretaker` commands. */
+export const caretaker: CaretakerConfig = {
+  githubQueries: [
+    {
+      name: 'Merge Queue',
+      query: `is:pr is:open status:success label:"action: merge"`,
+    },
+    {
+      name: 'Merge Assistance Queue',
+      query: `is:pr is:open status:success label:"action: merge-assistance"`,
+    },
+    {
+      name: 'Primary Triage Queue',
+      query: `is:open is:issue no:milestone`,
+    }
+  ]
+};

.ng-dev/commit-message.ts

@@ -7,18 +7,6 @@ export const commitMessage: CommitMessageConfig = {
   maxLineLength: 120,
   minBodyLength: 20,
   minBodyLengthTypeExcludes: ['docs'],
-  types: [
-    'build',
-    'ci',
-    'docs',
-    'feat',
-    'fix',
-    'perf',
-    'refactor',
-    'release',
-    'style',
-    'test',
-  ],
   scopes: [
     'animations',
     'bazel',

.ng-dev/config.ts

@@ -1,3 +1,4 @@
+import {caretaker} from './caretaker';
 import {commitMessage} from './commit-message';
 import {format} from './format';
 import {github} from './github';
@@ -8,4 +9,5 @@ module.exports = {
   format,
   github,
   merge,
+  caretaker,
 };

.ng-dev/merge.ts

@@ -1,38 +1,25 @@
-import {MergeConfig} from '../dev-infra/pr/merge/config';
+import {DevInfraMergeConfig} from '../dev-infra/pr/merge/config';
+import {getDefaultTargetLabelConfiguration} from '../dev-infra/pr/merge/defaults';
+import {github} from './github';
 
 /**
  * Configuration for the merge tool in `ng-dev`. This sets up the labels which
  * are respected by the merge script (e.g. the target labels).
  */
-export const merge = (): MergeConfig => {
-  // TODO: resume dynamically determining patch branch
-  const patch = '10.0.x';
+export const merge: DevInfraMergeConfig['merge'] = async api => {
   return {
     githubApiMerge: false,
     claSignedLabel: 'cla: yes',
-    mergeReadyLabel: /^PR action: merge(-assistance)?/,
-    caretakerNoteLabel: 'PR action: merge-assistance',
+    mergeReadyLabel: /^action: merge(-assistance)?/,
+    caretakerNoteLabel: 'action: merge-assistance',
     commitMessageFixupLabel: 'commit message fixup',
-    labels: [
-      {
-        pattern: 'PR target: master-only',
-        branches: ['master'],
-      },
-      {
-        pattern: 'PR target: patch-only',
-        branches: [patch],
-      },
-      {
-        pattern: 'PR target: master & patch',
-        branches: ['master', patch],
-      },
-    ],
+    labels: await getDefaultTargetLabelConfiguration(api, github, '@angular/core'),
     requiredBaseCommits: {
       // PRs that target either `master` or the patch branch, need to be rebased
       // on top of the latest commit message validation fix.
       // These SHAs are the commits that update the required license text in the header.
       'master': '5aeb9a4124922d8ac08eb73b8f322905a32b0b3a',
-      [patch]: '27b95ba64a5d99757f4042073fd1860e20e3ed24'
+      '10.0.x': '27b95ba64a5d99757f4042073fd1860e20e3ed24',
     },
   };
 };

.pullapprove.yml

@@ -509,8 +509,8 @@ groups:
       - >
         contains_any_globs(files, [
           'packages/core/src/i18n/**',
-          'packages/core/src/render3/i18n.ts',
-          'packages/core/src/render3/i18n.md',
+          'packages/core/src/render3/i18n/**',
+          'packages/core/src/render3/instructions/i18n.ts',
           'packages/core/src/render3/interfaces/i18n.ts',
           'packages/common/locales/**',
           'packages/common/src/i18n/**',

CHANGELOG.md

@@ -1,19 +1,167 @@
-<a name="10.1.0-next.4"></a>
-# 10.1.0-next.4 (2020-08-04)
+<a name="10.1.1"></a>
+## 10.1.1 (2020-09-09)
 
 
 ### Bug Fixes
 
-* **common:** narrow `NgIf` context variables in template type checker ([#36627](https://github.com/angular/angular/issues/36627)) ([9c8bc4a](https://github.com/angular/angular/commit/9c8bc4a))
-* **compiler:** mark `NgModuleFactory` construction as not side effectful ([#38147](https://github.com/angular/angular/issues/38147)) ([7f8c222](https://github.com/angular/angular/commit/7f8c222))
+* **compiler:** correct confusion between field and property names ([#38685](https://github.com/angular/angular/issues/38685)) ([a1c34c6](https://github.com/angular/angular/commit/a1c34c6))
+* **compiler-cli:** compute source-mappings for localized strings ([#38747](https://github.com/angular/angular/issues/38747)) ([b4eb016](https://github.com/angular/angular/commit/b4eb016)), closes [#38588](https://github.com/angular/angular/issues/38588)
+* **compiler-cli:** ensure that a declaration is available in type-to-value conversion ([#38684](https://github.com/angular/angular/issues/38684)) ([56d5ff2](https://github.com/angular/angular/commit/56d5ff2)), closes [#38670](https://github.com/angular/angular/issues/38670)
+* **core:** reset `tView` between tests in Ivy TestBed ([#38659](https://github.com/angular/angular/issues/38659)) ([efc7606](https://github.com/angular/angular/commit/efc7606)), closes [#38600](https://github.com/angular/angular/issues/38600)
+* **localize:** do not expose NodeJS typings in $localize runtime code ([#38700](https://github.com/angular/angular/issues/38700)) ([4de8dc3](https://github.com/angular/angular/commit/4de8dc3)), closes [#38692](https://github.com/angular/angular/issues/38692)
+* **localize:** enable whitespace preservation marker in XLIFF files ([#38737](https://github.com/angular/angular/issues/38737)) ([190dca0](https://github.com/angular/angular/commit/190dca0)), closes [#38679](https://github.com/angular/angular/issues/38679)
+* **localize:** install `[@angular](https://github.com/angular)/localize` in `devDependencies` by default ([#38680](https://github.com/angular/angular/issues/38680)) ([dbab744](https://github.com/angular/angular/commit/dbab744)), closes [#38329](https://github.com/angular/angular/issues/38329)
+* **localize:** render context of translation file parse errors ([#38673](https://github.com/angular/angular/issues/38673)) ([32f33f0](https://github.com/angular/angular/commit/32f33f0)), closes [#38377](https://github.com/angular/angular/issues/38377)
+* **localize:** render location in XLIFF 2 even if there is no metadata ([#38713](https://github.com/angular/angular/issues/38713)) ([ab4f953](https://github.com/angular/angular/commit/ab4f953)), closes [#38705](https://github.com/angular/angular/issues/38705)
+* **ngcc:** use aliased exported types correctly ([#38666](https://github.com/angular/angular/issues/38666)) ([6a28675](https://github.com/angular/angular/commit/6a28675)), closes [#38238](https://github.com/angular/angular/issues/38238)
+* **router:** If users are using the Alt key when clicking the router links, prioritize browser’s default behavior ([#38375](https://github.com/angular/angular/issues/38375)) ([309709d](https://github.com/angular/angular/commit/309709d))
+
+
+### Performance Improvements
+
+* **core:** use `ngDevMode` to tree-shake error messages ([#38612](https://github.com/angular/angular/issues/38612)) ([b084bff](https://github.com/angular/angular/commit/b084bff))
+
+
+
+<a name="10.1.0"></a>
+# 10.1.0 (2020-09-02)
 
 
 ### Features
 
+* **bazel:** provide LinkablePackageInfo from ng_module ([#37623](https://github.com/angular/angular/issues/37623)) ([6898eab](https://github.com/angular/angular/commit/6898eab))
+* **common:** add ReadonlyMap in place of Map in keyValuePipe ([#37311](https://github.com/angular/angular/issues/37311)) ([3373453](https://github.com/angular/angular/commit/3373453)), closes [#37308](https://github.com/angular/angular/issues/37308)
+* **compiler-cli:** add `SourceFile.getOriginalLocation()` to sourcemaps package ([#32912](https://github.com/angular/angular/issues/32912)) ([6abb8d0](https://github.com/angular/angular/commit/6abb8d0))
+* **compiler-cli:** Add compiler option to report errors when assigning to restricted input fields ([#38249](https://github.com/angular/angular/issues/38249)) ([71138f6](https://github.com/angular/angular/commit/71138f6))
+* **compiler-cli:** add support for TypeScript 4.0 ([#38076](https://github.com/angular/angular/issues/38076)) ([0fc44e0](https://github.com/angular/angular/commit/0fc44e0))
+* **compiler-cli:** explain why an expression cannot be used in AOT compilations ([#37587](https://github.com/angular/angular/issues/37587)) ([712f1bd](https://github.com/angular/angular/commit/712f1bd))
+* **compiler:** support unary operators for more accurate type checking ([#37918](https://github.com/angular/angular/issues/37918)) ([874792d](https://github.com/angular/angular/commit/874792d)), closes [#20845](https://github.com/angular/angular/issues/20845) [#36178](https://github.com/angular/angular/issues/36178)
 * **core:** rename async to waitForAsync to avoid confusing ([#37583](https://github.com/angular/angular/issues/37583)) ([8f07429](https://github.com/angular/angular/commit/8f07429))
+* **core:** support injection token as predicate in queries ([#37506](https://github.com/angular/angular/issues/37506)) ([97dc85b](https://github.com/angular/angular/commit/97dc85b)), closes [#21152](https://github.com/angular/angular/issues/21152) [#36144](https://github.com/angular/angular/issues/36144)
 * **core:** update reference and doc to change `async` to `waitAsync`. ([#37583](https://github.com/angular/angular/issues/37583)) ([8fbf40b](https://github.com/angular/angular/commit/8fbf40b))
+* **forms:** AbstractControl to store raw validators in addition to combined validators function ([#37881](https://github.com/angular/angular/issues/37881)) ([ad7046b](https://github.com/angular/angular/commit/ad7046b))
+* **localize:** allow duplicate messages to be handled during extraction ([#38082](https://github.com/angular/angular/issues/38082)) ([cf9a47b](https://github.com/angular/angular/commit/cf9a47b)), closes [#38077](https://github.com/angular/angular/issues/38077)
+* **localize:** expose `canParse()` diagnostics ([#37909](https://github.com/angular/angular/issues/37909)) ([ec32eba](https://github.com/angular/angular/commit/ec32eba)), closes [#37901](https://github.com/angular/angular/issues/37901)
+* **localize:** implement message extraction tool ([#32912](https://github.com/angular/angular/issues/32912)) ([190561d](https://github.com/angular/angular/commit/190561d))
+* **platform-browser:** Allow `sms`-URLs ([#31463](https://github.com/angular/angular/issues/31463)) ([fc5c34d](https://github.com/angular/angular/commit/fc5c34d)), closes [#31462](https://github.com/angular/angular/issues/31462)
+* **platform-server:** add option for absolute URL HTTP support ([#37539](https://github.com/angular/angular/issues/37539)) ([d37049a](https://github.com/angular/angular/commit/d37049a)), closes [#37071](https://github.com/angular/angular/issues/37071)
+* **router:** better warning message when a router outlet has not been instantiated ([#30246](https://github.com/angular/angular/issues/30246)) ([1609815](https://github.com/angular/angular/commit/1609815))
 
 
+### Bug Fixes
+
+* **bazel:** fix integration test for bazel building ([#38629](https://github.com/angular/angular/issues/38629)) ([dd82f2f](https://github.com/angular/angular/commit/dd82f2f))
+* **common:** date pipe gives wrong week number ([#37632](https://github.com/angular/angular/issues/37632)) ([ef1fb6d](https://github.com/angular/angular/commit/ef1fb6d)), closes [#33961](https://github.com/angular/angular/issues/33961)
+* **common:** narrow `NgIf` context variables in template type checker ([#36627](https://github.com/angular/angular/issues/36627)) ([9c8bc4a](https://github.com/angular/angular/commit/9c8bc4a))
+* **compiler-cli:** avoid creating value expressions for symbols from type-only imports ([#37912](https://github.com/angular/angular/issues/37912)) ([18098d3](https://github.com/angular/angular/commit/18098d3)), closes [#37900](https://github.com/angular/angular/issues/37900)
+* **compiler-cli:** ensure source-maps can handle webpack:// protocol ([#32912](https://github.com/angular/angular/issues/32912)) ([decd95e](https://github.com/angular/angular/commit/decd95e))
+* **compiler-cli:** only read source-map comment from last line ([#32912](https://github.com/angular/angular/issues/32912)) ([07a07e3](https://github.com/angular/angular/commit/07a07e3))
+* **compiler-cli:** type-check inputs that include undefined when there's coercion members ([#38273](https://github.com/angular/angular/issues/38273)) ([7525f3a](https://github.com/angular/angular/commit/7525f3a))
+* **compiler:** incorrectly inferring namespace for HTML nodes inside SVG ([#38477](https://github.com/angular/angular/issues/38477)) ([0dda97e](https://github.com/angular/angular/commit/0dda97e)), closes [#37218](https://github.com/angular/angular/issues/37218)
+* **compiler:** mark `NgModuleFactory` construction as not side effectful ([#38147](https://github.com/angular/angular/issues/38147)) ([7f8c222](https://github.com/angular/angular/commit/7f8c222))
+* **core:** Allow modification of lifecycle hooks any time before bootstrap ([#35464](https://github.com/angular/angular/issues/35464)) ([737506e](https://github.com/angular/angular/commit/737506e)), closes [#30497](https://github.com/angular/angular/issues/30497)
+* **core:** detect DI parameters in JIT mode for downleveled ES2015 classes ([#38463](https://github.com/angular/angular/issues/38463)) ([ca07da4](https://github.com/angular/angular/commit/ca07da4)), closes [#38453](https://github.com/angular/angular/issues/38453)
+* **core:** determine required DOMParser feature availability ([#36578](https://github.com/angular/angular/issues/36578)) ([#36578](https://github.com/angular/angular/issues/36578)) ([c509243](https://github.com/angular/angular/commit/c509243))
+* **core:** do not trigger CSP alert/report in Firefox and Chrome ([#36578](https://github.com/angular/angular/issues/36578)) ([#36578](https://github.com/angular/angular/issues/36578)) ([b950d46](https://github.com/angular/angular/commit/b950d46)), closes [#25214](https://github.com/angular/angular/issues/25214)
+* **core:** move generated i18n statements to the `consts` field of ComponentDef ([#38404](https://github.com/angular/angular/issues/38404)) ([cb05c01](https://github.com/angular/angular/commit/cb05c01))
+* **elements:** run strategy methods in correct zone ([#37814](https://github.com/angular/angular/issues/37814)) ([8df888d](https://github.com/angular/angular/commit/8df888d)), closes [#24181](https://github.com/angular/angular/issues/24181)
+* **forms:** handle form groups/arrays own pending async validation ([#22575](https://github.com/angular/angular/issues/22575)) ([77b62a5](https://github.com/angular/angular/commit/77b62a5)), closes [#10064](https://github.com/angular/angular/issues/10064)
+* **language-service:** non-existent module format in package output ([#37623](https://github.com/angular/angular/issues/37623)) ([413a0fb](https://github.com/angular/angular/commit/413a0fb))
+* **localize:** ensure required XLIFF parameters are serialized ([#38575](https://github.com/angular/angular/issues/38575)) ([f0af387](https://github.com/angular/angular/commit/f0af387)), closes [#38570](https://github.com/angular/angular/issues/38570)
+* **localize:** extract the correct message ids ([#38498](https://github.com/angular/angular/issues/38498)) ([ac461e1](https://github.com/angular/angular/commit/ac461e1))
+* **localize:** render ICU placeholders in extracted translation files ([#38484](https://github.com/angular/angular/issues/38484)) ([81c3e80](https://github.com/angular/angular/commit/81c3e80))
+* **localize:** render text of extracted placeholders ([#38536](https://github.com/angular/angular/issues/38536)) ([14e90be](https://github.com/angular/angular/commit/14e90be))
+* **ngcc:** detect synthesized delegate constructors for downleveled ES2015 classes ([#38463](https://github.com/angular/angular/issues/38463)) ([3b9c802](https://github.com/angular/angular/commit/3b9c802)), closes [#38453](https://github.com/angular/angular/issues/38453) [#38453](https://github.com/angular/angular/issues/38453)
+* **router:** defer loading of wildcard module until needed ([#38348](https://github.com/angular/angular/issues/38348)) ([8f708b5](https://github.com/angular/angular/commit/8f708b5)), closes [#25494](https://github.com/angular/angular/issues/25494)
+* **router:** fix navigation ignoring logic to compare to the browser url ([#37716](https://github.com/angular/angular/issues/37716)) ([a5ffca0](https://github.com/angular/angular/commit/a5ffca0)), closes [#16710](https://github.com/angular/angular/issues/16710) [#13586](https://github.com/angular/angular/issues/13586)
+* **router:** properly compare array queryParams for equality ([#37709](https://github.com/angular/angular/issues/37709)) ([#37860](https://github.com/angular/angular/issues/37860)) ([1801d0c](https://github.com/angular/angular/commit/1801d0c))
+* **router:** remove parenthesis for primary outlet segment after removing auxiliary outlet segment ([#24656](https://github.com/angular/angular/issues/24656)) ([#37163](https://github.com/angular/angular/issues/37163)) ([71f008f](https://github.com/angular/angular/commit/71f008f))
+* **router:** restore 'history.state' object for navigations coming from Angular router ([#28108](https://github.com/angular/angular/issues/28108)) ([#28176](https://github.com/angular/angular/issues/28176)) ([df76a20](https://github.com/angular/angular/commit/df76a20))
+
+### Code Refactoring
+* **router:** export DefaultRouteReuseStrategy to Router public_api ([#31575](https://github.com/angular/angular/issues/31575)) ([ca79880](https://github.com/angular/angular/commit/ca79880))
+
+
+
+
+### Performance Improvements
+* **compiler-cli:** don't emit template guards when child scope is empty ([#38418](https://github.com/angular/angular/issues/38418)) ([1388c17](https://github.com/angular/angular/commit/1388c17))
+* **compiler-cli:** fix regressions in incremental program reuse ([#37641](https://github.com/angular/angular/issues/37641)) ([5103d90](https://github.com/angular/angular/commit/5103d90))
+* **compiler-cli:** only generate directive declarations when used ([#38418](https://github.com/angular/angular/issues/38418)) ([fb8f4b4](https://github.com/angular/angular/commit/fb8f4b4))
+* **compiler-cli:** only generate type-check code for referenced DOM elements ([#38418](https://github.com/angular/angular/issues/38418)) ([f42e6ce](https://github.com/angular/angular/commit/f42e6ce))
+* **forms:** use internal `ngDevMode` flag to tree-shake error messages in prod builds ([#37821](https://github.com/angular/angular/issues/37821)) ([201a546](https://github.com/angular/angular/commit/201a546)), closes [#37697](https://github.com/angular/angular/issues/37697)
+* **ngcc:** shortcircuit tokenizing in ESM dependency host ([#37639](https://github.com/angular/angular/issues/37639)) ([bd7f440](https://github.com/angular/angular/commit/bd7f440))
+* **ngcc:** use `EntryPointManifest` to speed up noop `ProgramBaseEntryPointFinder` ([#37665](https://github.com/angular/angular/issues/37665)) ([9318e23](https://github.com/angular/angular/commit/9318e23))
+* **router:** apply prioritizedGuardValue operator to optimize CanLoad guards ([#37523](https://github.com/angular/angular/issues/37523)) ([d7dd295](https://github.com/angular/angular/commit/d7dd295))
+
+
+
+<a name="10.0.14"></a>
+## 10.0.14 (2020-08-26)
+
+
+<a name="10.0.12"></a>
+## 10.0.12 (2020-08-24)
+
+
+### Bug Fixes
+
+* **compiler-cli:** adding references to const enums in runtime code ([#38542](https://github.com/angular/angular/issues/38542)) ([814b436](https://github.com/angular/angular/commit/814b436)), closes [#38513](https://github.com/angular/angular/issues/38513)
+* **core:** remove closing body tag from inert DOM builder ([#38454](https://github.com/angular/angular/issues/38454)) ([5528536](https://github.com/angular/angular/commit/5528536))
+* **localize:** include the last placeholder in parsed translation text ([#38452](https://github.com/angular/angular/issues/38452)) ([57d1a48](https://github.com/angular/angular/commit/57d1a48))
+* **localize:** parse all parts of a translation with nested HTML ([#38452](https://github.com/angular/angular/issues/38452)) ([07b99f5](https://github.com/angular/angular/commit/07b99f5)), closes [#38422](https://github.com/angular/angular/issues/38422)
+
+
+### Features
+
+* **language-service:** introduce hybrid visitor to locate AST node ([#38540](https://github.com/angular/angular/issues/38540)) ([66d8c22](https://github.com/angular/angular/commit/66d8c22))
+
+
+<a name="10.0.11"></a>
+## 10.0.11 (2020-08-19)
+
+
+### Bug Fixes
+
+* **router:** ensure routerLinkActive updates when associated routerLinks change (resubmit of [#38349](https://github.com/angular/angular/issues/38349)) ([#38511](https://github.com/angular/angular/issues/38511)) ([0af9533](https://github.com/angular/angular/commit/0af9533)), closes [#18469](https://github.com/angular/angular/issues/18469)
+
+
+
+<a name="10.0.10"></a>
+## 10.0.10 (2020-08-17)
+
+
+### Bug Fixes
+
+* **common:** Allow scrolling when browser supports scrollTo ([#38468](https://github.com/angular/angular/issues/38468)) ([b32126c](https://github.com/angular/angular/commit/b32126c)), closes [#30630](https://github.com/angular/angular/issues/30630)
+* **core:** detect DI parameters in JIT mode for downleveled ES2015 classes ([#38500](https://github.com/angular/angular/issues/38500)) ([863acb6](https://github.com/angular/angular/commit/863acb6)), closes [#38453](https://github.com/angular/angular/issues/38453)
+* **core:** error if CSS custom property in host binding has number in name ([#38432](https://github.com/angular/angular/issues/38432)) ([cb83b8a](https://github.com/angular/angular/commit/cb83b8a)), closes [#37292](https://github.com/angular/angular/issues/37292)
+* **core:** fix multiple nested views removal from ViewContainerRef ([#38317](https://github.com/angular/angular/issues/38317)) ([d5e09f4](https://github.com/angular/angular/commit/d5e09f4)), closes [#38201](https://github.com/angular/angular/issues/38201)
+* **ngcc:** detect synthesized delegate constructors for downleveled ES2015 classes ([#38500](https://github.com/angular/angular/issues/38500)) ([f3dd6c2](https://github.com/angular/angular/commit/f3dd6c2)), closes [#38453](https://github.com/angular/angular/issues/38453) [#38453](https://github.com/angular/angular/issues/38453)
+* **router:** ensure routerLinkActive updates when associated routerLinks change ([#38349](https://github.com/angular/angular/issues/38349)) ([989e8a1](https://github.com/angular/angular/commit/989e8a1)), closes [#18469](https://github.com/angular/angular/issues/18469)
+
+
+
+<a name="10.0.9"></a>
+## 10.0.9 (2020-08-12)
+
+
+### Bug Fixes
+
+* **common:** ensure scrollRestoration is writable ([#30630](https://github.com/angular/angular/issues/30630)) ([#38357](https://github.com/angular/angular/issues/38357)) ([58f4b3a](https://github.com/angular/angular/commit/58f4b3a)), closes [#30629](https://github.com/angular/angular/issues/30629)
+* **compiler:** evaluate safe navigation expressions in correct binding order ([#37911](https://github.com/angular/angular/issues/37911)) ([f5b9d87](https://github.com/angular/angular/commit/f5b9d87)), closes [#37194](https://github.com/angular/angular/issues/37194)
+* **compiler-cli:** avoid creating value expressions for symbols from type-only imports ([#38415](https://github.com/angular/angular/issues/38415)) ([ca2b4bc](https://github.com/angular/angular/commit/ca2b4bc)), closes [#37912](https://github.com/angular/angular/issues/37912)
+* **compiler-cli:** infer quote expressions as any type in type checker ([#37917](https://github.com/angular/angular/issues/37917)) ([5b87c67](https://github.com/angular/angular/commit/5b87c67)), closes [#36568](https://github.com/angular/angular/issues/36568)
+* **compiler-cli:** mark eager `NgModuleFactory` construction as not side effectful ([#38320](https://github.com/angular/angular/issues/38320)) ([016a41b](https://github.com/angular/angular/commit/016a41b)), closes [#38147](https://github.com/angular/angular/issues/38147)
+* **compiler-cli:** match wrapHost parameter types within plugin interface ([#38004](https://github.com/angular/angular/issues/38004)) ([df01a82](https://github.com/angular/angular/commit/df01a82))
+* **compiler-cli:** preserve quotes in class member names ([#38387](https://github.com/angular/angular/issues/38387)) ([c9acb7b](https://github.com/angular/angular/commit/c9acb7b)), closes [#38311](https://github.com/angular/angular/issues/38311)
+* **core:** prevent NgModule scope being overwritten in JIT compiler ([#37795](https://github.com/angular/angular/issues/37795)) ([3acebdc](https://github.com/angular/angular/commit/3acebdc)), closes [#37105](https://github.com/angular/angular/issues/37105)
+* **core:** queries not matching string injection tokens ([#38321](https://github.com/angular/angular/issues/38321)) ([32109dc](https://github.com/angular/angular/commit/32109dc)), closes [#38313](https://github.com/angular/angular/issues/38313) [#38315](https://github.com/angular/angular/issues/38315)
+* **core:** Store the currently selected ICU in `LView` ([#38345](https://github.com/angular/angular/issues/38345)) ([ee5123f](https://github.com/angular/angular/commit/ee5123f))
+* **platform-server:** remove styles added by ServerStylesHost on destruction ([#38367](https://github.com/angular/angular/issues/38367)) ([7f11149](https://github.com/angular/angular/commit/7f11149))
+* **router:** prevent calling unsubscribe on undefined subscription in RouterPreloader ([#38344](https://github.com/angular/angular/issues/38344)) ([4151314](https://github.com/angular/angular/commit/4151314))
+* **service-worker:** fix the chrome debugger syntax highlighter ([#38332](https://github.com/angular/angular/issues/38332)) ([f5d5bac](https://github.com/angular/angular/commit/f5d5bac))
+
 
 <a name="10.0.8"></a>
 ## 10.0.8 (2020-08-04)
@@ -36,16 +184,6 @@
 
 
 
-<a name="10.1.0-next.3"></a>
-# 10.1.0-next.3 (2020-07-28)
-
-
-### Bug Fixes
-
-* **elements:** run strategy methods in correct zone ([#37814](https://github.com/angular/angular/issues/37814)) ([8df888d](https://github.com/angular/angular/commit/8df888d)), closes [#24181](https://github.com/angular/angular/issues/24181)
-
-
-
 <a name="10.0.6"></a>
 ## 10.0.6 (2020-07-28)
 
@@ -59,23 +197,6 @@
 
 
 
-<a name="10.1.0-next.2"></a>
-# 10.1.0-next.2 (2020-07-22)
-
-
-### Bug Fixes
-
-* **core:** Allow modification of lifecycle hooks any time before bootstrap ([#35464](https://github.com/angular/angular/issues/35464)) ([737506e](https://github.com/angular/angular/commit/737506e)), closes [#30497](https://github.com/angular/angular/issues/30497)
-
-
-### Features
-
-* **common:** add ReadonlyMap in place of Map in keyValuePipe ([#37311](https://github.com/angular/angular/issues/37311)) ([3373453](https://github.com/angular/angular/commit/3373453)), closes [#37308](https://github.com/angular/angular/issues/37308)
-* **forms:** AbstractControl to store raw validators in addition to combined validators function ([#37881](https://github.com/angular/angular/issues/37881)) ([ad7046b](https://github.com/angular/angular/commit/ad7046b))
-* **localize:** allow duplicate messages to be handled during extraction ([#38082](https://github.com/angular/angular/issues/38082)) ([cf9a47b](https://github.com/angular/angular/commit/cf9a47b)), closes [#38077](https://github.com/angular/angular/issues/38077)
-
-
-
 <a name="10.0.5"></a>
 ## 10.0.5 (2020-07-22)
 
@@ -110,62 +231,6 @@
 * **bazel:** provide LinkablePackageInfo from ng_module ([#37778](https://github.com/angular/angular/issues/37778)) ([6cd10a1](https://github.com/angular/angular/commit/6cd10a1)), closes [/github.com/bazelbuild/rules_nodejs/blob/9a5de3728b05bf1647bbb87ad99f54e626604705/internal/linker/link_node_modules.bzl#L144-L146](https://github.com//github.com/bazelbuild/rules_nodejs/blob/9a5de3728b05bf1647bbb87ad99f54e626604705/internal/linker/link_node_modules.bzl/issues/L144-L146)
 
 
-<a name="10.1.0-next.1"></a>
-# 10.1.0-next.1 (2020-07-15)
-
-
-### Bug Fixes
-
-* **bazel:** ng_module rule does not expose flat module information in Ivy ([#36971](https://github.com/angular/angular/issues/36971)) ([1550663](https://github.com/angular/angular/commit/1550663))
-* **compiler:** check more cases for pipe usage inside host bindings ([#37883](https://github.com/angular/angular/issues/37883)) ([9322b9a](https://github.com/angular/angular/commit/9322b9a)), closes [#34655](https://github.com/angular/angular/issues/34655) [#37610](https://github.com/angular/angular/issues/37610)
-* **compiler-cli:** ensure file_system handles mixed Windows drives ([#37959](https://github.com/angular/angular/issues/37959)) ([6b31155](https://github.com/angular/angular/commit/6b31155)), closes [#36777](https://github.com/angular/angular/issues/36777)
-* **language-service:** remove completion for string ([#37983](https://github.com/angular/angular/issues/37983)) ([10aba15](https://github.com/angular/angular/commit/10aba15))
-* **ngcc:** report a warning if ngcc tries to use a solution-style tsconfig ([#38003](https://github.com/angular/angular/issues/38003)) ([b358495](https://github.com/angular/angular/commit/b358495)), closes [#36386](https://github.com/angular/angular/issues/36386)
-* **router:** ensure duplicate popstate/hashchange events are handled correctly ([#37674](https://github.com/angular/angular/issues/37674)) ([9185c6e](https://github.com/angular/angular/commit/9185c6e)), closes [/github.com/angular/angular/issues/16710#issuecomment-646919529](https://github.com//github.com/angular/angular/issues/16710/issues/issuecomment-646919529) [#16710](https://github.com/angular/angular/issues/16710)
-* **service-worker:** correctly handle relative base href ([#37922](https://github.com/angular/angular/issues/37922)) ([d19ef65](https://github.com/angular/angular/commit/d19ef65)), closes [#25055](https://github.com/angular/angular/issues/25055) [#25055](https://github.com/angular/angular/issues/25055)
-* **service-worker:** correctly serve `ngsw/state` with a non-root SW scope ([#37922](https://github.com/angular/angular/issues/37922)) ([2156bee](https://github.com/angular/angular/commit/2156bee)), closes [#30505](https://github.com/angular/angular/issues/30505)
-
-
-
-<a name="10.1.0-next.0"></a>
-# 10.1.0-next.0 (2020-07-08)
-
-
-### Bug Fixes
-
-* **common:** date pipe gives wrong week number ([#37632](https://github.com/angular/angular/issues/37632)) ([ef1fb6d](https://github.com/angular/angular/commit/ef1fb6d)), closes [#33961](https://github.com/angular/angular/issues/33961)
-* **compiler-cli:** ensure source-maps can handle webpack:// protocol ([#32912](https://github.com/angular/angular/issues/32912)) ([decd95e](https://github.com/angular/angular/commit/decd95e))
-* **compiler-cli:** only read source-map comment from last line ([#32912](https://github.com/angular/angular/issues/32912)) ([07a07e3](https://github.com/angular/angular/commit/07a07e3))
-* **core:** determine required DOMParser feature availability ([#36578](https://github.com/angular/angular/issues/36578)) ([#36578](https://github.com/angular/angular/issues/36578)) ([c509243](https://github.com/angular/angular/commit/c509243))
-* **core:** do not trigger CSP alert/report in Firefox and Chrome ([#36578](https://github.com/angular/angular/issues/36578)) ([#36578](https://github.com/angular/angular/issues/36578)) ([b950d46](https://github.com/angular/angular/commit/b950d46)), closes [#25214](https://github.com/angular/angular/issues/25214)
-* **forms:** handle form groups/arrays own pending async validation ([#22575](https://github.com/angular/angular/issues/22575)) ([77b62a5](https://github.com/angular/angular/commit/77b62a5)), closes [#10064](https://github.com/angular/angular/issues/10064)
-* **language-service:** non-existent module format in package output ([#37623](https://github.com/angular/angular/issues/37623)) ([413a0fb](https://github.com/angular/angular/commit/413a0fb))
-* **router:** fix navigation ignoring logic to compare to the browser url ([#37716](https://github.com/angular/angular/issues/37716)) ([a5ffca0](https://github.com/angular/angular/commit/a5ffca0)), closes [#16710](https://github.com/angular/angular/issues/16710) [#13586](https://github.com/angular/angular/issues/13586)
-* **router:** properly compare array queryParams for equality ([#37709](https://github.com/angular/angular/issues/37709)) ([#37860](https://github.com/angular/angular/issues/37860)) ([1801d0c](https://github.com/angular/angular/commit/1801d0c))
-* **router:** remove parenthesis for primary outlet segment after removing auxiliary outlet segment ([#24656](https://github.com/angular/angular/issues/24656)) ([#37163](https://github.com/angular/angular/issues/37163)) ([71f008f](https://github.com/angular/angular/commit/71f008f))
-
-
-### Features
-
-* **bazel:** provide LinkablePackageInfo from ng_module ([#37623](https://github.com/angular/angular/issues/37623)) ([6898eab](https://github.com/angular/angular/commit/6898eab))
-* **compiler-cli:** add `SourceFile.getOriginalLocation()` to sourcemaps package ([#32912](https://github.com/angular/angular/issues/32912)) ([6abb8d0](https://github.com/angular/angular/commit/6abb8d0))
-* **compiler-cli:** explain why an expression cannot be used in AOT compilations ([#37587](https://github.com/angular/angular/issues/37587)) ([712f1bd](https://github.com/angular/angular/commit/712f1bd))
-* **core:** support injection token as predicate in queries ([#37506](https://github.com/angular/angular/issues/37506)) ([97dc85b](https://github.com/angular/angular/commit/97dc85b)), closes [#21152](https://github.com/angular/angular/issues/21152) [#36144](https://github.com/angular/angular/issues/36144)
-* **localize:** expose `canParse()` diagnostics ([#37909](https://github.com/angular/angular/issues/37909)) ([ec32eba](https://github.com/angular/angular/commit/ec32eba)), closes [#37901](https://github.com/angular/angular/issues/37901)
-* **localize:** implement message extraction tool ([#32912](https://github.com/angular/angular/issues/32912)) ([190561d](https://github.com/angular/angular/commit/190561d))
-* **platform-browser:** Allow `sms`-URLs ([#31463](https://github.com/angular/angular/issues/31463)) ([fc5c34d](https://github.com/angular/angular/commit/fc5c34d)), closes [#31462](https://github.com/angular/angular/issues/31462)
-* **platform-server:** add option for absolute URL HTTP support ([#37539](https://github.com/angular/angular/issues/37539)) ([d37049a](https://github.com/angular/angular/commit/d37049a)), closes [#37071](https://github.com/angular/angular/issues/37071)
-
-
-### Performance Improvements
-
-* **compiler-cli:** fix regressions in incremental program reuse ([#37641](https://github.com/angular/angular/issues/37641)) ([5103d90](https://github.com/angular/angular/commit/5103d90))
-* **ngcc:** shortcircuit tokenizing in ESM dependency host ([#37639](https://github.com/angular/angular/issues/37639)) ([bd7f440](https://github.com/angular/angular/commit/bd7f440))
-* **ngcc:** use `EntryPointManifest` to speed up noop `ProgramBaseEntryPointFinder` ([#37665](https://github.com/angular/angular/issues/37665)) ([9318e23](https://github.com/angular/angular/commit/9318e23))
-* **router:** apply prioritizedGuardValue operator to optimize CanLoad guards ([#37523](https://github.com/angular/angular/issues/37523)) ([d7dd295](https://github.com/angular/angular/commit/d7dd295))
-
-
-
 <a name="10.0.3"></a>
 ## 10.0.3 (2020-07-08)
 
@@ -447,12 +512,12 @@ https://github.com/microsoft/TypeScript/issues/38374 for more
 information and updates.
 
 If you used Closure Compiler with Angular in the past, you will likely
-be better off consuming Angular packages built from sources directly 
+be better off consuming Angular packages built from sources directly
 rather than consuming the version we publish on npm,
 which is primarily optimized for Webpack/Rollup + Terser build pipeline.
 
 As a temporary workaround, you might consider using your current build
-pipeline with Closure flag `--compilation_level=SIMPLE`. This flag 
+pipeline with Closure flag `--compilation_level=SIMPLE`. This flag
 will ensure that your build pipeline produces buildable and
 runnable artifacts, at the cost of increased payload size due to
 advanced optimizations being disabled.
@@ -460,17 +525,17 @@ advanced optimizations being disabled.
 If you were affected by this change, please help us understand your
 needs by leaving a comment on https://github.com/angular/angular/issues/37234.
 
-* **core:** make generic mandatory for ModuleWithProviders 
+* **core:** make generic mandatory for ModuleWithProviders
 
 A generic type parameter has always been required for the `ModuleWithProviders` pattern to work with Ivy, but prior to this commit, View Engine allowed the generic type to be omitted (though support was officially deprecated).
-If you're using `ModuleWithProviders` without a generic type in your application code, a v10 migration will update your code for you. 
+If you're using `ModuleWithProviders` without a generic type in your application code, a v10 migration will update your code for you.
 
 However, if you are using View Engine and also depending on a library that omits the generic type, you will now get a build time error similar to:
 
 ```
 error TS2314: Generic type 'ModuleWithProviders<T>' requires 1 type argument(s).
 ```
- 
+
 In this case, ngcc won't help you (because it's Ivy-only) and the migration only covers application code.
 You should contact the library author to fix their library to provide a type parameter when they use this class.
 
@@ -1798,7 +1863,7 @@ API surface going forward.
 * **core:** Injector.get now accepts abstract classes to return
 type-safe values. Previous implementation returned `any` through the
 deprecated implementation.
-* Angular now compiles with Ivy by default ([#32219](https://github.com/angular/angular/issues/32219)) ([ec4381d](https://github.com/angular/angular/commit/ec4381d)). 
+* Angular now compiles with Ivy by default ([#32219](https://github.com/angular/angular/issues/32219)) ([ec4381d](https://github.com/angular/angular/commit/ec4381d)).
 
 If you aren't familiar with Ivy, read our [blog post about the Ivy preview](https://blog.angular.io/its-time-for-the-compatibility-opt-in-preview-of-ivy-38f3542a282f?gi=8bfeb44b05c) and see the list of changes [here](https://docs.google.com/document/d/1Dije0AsJ0PxL3NaeNPxpYDeapj30b_QC0xfeIvIIzgg/preview).
 

CONTRIBUTING.md

@@ -230,7 +230,6 @@ Must be one of the following:
 * **fix**: A bug fix
 * **perf**: A code change that improves performance
 * **refactor**: A code change that neither fixes a bug nor adds a feature
-* **style**: Changes that do not affect the meaning of the code (white-space, formatting, missing semi-colons, etc)
 * **test**: Adding missing tests or correcting existing tests
 
 

aio/aio-builds-setup/dockerbuild/scripts-js/lib/verify-setup/mock-external-apis.ts

@@ -16,13 +16,6 @@ import {BuildNums, PrNums, SHA} from './constants';
 
 const logger = new Logger('mock-external-apis');
 
-const log = (...args: any[]) => {
-  // Filter out non-matching URL checks
-  if (!/^matching.+: false$/.test(args[0])) {
-    logger.log(...args);
-  }
-};
-
 const AIO_CIRCLE_CI_TOKEN = getEnvVar('AIO_CIRCLE_CI_TOKEN');
 const AIO_GITHUB_TOKEN = getEnvVar('AIO_GITHUB_TOKEN');
 
@@ -91,8 +84,8 @@ const createArchive = (buildNum: number, prNum: number, sha: string) => {
 };
 
 // Create request scopes
-const circleCiApi = nock(CIRCLE_CI_API_HOST).log(log).persist();
-const githubApi = nock(GITHUB_API_HOST).log(log).persist().matchHeader('Authorization', `token ${AIO_GITHUB_TOKEN}`);
+const circleCiApi = nock(CIRCLE_CI_API_HOST).persist();
+const githubApi = nock(GITHUB_API_HOST).persist().matchHeader('Authorization', `token ${AIO_GITHUB_TOKEN}`);
 
 //////////////////////////////
 

aio/aio-builds-setup/dockerbuild/scripts-js/package.json

@@ -27,28 +27,28 @@
     "body-parser": "^1.19.0",
     "delete-empty": "^3.0.0",
     "express": "^4.17.1",
-    "jasmine": "^3.5.0",
-    "nock": "^12.0.3",
-    "node-fetch": "^2.6.0",
+    "jasmine": "^3.6.1",
+    "nock": "^13.0.4",
+    "node-fetch": "^2.6.1",
     "shelljs": "^0.8.4",
     "source-map-support": "^0.5.19",
-    "tar-stream": "^2.1.2",
-    "tslib": "^1.11.1"
+    "tar-stream": "^2.1.3",
+    "tslib": "^2.0.1"
   },
   "devDependencies": {
     "@types/body-parser": "^1.19.0",
-    "@types/express": "^4.17.6",
-    "@types/jasmine": "^3.5.10",
+    "@types/express": "^4.17.8",
+    "@types/jasmine": "^3.5.14",
     "@types/nock": "^11.1.0",
-    "@types/node": "^13.13.2",
+    "@types/node": "^14.6.4",
     "@types/node-fetch": "^2.5.7",
-    "@types/shelljs": "^0.8.7",
-    "@types/supertest": "^2.0.8",
-    "nodemon": "^2.0.3",
+    "@types/shelljs": "^0.8.8",
+    "@types/supertest": "^2.0.10",
+    "nodemon": "^2.0.4",
     "npm-run-all": "^4.1.5",
     "supertest": "^4.0.2",
-    "tslint": "^6.1.1",
+    "tslint": "^6.1.3",
     "tslint-jasmine-noSkipOrFocus": "^1.0.9",
-    "typescript": "^3.8.3"
+    "typescript": "^4.0.2"
   }
 }

aio/aio-builds-setup/dockerbuild/scripts-js/test/common/github-api.spec.ts

@@ -214,23 +214,24 @@ describe('GithubApi', () => {
     });
 
 
-    it('should call \'https.request()\' with the correct options', () => {
+    it('should call \'https.request()\' with the correct options', async () => {
       const requestHandler = nock('https://api.github.com')
         .intercept('/path', 'method')
         .reply(200);
 
-      (api as any).request('method', '/path');
+      await (api as any).request('method', '/path');
       requestHandler.done();
     });
 
 
-    it('should add the \'Authorization\' header containing the \'githubToken\'', () => {
+    it('should add the \'Authorization\' header containing the \'githubToken\'', async () => {
       const requestHandler = nock('https://api.github.com')
         .intercept('/path', 'method', undefined, {
           reqheaders: {Authorization: 'token 12345'},
         })
         .reply(200);
-      (api as any).request('method', '/path');
+
+      await (api as any).request('method', '/path');
       requestHandler.done();
     });
 
@@ -244,12 +245,13 @@ describe('GithubApi', () => {
     });
 
 
-    it('should \'JSON.stringify\' and send the data along with the request', () => {
+    it('should \'JSON.stringify\' and send the data along with the request', async () => {
       const data = {key: 'value'};
       const requestHandler = nock('https://api.github.com')
         .intercept('/path', 'method', JSON.stringify(data))
         .reply(200);
-      (api as any).request('method', '/path', data);
+
+      await (api as any).request('method', '/path', data);
       requestHandler.done();
     });
 

aio/content/examples/i18n/doc-files/messages.fr.xlf.html

@@ -41,7 +41,6 @@
       <!-- #enddocregion translated-plural -->
       <!-- #docregion translated-select -->
       <!-- #docregion translate-select-1 -->
-      </trans-unit>
       <trans-unit id="f99f34ac9bd4606345071bd813858dec29f3b7d1" datatype="html">
         <source>The author is <x id="ICU" equiv-text="{gender, select, male {...} female {...} other {...}}"/></source>
         <target>L'auteur est <x id="ICU" equiv-text="{gender, select, male {...} female {...} other {...}}"/></target>

aio/content/examples/styleguide/src/05-17/app/heroes/hero-list/hero-list.component.avoid.ts

@@ -10,8 +10,8 @@ import { Hero } from '../shared/hero.model';
   template: `
     <section>
       Our list of heroes:
-      <hero-profile *ngFor="let hero of heroes" [hero]="hero">
-      </hero-profile>
+      <toh-hero *ngFor="let hero of heroes" [hero]="hero">
+      </toh-hero>
       Total powers: {{totalPowers}}<br>
       Average power: {{totalPowers / heroes.length}}
     </section>

aio/content/examples/toh-pt6/src/app/hero-detail/hero-detail.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, Input } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import { Location } from '@angular/common';
 
@@ -11,7 +11,7 @@ import { HeroService } from '../hero.service';
   styleUrls: [ './hero-detail.component.css' ]
 })
 export class HeroDetailComponent implements OnInit {
-  @Input() hero: Hero;
+  hero: Hero;
 
   constructor(
     private route: ActivatedRoute,

aio/content/guide/angular-compiler-options.md

@@ -31,7 +31,7 @@ For example:
 
 ```json
 {
-  "extends": "../tsconfig.base.json",
+  "extends": "../tsconfig.json",
   "compilerOptions": {
     "experimentalDecorators": true,
     ...

aio/content/guide/aot-compiler.md

@@ -62,7 +62,7 @@ In the following example, the `@Component()` metadata object and the class const
 @Component({
   selector: 'app-typical',
   template: '<div>A typical component for {{data.name}}</div>'
-)}
+})
 export class TypicalComponent {
   @Input() data: TypicalData;
   constructor(private someService: SomeService) { ... }

aio/content/guide/architecture-modules.md

@@ -17,7 +17,7 @@ An NgModule is defined by a class decorated with `@NgModule()`. The `@NgModule()
 
 * `imports`: Other modules whose exported classes are needed by component templates declared in *this* NgModule.
 
-* `providers`: Creators of [services](guide/architecture-services) that this NgModule contributes to the global collection of services; they become accessible in all parts of the app. (You can also specify providers at the component level, which is often preferred.)
+* `providers`: Creators of [services](guide/architecture-services) that this NgModule contributes to the global collection of services; they become accessible in all parts of the app. (You can also specify providers at the component level.)
 
 * `bootstrap`: The main application view, called the *root component*, which hosts all other app views. Only the *root NgModule* should set the `bootstrap` property.
 

aio/content/guide/binding-syntax.md

@@ -154,7 +154,7 @@ Attributes can be changed by `setAttribute()`, which re-initializes correspondin
 </div>
 
 For more information, see the [MDN Interfaces documentation](https://developer.mozilla.org/en-US/docs/Web/API#Interfaces) which has API docs for all the standard DOM elements and their properties.
-Comparing the [`<td>` attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/td) attributes to the [`<td>` properties](https://developer.mozilla.org/en-US/docs/Web/API/HTMLTableCellElement) provides a helpful example for differentiation.
+Comparing the [`<td>` attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/td) to the [`<td>` properties](https://developer.mozilla.org/en-US/docs/Web/API/HTMLTableCellElement) provides a helpful example for differentiation.
 In particular, you can navigate from the attributes page to the properties via "DOM interface" link, and navigate the inheritance hierarchy up to `HTMLTableCellElement`.
 
 
@@ -195,7 +195,7 @@ To control the state of the button, set the `disabled` *property*,
 
 <div class="alert is-helpful">
 
-Though you could technically set the `[attr.disabled]` attribute binding, the values are different in that the property binding requires to a boolean value, while its corresponding attribute binding relies on whether the value is `null` or not. Consider the following:
+Though you could technically set the `[attr.disabled]` attribute binding, the values are different in that the property binding requires to be a boolean value, while its corresponding attribute binding relies on whether the value is `null` or not. Consider the following:
 
 ```html
 <input [disabled]="condition ? true : false">

aio/content/guide/bootstrapping.md

@@ -12,7 +12,7 @@ Every application has at least one Angular module, the _root_ module,
 which must be present for bootstrapping the application on launch.
 By convention and by default, this NgModule is named `AppModule`.
 
-When you use the [Angular CLI](cli) command `ng new` to generate an app, the default `AppModule` is as follows.
+When you use the [Angular CLI](cli) command `ng new` to generate an app, the default `AppModule` looks like the following:
 
 ```typescript
 /* JavaScript imports */
@@ -90,8 +90,6 @@ A declarable can only belong to one module, so only declare it in
 one `@NgModule`. When you need it elsewhere,
 import the module that has the declarable you need in it.
 
-**Only `@NgModule` references** go in the `imports` array.
-
 
 ### Using directives with `@NgModule`
 
@@ -133,7 +131,7 @@ The module's `imports` array appears exclusively in the `@NgModule` metadata obj
 It tells Angular about other NgModules that this particular module needs to function properly.
 
 This list of modules are those that export components, directives, or pipes
-that the component templates in this module reference. In this case, the component is
+that component templates in this module reference. In this case, the component is
 `AppComponent`, which references components, directives, or pipes in `BrowserModule`,
 `FormsModule`, or  `HttpClientModule`.
 A component template can reference another component, directive,

aio/content/guide/component-styles.md

@@ -125,7 +125,7 @@ Emulated is the default and most commonly used view encapsulation. For more info
 
 <div class="alert is-important">
 
-The shadow-piercing descendant combinator is deprecated and [support is being removed from major browsers](https://www.chromestatus.com/features/6750456638341120) and tools.
+The shadow-piercing descendant combinator is deprecated and [support is being removed from major browsers](https://www.chromestatus.com/feature/6750456638341120) and tools.
 As such we plan to drop support in Angular (for all 3 of `/deep/`, `>>>` and `::ng-deep`).
 Until then `::ng-deep` should be preferred for a broader compatibility with the tools.
 

aio/content/guide/creating-libraries.md

@@ -26,7 +26,7 @@ The `ng generate` command creates the `projects/my-lib` folder in your workspace
 
 </div>
 
-When you generate a new library, the workspace configuration file, `angular.json`, is updated with a project of type 'library'.
+When you generate a new library, the workspace configuration file, `angular.json`, is updated with a project of type `library`.
 
 <code-example format="json">
 "projects": {
@@ -109,7 +109,7 @@ If you want a dropdown that would contain different passed-in values each time,
 
 Suppose you want to read a configuration file and then generate a form based on that configuration.
 If that form will need additional customization by the developer who is using your library, it might work best as a schematic.
-However, if the forms will always be the same and not need much customization by developers, then you could create a dynamic component that takes the configuration and generates the form.
+However, if the form will always be the same and not need much customization by developers, then you could create a dynamic component that takes the configuration and generates the form.
 In general, the more complex the customization, the more useful the schematic approach.
 
 To learn more, see [Schematics Overview](guide/schematics) and [Schematics for Libraries](guide/schematics-for-libraries).

aio/content/guide/deployment.md

@@ -511,9 +511,9 @@ Each script tag has a `type="module"` or `nomodule` attribute. Browsers with nat
 
 To include differential loading in your application builds, you must configure the Browserslist and TypeScript configuration files in your application project.
 
-The following examples show a `browserlistrc` and `tsconfig.json` file for a newly created Angular application. In this configuration, legacy browsers such as IE 9-11 are ignored, and the compilation target is ES2015.
+The following examples show a `.browserslistrc` and `tsconfig.json` file for a newly created Angular application. In this configuration, legacy browsers such as IE 9-11 are ignored, and the compilation target is ES2015.
 
-<code-example language="none" header="browserslistrc">
+<code-example language="none" header=".browserslistrc">
 # This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
 # For additional information regarding the format and rule options, please see:
 # https://github.com/browserslist/browserslist#queries
@@ -527,7 +527,7 @@ The following examples show a `browserlistrc` and `tsconfig.json` file for a new
 last 1 Chrome version
 last 1 Firefox version
 last 2 Edge major versions
-last 2 Safari major version
+last 2 Safari major versions
 last 2 iOS major versions
 Firefox ESR
 not IE 9-11 # For IE 9-11 support, remove 'not'.

aio/content/guide/entry-components.md

@@ -76,6 +76,12 @@ All router components must be entry components. Because this would require you t
 
 ## The `entryComponents` array
 
+<div class="alert is-helpful">
+   
+Since 9.0.0 with Ivy, the `entryComponents` property is no longer necessary. See [deprecations guide](guide/deprecations#entryComponents).
+   
+</div>
+
 Though the `@NgModule` decorator has an `entryComponents` array, most of the time
 you won't have to explicitly set any entry components because Angular adds components listed in `@NgModule.bootstrap` and those in route definitions to entry components automatically. Though these two mechanisms account for most entry components, if your app happens to bootstrap or dynamically load a component by type imperatively,
 you must add it to `entryComponents` explicitly.

aio/content/guide/feature-modules.md

@@ -79,7 +79,7 @@ To incorporate the feature module into your app, you have to let the root module
 <code-example path="feature-modules/src/app/app.module.ts" region="app-module" header="src/app/app.module.ts"></code-example>
 
 
-Now the `AppModule` knows about the feature module. If you were to add any service providers to the feature module, `AppModule` would know about those too, as would any other feature modules. However, NgModules don’t expose their components.
+Now the `AppModule` knows about the feature module. If you were to add any service providers to the feature module, `AppModule` would know about those too, as would any other feature modules. However, NgModules don’t expose their components by default.
 
 
 ## Rendering a feature module’s component template

aio/content/guide/file-structure.md

@@ -40,8 +40,7 @@ The top level of the workspace contains workspace-wide configuration files, conf
 | `package-lock.json`     | Provides version information for all packages installed into `node_modules` by the npm client. See [npm documentation](https://docs.npmjs.com/files/package-lock.json) for details. If you use the yarn client, this file will be [yarn.lock](https://yarnpkg.com/lang/en/docs/yarn-lock/) instead. |
 | `src/`                  | Source files for the root-level application project. |
 | `node_modules/`         | Provides [npm packages](guide/npm-packages) to the entire workspace. Workspace-wide `node_modules` dependencies are visible to all projects. |
-| `tsconfig.json`         | The `tsconfig.json` file is a ["Solution Style"](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-9.html#support-for-solution-style-tsconfigjson-files) TypeScript configuration file. Code editors and TypeScript’s language server use this file to improve development experience. Compilers do not use this file. |
-| `tsconfig.base.json`    | The base [TypeScript](https://www.typescriptlang.org/) configuration for projects in the workspace. All other configuration files inherit from this base file. For more information, see the [Configuration inheritance with extends](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html#configuration-inheritance-with-extends) section of the TypeScript documentation.|
+| `tsconfig.json`         | The base [TypeScript](https://www.typescriptlang.org/) configuration for projects in the workspace. All other configuration files inherit from this base file. For more information, see the [Configuration inheritance with extends](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html#configuration-inheritance-with-extends) section of the TypeScript documentation.|
 | `tslint.json`           | Default [TSLint](https://palantir.github.io/tslint/) configuration for projects in the workspace. |
 
 
@@ -103,7 +102,7 @@ Angular components, templates, and styles go here.
 The application-specific configuration files for the root application reside at the workspace root level.
 For a multi-project workspace, project-specific configuration files are in the project root, under `projects/project-name/`.
 
-Project-specific [TypeScript](https://www.typescriptlang.org/) configuration files inherit from the workspace-wide `tsconfig.base.json`, and project-specific [TSLint](https://palantir.github.io/tslint/) configuration files inherit from the workspace-wide `tslint.json`.
+Project-specific [TypeScript](https://www.typescriptlang.org/) configuration files inherit from the workspace-wide `tsconfig.json`, and project-specific [TSLint](https://palantir.github.io/tslint/) configuration files inherit from the workspace-wide `tslint.json`.
 
 | APPLICATION-SPECIFIC CONFIG FILES    | PURPOSE |
 | :--------------------- | :------------------------------------------|

aio/content/guide/i18n.md

@@ -766,8 +766,10 @@ The HTML `base` tag with the `href` attribute specifies the base URI, or URL, fo
     "i18n": {
       "sourceLocale": "en-US",
       "locales": {
-        "fr": "src/locale/messages.fr.xlf"
-        "baseHref": ""
+        "fr": {
+          "translation": "src/locale/messages.fr.xlf",
+          "baseHref": "" 
+        }
       }
     },
     "architect": {

aio/content/guide/inputs-outputs.md

@@ -208,7 +208,7 @@ about the event and gives that data to the parent.
 The child's template has two controls. The first is an HTML `<input>` with a
 [template reference variable](guide/template-reference-variables) , `#newItem`,
 where the user types in an item name. Whatever the user types
-into the `<input>` gets stored in the `#newItem` variable.
+into the `<input>` gets stored in the `value` property of the `#newItem` variable.
 
 <code-example path="inputs-outputs/src/app/item-output/item-output.component.html" region="child-output" header="src/app/item-output/item-output.component.html"></code-example>
 
@@ -218,7 +218,7 @@ an event binding because the part to the left of the equal
 sign is in parentheses, `(click)`.
 
 The `(click)` event is bound to the `addNewItem()` method in the child component class which
-takes as its argument whatever the value of `#newItem` is.
+takes as its argument whatever the value of `#newItem.value` property is.
 
 Now the child component has an `@Output()`
 for sending data to the parent and a method for raising an event.

aio/content/guide/ivy-compatibility.md

@@ -11,11 +11,11 @@ That said, some applications will likely need to apply some manual updates.
 In version 10, [a few deprecated APIs have been removed](guide/updating-to-version-10#removals) and there are a [few breaking changes](guide/updating-to-version-10#breaking-changes) unrelated to Ivy.
 If you're seeing errors after updating to version 9, you'll first want to rule those changes out.
 
-To do so, temporarily [turn off Ivy](guide/ivy#opting-out-of-angular-ivy) in your `tsconfig.base.json` and re-start your app.
+To do so, temporarily [turn off Ivy](guide/ivy#opting-out-of-angular-ivy) in your `tsconfig.json` and re-start your app.
 
 If you're still seeing the errors, they are not specific to Ivy. In this case, you may want to consult the [general version 10 guide](guide/updating-to-version-10). If you've opted into any of the new, stricter type-checking settings, you may also want to check out the [template type-checking guide](guide/template-typecheck).
 
-If the errors are gone, switch back to Ivy by removing the changes to the `tsconfig.base.json` and review the list of expected changes below.
+If the errors are gone, switch back to Ivy by removing the changes to the `tsconfig.json` and review the list of expected changes below.
 
 {@a payload-size-debugging}
 ### Payload size debugging

aio/content/guide/lazy-loading-ngmodules.md

@@ -87,7 +87,7 @@ To make one, enter the following command in the terminal, where `customers` is t
 ng generate module customers --route customers --module app.module
 </code-example>
 
-This creates a `customers` folder with the new lazy-loadable module `CustomersModule` defined in the `customers.module.ts` file. The command automatically declares the `CustomersComponent` inside the new feature module.
+This creates a `customers` folder having the new lazy-loadable feature module `CustomersModule` defined in the `customers.module.ts` file and the routing module `CustomersRoutingModule` defined in the `customers-routing.module.ts` file. The command automatically declares the `CustomersComponent` and imports `CustomersRoutingModule` inside the new feature module.
 
 Because the new module is meant to be lazy-loaded, the command does NOT add a reference to the new feature module in the application's root module file, `app.module.ts`.
 Instead, it adds the declared route, `customers` to the `routes` array declared in the module provided as the `--module` option.

aio/content/guide/lifecycle-hooks.md

@@ -62,6 +62,8 @@ Angular executes hook methods in the following sequence. You can use them to per
 
       Called before `ngOnInit()` and whenever one or more data-bound input properties change.
 
+      Note that if your component has no inputs or you use it without providing any inputs, the framework will not call `ngOnChanges()`.
+
     </td>
   </tr>
   <tr style='vertical-align:top'>

aio/content/guide/lightweight-injection-tokens.md

@@ -141,7 +141,7 @@ Because the token is now an abstract class, and the injectable component impleme
 The implementation of the method (with all of its code overhead) resides in the injectable component that can be tree-shaken.
 This allows the parent to communicate with the child (if it is present) in a type-safe manner.
 
-For example, the `LibCardComponent` now queries`LibHeaderToken` rather than `LibHeaderComponent`.
+For example, the `LibCardComponent` now queries `LibHeaderToken` rather than `LibHeaderComponent`.
 The following example shows how the pattern allows `LibCardComponent` to communicate with the `LibHeaderComponent` without actually referring to `LibHeaderComponent`.
 
 ```

aio/content/guide/migration-solution-style-tsconfig.md

@@ -1,55 +0,0 @@
-# Solution-style `tsconfig.json` migration
-
-## What does this migration do?
-
-This migration adds support to existing projects for TypeScript's new ["solution-style" tsconfig feature](https://devblogs.microsoft.com/typescript/announcing-typescript-3-9/#solution-style-tsconfig).
-
-Support is added by making two changes:
-
-1. Renaming the workspace-level `tsconfig.json` to `tsconfig.base.json`.
-All project [TypeScript configuration files](guide/typescript-configuration) will extend from this base which contains the common options used throughout the workspace.
-
-2. Adding the solution `tsconfig.json` file at the root of the workspace.
-This `tsconfig.json` file will only contain references to project-level TypeScript configuration files and is only used by editors/IDEs.
-
-As an example, the solution `tsconfig.json` for a new project is as follows:
-```json
-// This is a "Solution Style" tsconfig.json file, and is used by editors and TypeScript’s language server to improve development experience.
-// It is not intended to be used to perform a compilation.
-{
-  "files": [],
-  "references": [
-    {
-      "path": "./tsconfig.app.json"
-    },
-    {
-      "path": "./tsconfig.spec.json"
-    },
-    {
-      "path": "./e2e/tsconfig.json"
-    }
-  ]
-}
-```
-
-## Why is this migration necessary?
-
-Solution-style `tsconfig.json` files provide an improved editing experience and fix several long-standing defects when editing files in an IDE.
-IDEs that leverage the TypeScript language service (for example, [Visual Studio Code](https://code.visualstudio.com)), will only use TypeScript configuration files that are named `tsconfig.json`.
-In complex projects, there may be more than one compilation unit and each of these units may have different settings and options.
-
-With the Angular CLI, a project will have application code that will target a browser.
-It will also have unit tests that should not be included within the built application and that also need additional type information present (`jasmine` in this case).
-Both parts of the project also share some but not all of the code within the project.
-As a result, two separate TypeScript configuration files (`tsconfig.app.json` and `tsconfig.spec.json`) are needed to ensure that each part of the application is configured properly and that the right types are used for each part.
-Also if web workers are used within a project, an additional tsconfig (`tsconfig.worker.json`) is needed.
-Web workers use similar but incompatible types to the main browser application.
-This requires the additional configuration file to ensure that the web worker files use the appropriate types and will build successfully.
-
-While the Angular build system knows about all of these TypeScript configuration files, an IDE using TypeScript's language service does not.
-Because of this, an IDE will not be able to properly analyze the code from each part of the project and may generate false errors or make suggestions that are incorrect for certain files.
-By leveraging the new solution-style tsconfig, the IDE can now be aware of the configuration of each part of a project.
-This allows each file to be treated appropriately based on its tsconfig.
-IDE features such as error/warning reporting and auto-suggestion will operate more effectively as well.
-
-The TypeScript 3.9 release [blog post](https://devblogs.microsoft.com/typescript/announcing-typescript-3-9/#solution-style-tsconfig) also contains some additional information regarding this new feature.

aio/content/guide/migration-update-module-and-target-compiler-options.md

@@ -9,7 +9,7 @@ This process helps ensure that intentional changes to the options are kept in pl
 
 TypeScript Configuration File(s) | Changed Property | Existing Value | New Value
 ------------- | ------------- | ------------- | ------------- | -------------
-`<workspace base>/tsconfig.base.json` | `"module"` | `"esnext"` | `"es2020"`
+`<workspace base>/tsconfig.json` | `"module"` | `"esnext"` | `"es2020"`
 Used in `browser` builder options (`ng build` for applications) | `"module"` | `"esnext"` | `"es2020"`
 Used in `ng-packgr` builder options (`ng build` for libraries) | `"module"` | `"esnext"` | `"es2020"`
 Used in `karma` builder options (`ng test` for applications) | `"module"` | `"esnext"` | `"es2020"`

aio/content/guide/ngmodule-faq.md

@@ -101,7 +101,7 @@ should import `BrowserModule` from `@angular/platform-browser`.
 `BrowserModule` provides services that are essential to launch and run a browser app.
 
 `BrowserModule` also re-exports `CommonModule` from `@angular/common`,
-which means that components in the `AppModule` module also have access to
+which means that components in the `AppModule` also have access to
 the Angular directives every app needs, such as `NgIf` and `NgFor`.
 
 Do not import `BrowserModule` in any other module.
@@ -140,7 +140,7 @@ declared in this NgModule.
 You _can_ export any declarable class—components, directives, and pipes—whether
 it's declared in this NgModule or in an imported NgModule.
 
-You _can_ re-export entire imported NgModules, which effectively re-exports all of their exported classes.
+You _can_ re-export entire imported NgModules, which effectively re-export all of their exported classes.
 An NgModule can even export a module that it doesn't import.
 
 <hr/>
@@ -192,7 +192,7 @@ Its only purpose is to add http service providers to the application as a whole.
 
 The `forRoot()` static method is a convention that makes it easy for developers to configure services and providers that are intended to be singletons. A good example of `forRoot()` is the `RouterModule.forRoot()` method.
 
-Apps pass a `Routes` object to `RouterModule.forRoot()` in order to configure the app-wide `Router` service with routes.
+Apps pass a `Routes` array to `RouterModule.forRoot()` in order to configure the app-wide `Router` service with routes.
 `RouterModule.forRoot()` returns a [ModuleWithProviders](api/core/ModuleWithProviders).
 You add that result to the `imports` list of the root `AppModule`.
 

aio/content/guide/ngmodules.md

@@ -36,7 +36,7 @@ NgModule metadata does the following:
 * Declares which components, directives, and pipes belong to the module.
 * Makes some of those components, directives, and pipes public so that other module's component templates can use them.
 * Imports other modules with the components, directives, and pipes that components in the current module need.
-* Provides services that the other application components can use.
+* Provides services that other application components can use.
 
 Every Angular app has at least one module, the root module.
 You [bootstrap](guide/bootstrapping) that module to launch the application.

aio/content/guide/property-binding.md

@@ -223,6 +223,6 @@ content harmlessly. The following is the browser output
 of the `evilTitle` examples.
 
 <code-example language="bash">
-"Template <script>alert("evil never sleeps")</script> Syntax" is the interpolated evil title.
-"Template alert("evil never sleeps")Syntax" is the property bound evil title.
+"Template &lt;script&gt;alert("evil never sleeps")&lt;/script&gt; Syntax" is the interpolated evil title.
+"Template Syntax" is the property bound evil title.
 </code-example>

aio/content/guide/releases.md

@@ -102,7 +102,7 @@ The following table provides the status for Angular versions under support.
 Version | Status | Released     | Active Ends  | LTS Ends
 ------- | ------ | ------------ | ------------ | ------------
 ^10.0.0 | Active | Jun 24, 2020 | Dec 24, 2020 | Dec 24, 2021
-^9.0.0  | Active | Feb 06, 2020 | Aug 06, 2020 | Aug 06, 2021
+^9.0.0  | LTS    | Feb 06, 2020 | Aug 06, 2020 | Aug 06, 2021
 ^8.0.0  | LTS    | May 28, 2019 | Nov 28, 2019 | Nov 28, 2020
 
 Angular versions ^4.0.0, ^5.0.0, ^6.0.0 and ^7.0.0 are no longer under support.

aio/content/guide/router.md

@@ -2,10 +2,9 @@
 
 In a single-page app, you change what the user sees by showing or hiding portions of the display that correspond to particular components, rather than going out to the server to get a new page.
 As users perform application tasks, they need to move between the different [views](guide/glossary#view "Definition of view") that you have defined.
-To implement this kind of navigation within the single page of your app, you use the Angular **`Router`**.
 
-To handle the navigation from one [view](guide/glossary#view) to the next, you use the Angular _router_.
-The router enables navigation by interpreting a browser URL as an instruction to change the view.
+To handle the navigation from one [view](guide/glossary#view) to the next, you use the Angular **`Router`**.
+The **`Router`** enables navigation by interpreting a browser URL as an instruction to change the view.
 
 To explore a sample app featuring the router's primary features, see the <live-example></live-example>.
 

aio/content/guide/rx-library.md

@@ -53,7 +53,7 @@ RxJS provides many operators, but only a handful are used frequently. For a list
 
 | Area | Operators |
 | :------------| :----------|
-| Creation |  `from`,`fromEvent`, `of` |
+| Creation |  `from`, `fromEvent`, `of` |
 | Combination | `combineLatest`, `concat`, `merge`, `startWith` , `withLatestFrom`, `zip` |
 | Filtering | `debounceTime`, `distinctUntilChanged`, `filter`, `take`, `takeUntil` |
 | Transformation | `bufferTime`, `concatMap`, `map`, `mergeMap`, `scan`, `switchMap` |

aio/content/guide/service-worker-getting-started.md

@@ -107,7 +107,7 @@ Notice that all of the files the browser needs to render this application are ca
 <div class="alert is-helpful">
 Pay attention to two key points:
 
-1. The generated `ngsw-config.json` includes a limited list of cacheable fonts and images extentions. In some cases, you might want to modify the glob pattern to suit your needs.
+1. The generated `ngsw-config.json` includes a limited list of cacheable fonts and images extensions. In some cases, you might want to modify the glob pattern to suit your needs.
 
 1. If `resourcesOutputPath` or `assets` paths are modified after the generation of configuration file, you need to change the paths manually in `ngsw-config.json`.
 </div>

aio/content/guide/template-reference-variables.md

@@ -37,9 +37,9 @@ by HTML.
 
 <code-example path="template-reference-variables/src/app/app.component.html" region="ngForm" header="src/app/hero-form.component.html"></code-example>
 
-The reference value of itemForm, without the ngForm attribute value, would be
+The reference value of `itemForm`, without the `ngForm` attribute value, would be
 the [HTMLFormElement](https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement).
-There is, however, a difference between a Component and a Directive in that a `Component`
+There is, however, a difference between a `Component` and a `Directive` in that a `Component`
 will be referenced without specifying the attribute value, and a `Directive` will not
 change the implicit reference (that is, the element).
 

aio/content/guide/template-typecheck.md

@@ -114,6 +114,7 @@ In case of a false positive like these, there are a few options:
 |Strictness flag|Effect|
 |-|-|
 |`strictInputTypes`|Whether the assignability of a binding expression to the `@Input()` field is checked. Also affects the inference of directive generic types. |
+|`strictInputAccessModifiers`|Whether access modifiers such as `private`/`protected`/`readonly` are honored when assigning a binding expression to an `@Input()`. If disabled, the access modifiers of the `@Input` are ignored; only the type is checked.|
 |`strictNullInputTypes`|Whether `strictNullChecks` is honored when checking `@Input()` bindings (per `strictInputTypes`). Turning this off can be useful when using a library that was not built with `strictNullChecks` in mind.|
 |`strictAttributeTypes`|Whether to check `@Input()` bindings that are made using text attributes (for example, `<mat-tab label="Step 1">` vs `<mat-tab [label]="'Step 1'">`).
 |`strictSafeNavigationTypes`|Whether the return type of safe navigation operations (for example, `user?.name`) will be correctly inferred based on the type of `user`). If disabled, `user?.name` will be of type `any`.

aio/content/guide/testing-components-basics.md

@@ -375,6 +375,5 @@ Some noteworthy observations:
 When you're filtering by CSS selector and only testing properties of a browser's _native element_, the `By.css` approach may be overkill.
 
 It's often easier and more clear to filter with a standard `HTMLElement` method
-such as `querySelector()` or `querySelectorAll()`,
-as you'll see in the next set of tests.
+such as `querySelector()` or `querySelectorAll()`.
 

aio/content/guide/testing-components-scenarios.md

@@ -190,7 +190,7 @@ It knows who the user is based on a property of the injected `UserService`:
 <code-example path="testing/src/app/welcome/welcome.component.ts" header="app/welcome/welcome.component.ts"></code-example>
 
 The `WelcomeComponent` has decision logic that interacts with the service, logic that makes this component worth testing.
-Here's the testing module configuration for the spec file, `app/welcome/welcome.component.spec.ts`:
+Here's the testing module configuration for the spec file:
 
 <code-example path="testing/src/app/welcome/welcome.component.spec.ts" region="config-test-module" header="app/welcome/welcome.component.spec.ts"></code-example>
 
@@ -415,7 +415,7 @@ You do have to call [tick()](api/core/testing/tick) to advance the (virtual) clo
 Calling [tick()](api/core/testing/tick) simulates the passage of time until all pending asynchronous activities finish.
 In this case, it waits for the error handler's `setTimeout()`.
 
-The [tick()](api/core/testing/tick) function accepts milliseconds and tickOptions as parameters, the millisecond (defaults to 0 if not provided) parameter represents how much the virtual clock advances. For example, if you have a `setTimeout(fn, 100)` in a `fakeAsync()` test, you need to use tick(100) to trigger the fn callback. The tickOptions is an optional parameter with a property called `processNewMacroTasksSynchronously` (defaults to true) represents whether to invoke new generated macro tasks when ticking.
+The [tick()](api/core/testing/tick) function accepts milliseconds and tickOptions as parameters, the millisecond (defaults to 0 if not provided) parameter represents how much the virtual clock advances. For example, if you have a `setTimeout(fn, 100)` in a `fakeAsync()` test, you need to use tick(100) to trigger the fn callback. The tickOptions is an optional parameter with a property called `processNewMacroTasksSynchronously` (defaults to true) that represents whether to invoke new generated macro tasks when ticking.
 
 <code-example
   path="testing/src/app/demo/async-helper.spec.ts"
@@ -594,11 +594,6 @@ Then you can assert that the quote element displays the expected text.
 To use `waitForAsync()` functionality, you must import `zone.js/dist/zone-testing` in your test setup file.
 If you created your project with the Angular CLI, `zone-testing` is already imported in `src/test.ts`.
 
-The `fakeAsync()` utility function has a few limitations.
-In particular, it won't work if the test body makes an `XMLHttpRequest` (XHR) call.
-XHR calls within a test are rare so you can generally stick with [`fakeAsync()`](#fake-async).
-But if you ever do need to call `XMLHttpRequest`, you'll want to know about `waitForAsync()`.
-
 <div class="alert is-helpful">
 
 The `TestBed.compileComponents()` method (see [below](#compile-components)) calls `XHR`
@@ -1231,7 +1226,7 @@ and provide for _all_ services injected in _any_ component in the tree.
 That's too much effort just to answer a few simple questions about links.
 
 This section describes two techniques for minimizing the setup.
-Use them, alone or in combination, to stay focused on the testing the primary component.
+Use them, alone or in combination, to stay focused on testing the primary component.
 
 {@a stub-component}
 
@@ -1340,7 +1335,7 @@ The `HostListener` wires the click event of the host element
 Clicking the anchor should trigger the `onClick()` method,
 which sets the stub's telltale `navigatedTo` property.
 Tests inspect `navigatedTo` to confirm that clicking the anchor
-set the expected route definition.
+sets the expected route definition.
 
 <div class="alert is-helpful">
 
@@ -1573,7 +1568,7 @@ calls to other `TestBed` static methods such as `compileComponents()`.
 In this example, the `BannerComponent` is the only component to compile.
 Other examples configure the testing module with multiple components
 and may import application modules that hold yet more components.
-Any of them could be require external files.
+Any of them could require external files.
 
 The `TestBed.compileComponents` method asynchronously compiles all components configured in the testing module.
 

aio/content/guide/testing-utility-apis.md

@@ -19,7 +19,7 @@ Here's a summary of the stand-alone functions, in order of likely utility:
 
   <tr>
     <td style="vertical-align: top">
-      <code>async</code>
+      <code>waitForAsync</code>
     </td>
 
     <td>

aio/content/guide/testing.md

@@ -75,7 +75,7 @@ The tests run again, the browser refreshes, and the new test results appear.
 
 The CLI takes care of Jasmine and Karma configuration for you.
 
-You can fine-tune many options by editing the `karma.conf.js` and
+You can fine-tune many options by editing the `karma.conf.js` in the root folder of the project and
 the `test.ts` files in the `src/` folder.
 
 The `karma.conf.js` file is a partial Karma configuration file.
@@ -217,7 +217,7 @@ script:
   - npm run e2e -- --protractor-config=e2e/protractor-ci.conf.js
 ```
 
-This does the same things as the Circle CI configuration, except that Travis doesn't come with Chrome, so we use Chromium instead.
+This does the same things as the CircleCI configuration, except that Travis doesn't come with Chrome, so use Chromium instead.
 
 Step 2: Commit your changes and push them to your repository.
 

aio/content/guide/typescript-configuration.md

@@ -18,32 +18,7 @@ that are important to Angular developers, including details about the following
 ## Configuration files
 
 A given Angular workspace contains several TypeScript configuration files.
-At the root level, there are two main TypeScript configuration files: a `tsconfig.json` file and a `tsconfig.base.json` file.
-
-The `tsconfig.json` file is a ["Solution Style"](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-9.html#support-for-solution-style-tsconfigjson-files) TypeScript configuration file.
-Code editors and TypeScript’s language server use this file to improve development experience.
-Compilers do not use this file.
-
-The `tsconfig.json` file contains a list of paths to the other TypeScript configuration files used in the workspace.
-
-<code-example lang="json" header="tsconfig.json" linenums="false">
-{
- "files": [],
- "references": [
-   {
-     "path": "./tsconfig.app.json"
-   },
-   {
-     "path": "./tsconfig.spec.json"
-   },
-   {
-     "path": "./projects/my-lib/tsconfig.lib.json"
-   }
- ]
-}
-</code-example>
-
-The `tsconfig.base.json` file specifies the base TypeScript and Angular compiler options that all projects in the workspace inherit.
+At the root `tsconfig.json` file specifies the base TypeScript and Angular compiler options that all projects in the workspace inherit.
 
 The TypeScript and Angular have a wide range of options which can be used to configure type-checking features and generated output.
 For more information, see the [Configuration inheritance with extends](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html#configuration-inheritance-with-extends) section of the TypeScript documentation.
@@ -55,9 +30,9 @@ For details about configuration inheritance, see the [Configuration inheritance
 
 </div>
 
-The initial `tsconfig.base.json` for an Angular workspace typically looks like the following example.
+The initial `tsconfig.json` for an Angular workspace typically looks like the following example.
 
-<code-example lang="json" header="tsconfig.base.json" linenums="false">
+<code-example lang="json" header="tsconfig.json" linenums="false">
 {
   "compileOnSave": false,
   "compilerOptions": {

aio/content/guide/universal.md

@@ -48,8 +48,7 @@ src/
   app/ ...                   <i>application code</i>
     app.server.module.ts     <i>* server-side application module</i>
 server.ts                    <i>* express web server</i>
-tsconfig.json                <i>TypeScript solution style configuration</i>
-tsconfig.base.json           <i>TypeScript base configuration</i>
+tsconfig.json                <i>TypeScript base configuration</i>
 tsconfig.app.json            <i>TypeScript browser application configuration</i>
 tsconfig.server.json         <i>TypeScript server application configuration</i>
 tsconfig.spec.json           <i>TypeScript tests configuration</i>

aio/content/guide/updating-to-version-10.md

@@ -77,6 +77,5 @@ Read about the migrations the CLI handles for you automatically:
 
 * [Migrating missing `@Directive()`/`@Component()` decorators](guide/migration-undecorated-classes)
 * [Migrating `ModuleWithProviders`](guide/migration-module-with-providers)
-* [Solution-style `tsconfig.json` migration](guide/migration-solution-style-tsconfig)
 * [`tslib` direct dependency migration](guide/migration-update-libraries-tslib)
 * [Update `module` and `target` compiler options migration](guide/migration-update-module-and-target-compiler-options)

aio/content/guide/web-worker.md

@@ -14,12 +14,16 @@ The CLI does not support running Angular itself in a web worker.
 
 To add a web worker to an existing project, use the Angular CLI `ng generate` command.
 
-`ng generate web-worker` *location*
+```bash
+ng generate web-worker <location>
+```
 
 You can add a web worker anywhere in your application.
 For example, to add a web worker to the root component, `src/app/app.component.ts`, run the following command.
 
-`ng generate web-worker app`
+```bash
+ng generate web-worker app
+```
 
 The command performs the following actions.
 

aio/content/marketing/contributors.json

@@ -86,24 +86,6 @@
     "groups": ["Angular"],
     "lead": "kara"
   },
-  "matsko": {
-    "name": "Matias Niemela",
-    "picture": "matias.jpg",
-    "twitter": "yearofmoo",
-    "website": "http://yearofmoo.com",
-    "bio": "Matias Niemela is a fullstack web developer who has been programming & building websites for over 10 years, and a core team member of AngularJS for two years. In the spring of 2015 Matias joined Angular full time at Google. In his free time Matias loves to build complex things and is always up for public speaking, travelling and tweaking his current Vim setup.",
-    "groups": ["Angular"],
-    "lead": "kara"
-  },
-  "kara": {
-    "name": "Kara Erickson",
-    "picture": "kara-erickson.jpg",
-    "twitter": "karaforthewin",
-    "website": "https://github.com/kara",
-    "bio": "Kara is a software engineer on the Angular team at Google and a co-organizer of the Angular-SF Meetup. Prior to Google, she helped build UI components in Angular for guest management systems at OpenTable.  She enjoys snacking indiscriminately and probably other things too.",
-    "groups": ["Angular"],
-    "lead": "igorminar"
-  },
   "pkozlowski-opensource": {
     "name": "Pawel Kozlowski",
     "picture": "pawel.jpg",
@@ -618,26 +600,6 @@
     "bio": "Justin (aka Schwarty) is a Google Developer Expert in Web Technologies and Angular, the host and maintainer of the weekly AngularAir live video broadcast, educator, writer and content creator. He has Angular courses available on LinkedIn Learning and Pluralsight and loves passing on years of full stack development knowledge to help empower others to find their inner awesomeness!",
     "groups": ["GDE"]
   },
-  "dennispbrown": {
-    "name": "Denny Brown",
-    "picture": "denny.jpg",
-    "bio": "Denny is founder of Expert Support, a professional services firm specializing in technical communication, and leads the Angular technical writing team. His lifelong passion has been to reduce the time and effort required to understand complex technical information. Early on, he was Associate Chairman of the Computer Science Department at Stanford, where he taught introductory courses in programming. He also plays old-timers baseball in local leagues and national tournaments.",
-    "groups": ["Angular"],
-    "lead": "aikidave"
-  },
-  "jbogarthyde": {
-    "name": "Judy Bogart",
-    "picture": "judy.png",
-    "groups": ["Angular"],
-    "lead": "dennispbrown"
-  },
-  "rockument69": {
-    "name": "Tony Bove",
-    "picture": "rockument69.jpg",
-    "bio": "Tony is a technical writer with Expert Support. His lifelong passions are helping people use technology, writing fiction, and playing music. When he's not working or playing the harmonica with friends in a bluegrass band, he's swimming and snorkeling on a Kauai beach and playing ball with his Irish Wolfhound. He's worked at home for decades before it became a thing.",
-    "groups": ["Angular"],
-    "lead": "aikidave"
-  },
   "kapunahelewong": {
     "name": "Kapunahele Wong",
     "picture": "kapunahele.jpg",
@@ -751,9 +713,9 @@
   "santosh": {
     "name": "Santosh Yadav",
     "picture": "santoshyadav.jpg",
-    "twitter": "Santosh19742211",
+    "twitter": "SantoshYadavDev",
     "website": "https://www.santoshyadav.dev",
-    "bio": "Santosh is a GDE for Angular and Web Technologies and loves to contribute to Open Source. He is the creator of ng deploy for netlify and core team member for NestJS Addons. He writes for AngularInDepth, mentors for DotNetTricks, organizes Pune Tech Meetup, and conducts free workshops on Angular.",
+    "bio": "Santosh is a GDE for Angular and loves to contribute to Open Source. He is the creator of ng deploy for netlify and core team member for NestJS Addons. He writes for AngularInDepth, mentors for DotNetTricks, organizes Pune Tech Meetup, and conducts free workshops on Angular.",
     "groups": ["GDE"]
   },
   "josephperrott": {
@@ -848,5 +810,21 @@
     "website": "kreuzercode.com",
     "bio": "Kevin is a passionate freelance front-end engineer and Google Developer Expert based in Switzerland. He is a JavaScript enthusiast and fascinated by Angular. Kevin always tries to learn new things, expand his knowledge, and share it with others in the form of blog posts, workshops, podcasts, or presentations. He is a writer for various publications and the most active writer on Angular in-depth in 2019. Contributing to multiple projects and maintaining 7 npm packages, Kevin is also a big believer in open source. Furthermore, Kevin is a big football fan. Since his childhood, he has supported Real Madrid, which you might notice in a lot of his blog posts and tutorials.",
     "groups": ["GDE"]
+  },
+  "samvloeberghs": {
+    "name": "Sam Vloeberghs",
+    "picture": "samvloeberghs.jpg",
+    "groups": ["GDE"],
+    "twitter": "samvloeberghs",
+    "website": "https://samvloeberghs.be",
+    "bio": "Sam is a freelance software architect and Internet entrepreneur, currently focusing on frontend technologies. Co-organiser of the Belgian Angular conference NG-BE and Angular Belgium Meetup group."
+  },
+  "thekiba": {
+    "name": "Andrew Grekov",
+    "picture": "thekiba.jpg",
+    "twitter": "thekiba_io",
+    "website": "https://thekiba.io",
+    "bio": "Andrew is a software engineer using Angular and .NET. He spends most of his spare time staying up-to-date, helping other people, and experimenting with web tech.",
+    "groups": ["GDE"]
   }
 }

aio/content/marketing/resources.json

@@ -30,10 +30,10 @@
             "url": "https://dev.to/t/angular",
             "title": "DEV Community"
           },
-          "angular-in-depth": {
-            "desc": "The place where advanced Angular concepts are explained",
-            "url": "https://blog.angularindepth.com",
-            "title": "Angular In Depth"
+          "indepth-dev": {
+            "desc": "Peer-reviewed Angular articles and tutorials.",
+            "url": "https://indepth.dev/angular/",
+            "title": "Angular inDepth"
           }
         }
       },
@@ -63,6 +63,12 @@
             "logo": "",
             "title": "NgRuAir",
             "url": "https://github.com/ngRuAir/ngruair"
+          },
+          "the-deep-dive": {
+            "desc": "The advanced web development podcast about Angular, RxJS, TypeScript and other technologies. English, audio only.",
+            "logo": "https://i.imgur.com/mmE5Feq.jpg",
+            "title": "The Deep Dive",
+            "url": "https://thedeepdive.simplecast.com"
           }
         }
       }
@@ -429,6 +435,12 @@
             "desc": "Jigsaw provides a set of web components based on Angular. It is supporting the development of all applications of Big Data Product of ZTE (https://www.zte.com.cn).",
             "title": "Awade Jigsaw (Chinese)",
             "url": "https://jigsaw-zte.gitee.io"
+          },
+          "material-dayjs-adapter": {
+            "desc": "A DayJS implementation of @angular/material's DateAdapter that results in smaller bundle sizes than its MomentJS counterpart.",
+            "rev": true,
+            "title": "material-dayjs-adapter",
+            "url": "https://www.npmjs.com/package/@tabuckner/material-dayjs-adapter"
           }
         }
       }

aio/content/start/start-data.md

@@ -40,7 +40,7 @@ A later part of this tutorial, [Use forms for user input](start/start-forms "Try
 
         <code-example header="src/app/cart.service.ts" path="getting-started/src/app/cart.service.1.ts"></code-example>
 
-    <div class="alert is-helpful>
+    <div class="alert is-helpful">
 
     The StackBlitz generator might provide the cart service in `app.module.ts` by default. That differs from the example, which uses a bundle-optimization technique, an  `@Injectable()` decorator with the `{ providedIn: 'root' }` statement.
     For more information about services, see [Introduction to Services and Dependency Injection](guide/architecture-services "Concepts > Intro to Services and DI").
@@ -236,7 +236,7 @@ For more information about services, see [Introduction to Services and Dependenc
 <!-- Accessing data with the HTTP client -->
 
 Servers often return data in the form of a stream.
-Streams are useful because they make it easy to transform the returned data and  make modifications to the way you request that data.
+Streams are useful because they make it easy to transform the returned data and make modifications to the way you request that data.
 The Angular HTTP client, `HttpClient`, is a built-in way to fetch data from external APIs and provide them to your app as a stream.
 
 This section shows you how to use the HTTP client to retrieve shipping prices from an external file.

aio/content/tutorial/toh-pt4.md

@@ -385,7 +385,6 @@ next section on [Routing](tutorial/toh-pt5).
 path="toh-pt4/src/app/heroes/heroes.component.ts">
 </code-example>
 
-The browser refreshes and the page displays the list of heroes.
 Refresh the browser to see the list of heroes, and scroll to the bottom to see the
 messages from the HeroService. Each time you click a hero, a new message appears to record
 the selection. Use the "clear" button to clear the message history.

aio/package.json

@@ -23,7 +23,7 @@
     "build-local-with-viewengine": "yarn ~~build",
     "prebuild-local-with-viewengine-ci": "node scripts/switch-to-viewengine && yarn setup-local-ci",
     "build-local-with-viewengine-ci": "yarn ~~build --progress=false",
-    "extract-cli-command-docs": "node tools/transforms/cli-docs-package/extract-cli-commands.js b0b27361d",
+    "extract-cli-command-docs": "node tools/transforms/cli-docs-package/extract-cli-commands.js ef770f1cb",
     "lint": "yarn check-env && yarn docs-lint && ng lint && yarn example-lint && yarn tools-lint",
     "test": "yarn check-env && ng test",
     "pree2e": "yarn check-env && yarn update-webdriver",

aio/src/app/custom-elements/contributor/contributor-list.component.spec.ts

@@ -1,4 +1,4 @@
-import { ReflectiveInjector } from '@angular/core';
+import { Injector } from '@angular/core';
 
 import { of } from 'rxjs';
 
@@ -12,20 +12,22 @@ import { LocationService } from 'app/shared/location.service';
 describe('ContributorListComponent', () => {
 
   let component: ContributorListComponent;
-  let injector: ReflectiveInjector;
+  let injector: Injector;
   let contributorService: TestContributorService;
   let locationService: TestLocationService;
   let contributorGroups: ContributorGroup[];
 
   beforeEach(() => {
-    injector = ReflectiveInjector.resolveAndCreate([
-      ContributorListComponent,
-      {provide: ContributorService, useClass: TestContributorService },
-      {provide: LocationService, useClass: TestLocationService }
-    ]);
+    injector = Injector.create({
+      providers: [
+        {provide: ContributorListComponent, deps: [ContributorService, LocationService] },
+        {provide: ContributorService, useClass: TestContributorService, deps: [] },
+        {provide: LocationService, useClass: TestLocationService, deps: [] }
+      ]
+    });
 
-    locationService = injector.get(LocationService);
-    contributorService = injector.get(ContributorService);
+    locationService = injector.get(LocationService) as unknown as TestLocationService;
+    contributorService = injector.get(ContributorService) as unknown as TestContributorService;
     contributorGroups = contributorService.testContributors;
   });
 

aio/src/app/custom-elements/resource/resource-list.component.spec.ts

@@ -1,4 +1,4 @@
-import { ReflectiveInjector } from '@angular/core';
+import { Injector } from '@angular/core';
 
 import { of } from 'rxjs';
 
@@ -12,20 +12,22 @@ import { Category } from './resource.model';
 describe('ResourceListComponent', () => {
 
   let component: ResourceListComponent;
-  let injector: ReflectiveInjector;
+  let injector: Injector;
   let resourceService: TestResourceService;
   let locationService: TestLocationService;
   let categories: Category[];
 
   beforeEach(() => {
-    injector = ReflectiveInjector.resolveAndCreate([
-      ResourceListComponent,
-      {provide: ResourceService, useClass: TestResourceService },
-      {provide: LocationService, useClass: TestLocationService }
-    ]);
+    injector = Injector.create({
+      providers: [
+        {provide: ResourceListComponent, deps: [ResourceService, LocationService] },
+        {provide: ResourceService, useClass: TestResourceService, deps: [] },
+        {provide: LocationService, useClass: TestLocationService, deps: [] }
+      ]
+    });
 
-    locationService = injector.get(LocationService);
-    resourceService = injector.get(ResourceService);
+    locationService = injector.get(LocationService) as unknown as TestLocationService;
+    resourceService = injector.get(ResourceService) as unknown as TestResourceService;
     categories = resourceService.testCategories;
   });
 

aio/src/app/search/search.service.spec.ts

@@ -1,4 +1,4 @@
-import { ReflectiveInjector, NgZone } from '@angular/core';
+import { Injector, NgZone } from '@angular/core';
 import { fakeAsync, tick } from '@angular/core/testing';
 import { of } from 'rxjs';
 import { SearchService } from './search.service';
@@ -6,7 +6,7 @@ import { WebWorkerClient } from 'app/shared/web-worker';
 
 describe('SearchService', () => {
 
-  let injector: ReflectiveInjector;
+  let injector: Injector;
   let service: SearchService;
   let sendMessageSpy: jasmine.Spy;
   let mockWorker: WebWorkerClient;
@@ -16,10 +16,13 @@ describe('SearchService', () => {
     mockWorker = { sendMessage: sendMessageSpy } as any;
     spyOn(WebWorkerClient, 'create').and.returnValue(mockWorker);
 
-    injector = ReflectiveInjector.resolveAndCreate([
-        SearchService,
-        { provide: NgZone, useFactory: () => new NgZone({ enableLongStackTrace: false }) }
-    ]);
+    injector = Injector.create({
+      providers: [
+        { provide: SearchService, deps: [NgZone]},
+        { provide: NgZone, useFactory: () => new NgZone({ enableLongStackTrace: false }), deps: [] }
+      ]
+    });
+
     service = injector.get(SearchService);
   });
 

aio/src/app/shared/deployment.service.spec.ts

@@ -1,4 +1,4 @@
-import { ReflectiveInjector } from '@angular/core';
+import { Injector } from '@angular/core';
 import { environment } from 'environments/environment';
 import { LocationService } from 'app/shared/location.service';
 import { MockLocationService } from 'testing/location.service';
@@ -15,7 +15,7 @@ describe('Deployment service', () => {
     it('should get the mode from the `mode` query parameter if available', () => {
       const injector = getInjector();
 
-      const locationService: MockLocationService = injector.get(LocationService);
+      const locationService = injector.get(LocationService) as unknown as MockLocationService;
       locationService.search.and.returnValue({ mode: 'bar' });
 
       const deployment = injector.get(Deployment);
@@ -25,8 +25,8 @@ describe('Deployment service', () => {
 });
 
 function getInjector() {
-  return ReflectiveInjector.resolveAndCreate([
-    Deployment,
-    { provide: LocationService, useFactory: () => new MockLocationService('') }
-  ]);
+  return Injector.create({providers: [
+    { provide: Deployment, deps: [LocationService] },
+    { provide: LocationService, useFactory: () => new MockLocationService(''), deps: [] }
+  ]});
 }

aio/src/app/shared/ga.service.spec.ts

@@ -1,18 +1,23 @@
-import { ReflectiveInjector } from '@angular/core';
+import { Injector } from '@angular/core';
 
 import { GaService } from 'app/shared/ga.service';
 import { WindowToken } from 'app/shared/window';
 
 describe('GaService', () => {
   let gaService: GaService;
-  let injector: ReflectiveInjector;
+  let injector: Injector;
   let gaSpy: jasmine.Spy;
   let mockWindow: any;
 
   beforeEach(() => {
     gaSpy = jasmine.createSpy('ga');
     mockWindow = { ga: gaSpy };
-    injector = ReflectiveInjector.resolveAndCreate([GaService, { provide: WindowToken, useFactory: () => mockWindow }]);
+    injector = Injector.create({
+      providers: [
+        { provide: GaService, deps: [WindowToken] },
+        { provide: WindowToken, useFactory: () => mockWindow, deps: [] }
+      ]});
+
     gaService = injector.get(GaService);
   });
 

aio/src/app/shared/location.service.spec.ts

@@ -1,4 +1,4 @@
-import { ReflectiveInjector } from '@angular/core';
+import { Injector } from '@angular/core';
 import { Location, LocationStrategy, PlatformLocation } from '@angular/common';
 import { MockLocationStrategy } from '@angular/common/testing';
 import { Subject } from 'rxjs';
@@ -9,26 +9,28 @@ import { LocationService } from './location.service';
 import { ScrollService } from './scroll.service';
 
 describe('LocationService', () => {
-  let injector: ReflectiveInjector;
+  let injector: Injector;
   let location: MockLocationStrategy;
   let service: LocationService;
   let swUpdates: MockSwUpdatesService;
   let scrollService: MockScrollService;
 
   beforeEach(() => {
-    injector = ReflectiveInjector.resolveAndCreate([
-        LocationService,
-        Location,
-        { provide: GaService, useClass: TestGaService },
-        { provide: LocationStrategy, useClass: MockLocationStrategy },
-        { provide: PlatformLocation, useClass: MockPlatformLocation },
-        { provide: SwUpdatesService, useClass: MockSwUpdatesService },
-        { provide: ScrollService, useClass: MockScrollService }
-    ]);
+    injector = Injector.create({
+      providers: [
+        { provide: LocationService, deps: [GaService, Location, ScrollService, PlatformLocation, SwUpdatesService] },
+        { provide: Location, deps: [LocationStrategy, PlatformLocation] },
+        { provide: GaService, useClass: TestGaService, deps: [] },
+        { provide: LocationStrategy, useClass: MockLocationStrategy, deps: [] },
+        { provide: PlatformLocation, useClass: MockPlatformLocation, deps: [] },
+        { provide: SwUpdatesService, useClass: MockSwUpdatesService, deps: [] },
+        { provide: ScrollService, useClass: MockScrollService, deps: [] }
+      ]
+    });
 
-    location  = injector.get(LocationStrategy);
-    service  = injector.get(LocationService);
-    swUpdates  = injector.get(SwUpdatesService);
+    location = injector.get(LocationStrategy) as unknown as MockLocationStrategy;
+    service = injector.get(LocationService);
+    swUpdates = injector.get(SwUpdatesService) as unknown as MockSwUpdatesService;
     scrollService = injector.get(ScrollService);
   });
 
@@ -380,7 +382,7 @@ describe('LocationService', () => {
     let platformLocation: MockPlatformLocation;
 
     beforeEach(() => {
-      platformLocation = injector.get(PlatformLocation);
+      platformLocation = injector.get(PlatformLocation) as unknown as MockPlatformLocation;
     });
 
     it('should call replaceState on PlatformLocation', () => {
@@ -577,7 +579,7 @@ describe('LocationService', () => {
     let gaLocationChanged: jasmine.Spy;
 
     beforeEach(() => {
-      const gaService = injector.get(GaService);
+      const gaService = injector.get(GaService) as unknown as TestGaService;
       gaLocationChanged = gaService.locationChanged;
       // execute currentPath observable so that gaLocationChanged is called
       service.currentPath.subscribe();

aio/src/app/shared/logger.service.spec.ts

@@ -1,4 +1,4 @@
-import { ErrorHandler, ReflectiveInjector } from '@angular/core';
+import { ErrorHandler, Injector } from '@angular/core';
 import { Logger } from './logger.service';
 
 describe('logger service', () => {
@@ -10,10 +10,10 @@ describe('logger service', () => {
   beforeEach(() => {
     logSpy = spyOn(console, 'log');
     warnSpy = spyOn(console, 'warn');
-    const injector = ReflectiveInjector.resolveAndCreate([
-      Logger,
-      { provide: ErrorHandler, useClass: MockErrorHandler }
-    ]);
+    const injector = Injector.create({providers: [
+      { provide: Logger, deps: [ErrorHandler] },
+      { provide: ErrorHandler, useClass: MockErrorHandler, deps: [] }
+    ]});
     logger = injector.get(Logger);
     errorHandler = injector.get(ErrorHandler);
   });

aio/src/app/shared/reporting-error-handler.spec.ts

@@ -1,4 +1,4 @@
-import { ErrorHandler, ReflectiveInjector } from '@angular/core';
+import { ErrorHandler, Injector } from '@angular/core';
 import { TestBed } from '@angular/core/testing';
 import { WindowToken } from 'app/shared/window';
 import { AppModule } from 'app/app.module';
@@ -14,11 +14,12 @@ describe('ReportingErrorHandler service', () => {
     onerrorSpy = jasmine.createSpy('onerror');
     superHandler = spyOn(ErrorHandler.prototype, 'handleError');
 
-    const injector = ReflectiveInjector.resolveAndCreate([
-      { provide: ErrorHandler, useClass: ReportingErrorHandler },
-      { provide: WindowToken, useFactory: () => ({ onerror: onerrorSpy }) }
-    ]);
-    handler = injector.get(ErrorHandler);
+    const injector = Injector.create({providers: [
+      { provide: ErrorHandler, useClass: ReportingErrorHandler, deps: [WindowToken] },
+      { provide: WindowToken, useFactory: () => ({ onerror: onerrorSpy }), deps: [] }
+    ]});
+
+    handler = injector.get(ErrorHandler) as unknown as ReportingErrorHandler;
   });
 
   it('should be registered on the AppModule', () => {

aio/src/app/shared/scroll-spy.service.spec.ts

@@ -1,4 +1,4 @@
-import { Injector, ReflectiveInjector } from '@angular/core';
+import { Injector } from '@angular/core';
 import { fakeAsync, tick } from '@angular/core/testing';
 import { DOCUMENT } from '@angular/common';
 
@@ -151,11 +151,11 @@ describe('ScrollSpyService', () => {
   let scrollSpyService: ScrollSpyService;
 
   beforeEach(() => {
-    injector = ReflectiveInjector.resolveAndCreate([
+    injector = Injector.create({providers: [
       { provide: DOCUMENT, useValue: { body: {} } },
       { provide: ScrollService, useValue: { topOffset: 50 } },
-      ScrollSpyService
-    ]);
+      { provide: ScrollSpyService, deps: [DOCUMENT, ScrollService] }
+    ]});
 
     scrollSpyService = injector.get(ScrollSpyService);
   });

aio/src/app/shared/scroll.service.spec.ts

@@ -1,7 +1,7 @@
 import {Location, LocationStrategy, PlatformLocation, ViewportScroller} from '@angular/common';
 import {DOCUMENT} from '@angular/common';
 import {MockLocationStrategy, SpyLocation} from '@angular/common/testing';
-import {ReflectiveInjector} from '@angular/core';
+import {Injector} from '@angular/core';
 import {fakeAsync, tick} from '@angular/core/testing';
 
 import {ScrollService, topMargin} from './scroll.service';
@@ -15,7 +15,7 @@ describe('ScrollService', () => {
   };
 
   const topOfPageElem = {} as Element;
-  let injector: ReflectiveInjector;
+  let injector: Injector;
   let document: MockDocument;
   let platformLocation: MockPlatformLocation;
   let scrollService: ScrollService;
@@ -41,21 +41,25 @@ describe('ScrollService', () => {
       jasmine.createSpyObj('viewportScroller', ['getScrollPosition', 'scrollToPosition']);
 
   beforeEach(() => {
-    injector = ReflectiveInjector.resolveAndCreate([
-      {
-        provide: ScrollService,
-        useFactory: createScrollService,
-        deps: [DOCUMENT, PlatformLocation, ViewportScroller, Location],
-      },
-      {provide: Location, useClass: SpyLocation}, {provide: DOCUMENT, useClass: MockDocument},
-      {provide: PlatformLocation, useClass: MockPlatformLocation},
-      {provide: ViewportScroller, useValue: viewportScrollerStub},
-      {provide: LocationStrategy, useClass: MockLocationStrategy}
-    ]);
+    injector = Injector.create( {
+      providers: [
+        {
+          provide: ScrollService,
+          useFactory: createScrollService,
+          deps: [DOCUMENT, PlatformLocation, ViewportScroller, Location],
+        },
+        {provide: Location, useClass: SpyLocation, deps: [] },
+        {provide: DOCUMENT, useClass: MockDocument, deps: []},
+        {provide: PlatformLocation, useClass: MockPlatformLocation, deps: []},
+        {provide: ViewportScroller, useValue: viewportScrollerStub},
+        {provide: LocationStrategy, useClass: MockLocationStrategy, deps: []}
+      ]
+    });
+
     platformLocation = injector.get(PlatformLocation);
-    document = injector.get(DOCUMENT);
+    document = injector.get(DOCUMENT) as unknown as MockDocument;
     scrollService = injector.get(ScrollService);
-    location = injector.get(Location);
+    location = injector.get(Location) as unknown as SpyLocation;
 
     spyOn(window, 'scrollBy');
   });

aio/src/app/shared/toc.service.spec.ts

@@ -1,5 +1,5 @@
 import { DOCUMENT } from '@angular/common';
-import { ReflectiveInjector } from '@angular/core';
+import { Injector } from '@angular/core';
 import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
 import { Subject } from 'rxjs';
 
@@ -7,7 +7,7 @@ import { ScrollItem, ScrollSpyInfo, ScrollSpyService } from 'app/shared/scroll-s
 import { TocItem, TocService } from './toc.service';
 
 describe('TocService', () => {
-  let injector: ReflectiveInjector;
+  let injector: Injector;
   let scrollSpyService: MockScrollSpyService;
   let tocService: TocService;
   let lastTocList: TocItem[];
@@ -21,13 +21,14 @@ describe('TocService', () => {
   }
 
   beforeEach(() => {
-    injector = ReflectiveInjector.resolveAndCreate([
-      { provide: DomSanitizer, useClass: TestDomSanitizer },
+    injector = Injector.create({providers: [
+      { provide: DomSanitizer, useClass: TestDomSanitizer, deps: [] },
       { provide: DOCUMENT, useValue: document },
-      { provide: ScrollSpyService, useClass: MockScrollSpyService },
-      TocService,
-    ]);
-    scrollSpyService = injector.get(ScrollSpyService);
+      { provide: ScrollSpyService, useClass: MockScrollSpyService, deps: [] },
+      { provide: TocService, deps: [DOCUMENT, DomSanitizer, ScrollSpyService] },
+    ]});
+
+    scrollSpyService = injector.get(ScrollSpyService) as unknown as MockScrollSpyService;
     tocService = injector.get(TocService);
     tocService.tocList.subscribe(tocList => lastTocList = tocList);
   });
@@ -330,7 +331,7 @@ describe('TocService', () => {
     });
 
     it('should have bypassed HTML sanitizing of heading\'s innerHTML ', () => {
-      const domSanitizer: TestDomSanitizer = injector.get(DomSanitizer);
+      const domSanitizer: TestDomSanitizer = injector.get(DomSanitizer) as unknown as TestDomSanitizer;
       expect(domSanitizer.bypassSecurityTrustHtml)
         .toHaveBeenCalledWith('Setup to develop <i>locally</i>.');
     });

aio/src/app/sw-updates/sw-updates.service.spec.ts

@@ -1,4 +1,4 @@
-import { ApplicationRef, ReflectiveInjector } from '@angular/core';
+import { ApplicationRef, Injector } from '@angular/core';
 import { discardPeriodicTasks, fakeAsync, tick } from '@angular/core/testing';
 import { SwUpdate } from '@angular/service-worker';
 import { Subject } from 'rxjs';
@@ -8,7 +8,7 @@ import { SwUpdatesService } from './sw-updates.service';
 
 
 describe('SwUpdatesService', () => {
-  let injector: ReflectiveInjector;
+  let injector: Injector;
   let appRef: MockApplicationRef;
   let service: SwUpdatesService;
   let swu: MockSwUpdate;
@@ -21,16 +21,16 @@ describe('SwUpdatesService', () => {
   //   run `setup()`/`tearDown()` in `beforeEach()`/`afterEach()` blocks. We use the `run()` helper
   //   to call them inside each test's zone.
   const setup = (isSwUpdateEnabled: boolean) => {
-    injector = ReflectiveInjector.resolveAndCreate([
-      { provide: ApplicationRef, useClass: MockApplicationRef },
-      { provide: Logger, useClass: MockLogger },
-      { provide: SwUpdate, useFactory: () => new MockSwUpdate(isSwUpdateEnabled) },
-      SwUpdatesService
-    ]);
+    injector = Injector.create({providers: [
+      { provide: ApplicationRef, useClass: MockApplicationRef, deps: [] },
+      { provide: Logger, useClass: MockLogger, deps: [] },
+      { provide: SwUpdate, useFactory: () => new MockSwUpdate(isSwUpdateEnabled), deps: [] },
+      { provide: SwUpdatesService, deps: [ApplicationRef, Logger, SwUpdate] }
+    ]});
 
-    appRef = injector.get(ApplicationRef);
+    appRef = injector.get(ApplicationRef) as unknown as MockApplicationRef;
     service = injector.get(SwUpdatesService);
-    swu = injector.get(SwUpdate);
+    swu = injector.get(SwUpdate) as unknown as MockSwUpdate;
     checkInterval = (service as any).checkInterval;
   };
   const tearDown = () => service.ngOnDestroy();

aio/src/styles/0-base/_typography.scss

@@ -214,7 +214,7 @@ code {
         margin-left: 2px;
         position: relative;
         @include line-height(24);
-        vertical-align: bottom; 
+        vertical-align: middle;
       }
     }
 

aio/tests/e2e/src/app.e2e-spec.ts

@@ -99,10 +99,11 @@ describe('site App', function() {
   describe('scrolling to the top', () => {
     it('should scroll to the top when navigating to another page', () => {
       page.navigateTo('guide/security');
-
       page.scrollTo('bottom');
       expect(page.getScrollTop()).toBeGreaterThan(0);
-
+      // Navigate to Reference section, then check
+      // Find the navigation item that has the text "api"
+      page.click(page.getNavItem(/reference/i));
       page.click(page.getNavItem(/api/i));
       expect(page.locationPath()).toBe('/api');
       expect(page.getScrollTop()).toBe(0);

browser-providers.conf.js

@@ -12,8 +12,10 @@
 // If a category becomes empty (e.g. BS and required), then the corresponding job must be commented
 // out in the CI configuration.
 var CIconfiguration = {
-  'Chrome': {unitTest: {target: 'SL', required: true}, e2e: {target: null, required: true}},
-  'Firefox': {unitTest: {target: 'SL', required: true}, e2e: {target: null, required: true}},
+  // Chrome and Firefox run as part of the Bazel browser tests, so we do not run them as
+  // part of the legacy Saucelabs tests.
+  'Chrome': {unitTest: {target: null, required: false}, e2e: {target: null, required: true}},
+  'Firefox': {unitTest: {target: null, required: false}, e2e: {target: null, required: true}},
   // Set ESR as a not required browser as it fails for Ivy acceptance tests.
   'FirefoxESR': {unitTest: {target: 'SL', required: false}, e2e: {target: null, required: true}},
   // Disabled because using the "beta" channel of Chrome can cause non-deterministic CI results.

dev-infra/BUILD.bazel

@@ -8,6 +8,7 @@ ts_library(
     ],
     module_name = "@angular/dev-infra-private",
     deps = [
+        "//dev-infra/caretaker",
         "//dev-infra/commit-message",
         "//dev-infra/format",
         "//dev-infra/pr",

dev-infra/caretaker/BUILD.bazel

@@ -0,0 +1,26 @@
+load("@npm_bazel_typescript//:index.bzl", "ts_library")
+
+ts_library(
+    name = "caretaker",
+    srcs = [
+        "cli.ts",
+    ],
+    module_name = "@angular/dev-infra-private/caretaker",
+    visibility = ["//dev-infra:__subpackages__"],
+    deps = [
+        "//dev-infra/caretaker/check",
+        "@npm//@types/yargs",
+        "@npm//yargs",
+    ],
+)
+
+ts_library(
+    name = "config",
+    srcs = [
+        "config.ts",
+    ],
+    visibility = ["//dev-infra:__subpackages__"],
+    deps = [
+        "//dev-infra/utils",
+    ],
+)

dev-infra/caretaker/check/BUILD.bazel

@@ -0,0 +1,21 @@
+load("@npm_bazel_typescript//:index.bzl", "ts_library")
+
+ts_library(
+    name = "check",
+    srcs = glob(["*.ts"]),
+    module_name = "@angular/dev-infra-private/caretaker/service-statuses",
+    visibility = ["//dev-infra:__subpackages__"],
+    deps = [
+        "//dev-infra/caretaker:config",
+        "//dev-infra/utils",
+        "@npm//@types/fs-extra",
+        "@npm//@types/node",
+        "@npm//@types/node-fetch",
+        "@npm//@types/yargs",
+        "@npm//multimatch",
+        "@npm//node-fetch",
+        "@npm//typed-graphqlify",
+        "@npm//yaml",
+        "@npm//yargs",
+    ],
+)

dev-infra/caretaker/check/check.ts

@@ -0,0 +1,27 @@
+/**
+ * @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 {GitClient} from '../../utils/git';
+import {getCaretakerConfig} from '../config';
+
+import {printG3Comparison} from './g3';
+import {printGithubTasks} from './github';
+import {printServiceStatuses} from './services';
+
+
+/** Check the status of services which Angular caretakers need to monitor. */
+export async function checkServiceStatuses(githubToken: string) {
+  /** The configuration for the caretaker commands. */
+  const config = getCaretakerConfig();
+  /** The GitClient for interacting with git and Github. */
+  const git = new GitClient(githubToken, config);
+
+  await printServiceStatuses();
+  await printGithubTasks(git, config.caretaker);
+  await printG3Comparison(git);
+}

dev-infra/caretaker/check/cli.ts

@@ -0,0 +1,39 @@
+/**
+ * @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 {Arguments, Argv, CommandModule} from 'yargs';
+
+import {addGithubTokenFlag} from '../../utils/yargs';
+
+import {checkServiceStatuses} from './check';
+
+
+export interface CaretakerCheckOptions {
+  githubToken: string;
+}
+
+/** URL to the Github page where personal access tokens can be generated. */
+export const GITHUB_TOKEN_GENERATE_URL = `https://github.com/settings/tokens`;
+
+/** Builds the command. */
+function builder(yargs: Argv) {
+  return addGithubTokenFlag(yargs);
+}
+
+/** Handles the command. */
+async function handler({githubToken}: Arguments<CaretakerCheckOptions>) {
+  await checkServiceStatuses(githubToken);
+}
+
+/** yargs command module for checking status information for the repository  */
+export const CheckModule: CommandModule<{}, CaretakerCheckOptions> = {
+  handler,
+  builder,
+  command: 'check',
+  describe: 'Check the status of information the caretaker manages for the repository',
+};

dev-infra/caretaker/check/g3.ts

@@ -0,0 +1,123 @@
+/**
+ * @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 {existsSync, readFileSync} from 'fs-extra';
+import * as multimatch from 'multimatch';
+import {join} from 'path';
+import {parse as parseYaml} from 'yaml';
+
+import {getRepoBaseDir} from '../../utils/config';
+import {bold, debug, info} from '../../utils/console';
+import {GitClient} from '../../utils/git';
+
+/** Compare the upstream master to the upstream g3 branch, if it exists. */
+export async function printG3Comparison(git: GitClient) {
+  const angularRobotFilePath = join(getRepoBaseDir(), '.github/angular-robot.yml');
+  if (!existsSync(angularRobotFilePath)) {
+    return debug('No angular robot configuration file exists, skipping.');
+  }
+
+  /** The configuration defined for the angular robot. */
+  const robotConfig = parseYaml(readFileSync(angularRobotFilePath).toString());
+  /** The files to be included in the g3 sync. */
+  const includeFiles = robotConfig?.merge?.g3Status?.include || [];
+  /** The files to be expected in the g3 sync. */
+  const excludeFiles = robotConfig?.merge?.g3Status?.exclude || [];
+
+  if (includeFiles.length === 0 && excludeFiles.length === 0) {
+    debug('No g3Status include or exclude lists are defined in the angular robot configuration,');
+    debug('skipping.');
+    return;
+  }
+
+  /** Random prefix to create unique branch names. */
+  const randomPrefix = `prefix${Math.floor(Math.random() * 1000000)}`;
+  /** Ref name of the temporary master branch. */
+  const masterRef = `${randomPrefix}-master`;
+  /** Ref name of the temporary g3 branch. */
+  const g3Ref = `${randomPrefix}-g3`;
+  /** Url of the ref for fetching master and g3 branches. */
+  const refUrl = `https://github.com/${git.remoteConfig.owner}/${git.remoteConfig.name}.git`;
+  /** The result fo the fetch command. */
+  const fetchResult = git.runGraceful(['fetch', refUrl, `master:${masterRef}`, `g3:${g3Ref}`]);
+
+  // If the upstream repository does not have a g3 branch to compare to, skip the comparison.
+  if (fetchResult.status !== 0) {
+    if (fetchResult.stderr.includes(`couldn't find remote ref g3`)) {
+      return debug('No g3 branch exists on upstream, skipping.');
+    }
+    throw Error('Fetch of master and g3 branches for comparison failed.');
+  }
+
+  /** The statistical information about the git diff between master and g3. */
+  const stats = getDiffStats(git);
+
+  // Delete the temporarily created mater and g3 branches.
+  git.runGraceful(['branch', '-D', masterRef, g3Ref]);
+
+  info.group(bold('g3 branch check'));
+  info(`${stats.commits} commits between g3 and master`);
+  if (stats.files === 0) {
+    info('✅ No sync is needed at this time');
+  } else {
+    info(`${stats.files} files changed, ${stats.insertions} insertions(+), ${
+        stats.deletions} deletions(-) will be included in the next sync`);
+  }
+  info.groupEnd();
+  info();
+
+
+  /**
+   * Get git diff stats between master and g3, for all files and filtered to only g3 affecting
+   * files.
+   */
+  function getDiffStats(git: GitClient) {
+    /** The diff stats to be returned. */
+    const stats = {
+      insertions: 0,
+      deletions: 0,
+      files: 0,
+      commits: 0,
+    };
+
+
+    // Determine the number of commits between master and g3 refs. */
+    stats.commits = parseInt(git.run(['rev-list', '--count', `${g3Ref}..${masterRef}`]).stdout, 10);
+
+    // Get the numstat information between master and g3
+    git.run(['diff', `${g3Ref}...${masterRef}`, '--numstat'])
+        .stdout
+        // Remove the extra space after git's output.
+        .trim()
+        // Split each line of git output into array
+        .split('\n')
+        // Split each line from the git output into components parts: insertions,
+        // deletions and file name respectively
+        .map(line => line.split('\t'))
+        // Parse number value from the insertions and deletions values
+        // Example raw line input:
+        //   10\t5\tsrc/file/name.ts
+        .map(line => [Number(line[0]), Number(line[1]), line[2]] as [number, number, string])
+        // Add each line's value to the diff stats, and conditionally to the g3
+        // stats as well if the file name is included in the files synced to g3.
+        .forEach(([insertions, deletions, fileName]) => {
+          if (checkMatchAgainstIncludeAndExclude(fileName, includeFiles, excludeFiles)) {
+            stats.insertions += insertions;
+            stats.deletions += deletions;
+            stats.files += 1;
+          }
+        });
+    return stats;
+  }
+
+  /** Determine whether the file name passes both include and exclude checks. */
+  function checkMatchAgainstIncludeAndExclude(
+      file: string, includes: string[], excludes: string[]) {
+    return multimatch(multimatch(file, includes), excludes, {flipNegate: true}).length !== 0;
+  }
+}

dev-infra/caretaker/check/github.ts

@@ -0,0 +1,56 @@
+/**
+ * @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 {alias, params, types} from 'typed-graphqlify';
+
+import {bold, debug, info} from '../../utils/console';
+import {GitClient} from '../../utils/git';
+import {CaretakerConfig} from '../config';
+
+
+interface GithubInfoQuery {
+  [key: string]: {
+    issueCount: number,
+  };
+}
+
+/** Retrieve the number of matching issues for each github query. */
+export async function printGithubTasks(git: GitClient, config: CaretakerConfig) {
+  if (!config.githubQueries?.length) {
+    debug('No github queries defined in the configuration, skipping.');
+    return;
+  }
+  info.group(bold('Github Tasks'));
+  await getGithubInfo(git, config);
+  info.groupEnd();
+  info();
+}
+
+/** Retrieve query match counts and log discovered counts to the console. */
+async function getGithubInfo(git: GitClient, {githubQueries: queries = []}: CaretakerConfig) {
+  /** The query object for graphql. */
+  const graphQlQuery: {[key: string]: {issueCount: number}} = {};
+  /** The Github search filter for the configured repository. */
+  const repoFilter = `repo:${git.remoteConfig.owner}/${git.remoteConfig.name}`;
+  queries.forEach(({name, query}) => {
+    /** The name of the query, with spaces removed to match GraphQL requirements. */
+    const queryKey = alias(name.replace(/ /g, ''), 'search');
+    graphQlQuery[queryKey] = params(
+        {
+          type: 'ISSUE',
+          query: `"${repoFilter} ${query.replace(/"/g, '\\"')}"`,
+        },
+        {issueCount: types.number},
+    );
+  });
+  /** The results of the generated github query. */
+  const results = await git.github.graphql.query(graphQlQuery);
+  Object.values(results).forEach((result, i) => {
+    info(`${queries[i]?.name.padEnd(25)} ${result.issueCount}`);
+  });
+}

dev-infra/caretaker/check/services.ts

@@ -0,0 +1,79 @@
+/**
+ * @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 fetch from 'node-fetch';
+
+import {bold, green, info, red} from '../../utils/console';
+
+/** The status levels for services. */
+enum ServiceStatus {
+  GREEN,
+  RED
+}
+
+/** The results of checking the status of a service */
+interface StatusCheckResult {
+  status: ServiceStatus;
+  description: string;
+  lastUpdated: Date;
+}
+
+/** Retrieve and log stasuses for all of the services of concern. */
+export async function printServiceStatuses() {
+  info.group(bold(`Service Statuses (checked: ${new Date().toLocaleString()})`));
+  logStatus('CircleCI', await getCircleCiStatus());
+  logStatus('Github', await getGithubStatus());
+  logStatus('NPM', await getNpmStatus());
+  logStatus('Saucelabs', await getSaucelabsStatus());
+  info.groupEnd();
+  info();
+}
+
+
+/** Log the status of the service to the console. */
+function logStatus(serviceName: string, status: StatusCheckResult) {
+  serviceName = serviceName.padEnd(15);
+  if (status.status === ServiceStatus.GREEN) {
+    info(`${serviceName} ${green('✅')}`);
+  } else if (status.status === ServiceStatus.RED) {
+    info.group(`${serviceName} ${red('❌')} (Updated: ${status.lastUpdated.toLocaleString()})`);
+    info(`  Details: ${status.description}`);
+    info.groupEnd();
+  }
+}
+
+/** Gets the service status information for Saucelabs. */
+async function getSaucelabsStatus(): Promise<StatusCheckResult> {
+  return getStatusFromStandardApi('https://status.us-west-1.saucelabs.com/api/v2/status.json');
+}
+
+/** Gets the service status information for NPM. */
+async function getNpmStatus(): Promise<StatusCheckResult> {
+  return getStatusFromStandardApi('https://status.npmjs.org/api/v2/status.json');
+}
+
+/** Gets the service status information for CircleCI. */
+async function getCircleCiStatus(): Promise<StatusCheckResult> {
+  return getStatusFromStandardApi('https://status.circleci.com/api/v2/status.json');
+}
+
+/** Gets the service status information for Github. */
+async function getGithubStatus(): Promise<StatusCheckResult> {
+  return getStatusFromStandardApi('https://www.githubstatus.com/api/v2/status.json');
+}
+
+/** Retrieve the status information for a service which uses a standard API response. */
+async function getStatusFromStandardApi(url: string) {
+  const result = await fetch(url).then(result => result.json());
+  const status = result.status.indicator === 'none' ? ServiceStatus.GREEN : ServiceStatus.RED;
+  return {
+    status,
+    description: result.status.description,
+    lastUpdated: new Date(result.page.updated_at)
+  };
+}

dev-infra/caretaker/cli.ts

@@ -0,0 +1,16 @@
+/**
+ * @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 {Argv} from 'yargs';
+import {CheckModule} from './check/cli';
+
+
+/** Build the parser for the caretaker commands. */
+export function buildCaretakerParser(yargs: Argv) {
+  return yargs.command(CheckModule);
+}

dev-infra/caretaker/config.ts

@@ -0,0 +1,24 @@
+/**
+ * @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 {assertNoErrors, getConfig, NgDevConfig} from '../utils/config';
+
+export interface CaretakerConfig {
+  githubQueries?: {name: string; query: string;}[];
+}
+
+/** Retrieve and validate the config as `CaretakerConfig`. */
+export function getCaretakerConfig() {
+  // List of errors encountered validating the config.
+  const errors: string[] = [];
+  // The non-validated config object.
+  const config: Partial<NgDevConfig<{caretaker: CaretakerConfig}>> = getConfig();
+
+  assertNoErrors(errors);
+  return config as Required<typeof config>;
+}

dev-infra/cli.ts

@@ -13,8 +13,11 @@ import {buildCommitMessageParser} from './commit-message/cli';
 import {buildFormatParser} from './format/cli';
 import {buildReleaseParser} from './release/cli';
 import {buildPrParser} from './pr/cli';
+import {captureLogOutputForCommand} from './utils/console';
+import {buildCaretakerParser} from './caretaker/cli';
 
 yargs.scriptName('ng-dev')
+    .middleware(captureLogOutputForCommand)
     .demandCommand()
     .recommendCommands()
     .command('commit-message <command>', '', buildCommitMessageParser)
@@ -23,6 +26,7 @@ yargs.scriptName('ng-dev')
     .command('pullapprove <command>', '', buildPullapproveParser)
     .command('release <command>', '', buildReleaseParser)
     .command('ts-circular-deps <command>', '', tsCircularDependenciesBuilder)
+    .command('caretaker <command>', '', buildCaretakerParser)
     .wrap(120)
     .strict()
     .parse();

dev-infra/commit-message/BUILD.bazel

@@ -4,28 +4,39 @@ load("@npm_bazel_typescript//:index.bzl", "ts_library")
 ts_library(
     name = "commit-message",
     srcs = [
+        "builder.ts",
         "cli.ts",
+        "commit-message-draft.ts",
         "config.ts",
+        "parse.ts",
+        "restore-commit-message.ts",
         "validate.ts",
         "validate-file.ts",
         "validate-range.ts",
+        "wizard.ts",
     ],
     module_name = "@angular/dev-infra-private/commit-message",
     visibility = ["//dev-infra:__subpackages__"],
     deps = [
         "//dev-infra/utils",
+        "@npm//@types/inquirer",
         "@npm//@types/node",
         "@npm//@types/shelljs",
         "@npm//@types/yargs",
+        "@npm//inquirer",
         "@npm//shelljs",
         "@npm//yargs",
     ],
 )
 
 ts_library(
-    name = "validate-test",
+    name = "test_lib",
     testonly = True,
-    srcs = ["validate.spec.ts"],
+    srcs = [
+        "builder.spec.ts",
+        "parse.spec.ts",
+        "validate.spec.ts",
+    ],
     deps = [
         ":commit-message",
         "//dev-infra/utils",
@@ -40,7 +51,6 @@ jasmine_node_test(
     name = "test",
     bootstrap = ["//tools/testing:node_no_angular_es5"],
     deps = [
-        ":commit-message",
-        ":validate-test",
+        "test_lib",
     ],
 )

dev-infra/commit-message/builder.spec.ts

@@ -0,0 +1,46 @@
+/**
+ * @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 * as config from '../utils/config';
+import * as console from '../utils/console';
+
+import {buildCommitMessage} from './builder';
+
+
+describe('commit message building:', () => {
+  beforeEach(() => {
+    // stub logging calls to prevent noise in test log
+    spyOn(console, 'info').and.stub();
+    // provide a configuration for DevInfra when loaded
+    spyOn(config, 'getConfig').and.returnValue({
+      commitMessage: {
+        scopes: ['core'],
+      }
+    } as any);
+  });
+
+  it('creates a commit message with a scope', async () => {
+    buildPromptResponseSpies('fix', 'core', 'This is a summary');
+
+    expect(await buildCommitMessage()).toMatch(/^fix\(core\): This is a summary/);
+  });
+
+  it('creates a commit message without a scope', async () => {
+    buildPromptResponseSpies('build', false, 'This is a summary');
+
+    expect(await buildCommitMessage()).toMatch(/^build: This is a summary/);
+  });
+});
+
+
+/** Create spies to return the mocked selections from prompts. */
+function buildPromptResponseSpies(type: string, scope: string|false, summary: string) {
+  spyOn(console, 'promptAutocomplete')
+      .and.returnValues(Promise.resolve(type), Promise.resolve(scope));
+  spyOn(console, 'promptInput').and.returnValue(Promise.resolve(summary));
+}

dev-infra/commit-message/builder.ts

@@ -0,0 +1,70 @@
+/**
+ * @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 {ListChoiceOptions} from 'inquirer';
+
+import {info, promptAutocomplete, promptInput} from '../utils/console';
+
+import {COMMIT_TYPES, CommitType, getCommitMessageConfig, ScopeRequirement} from './config';
+
+/** Validate commit message at the provided file path. */
+export async function buildCommitMessage() {
+  // TODO(josephperrott): Add support for skipping wizard with local untracked config file
+  // TODO(josephperrott): Add default commit message information/commenting into generated messages
+  info('Just a few questions to start building the commit message!');
+
+  /** The commit message type. */
+  const type = await promptForCommitMessageType();
+  /** The commit message scope. */
+  const scope = await promptForCommitMessageScopeForType(type);
+  /** The commit message summary. */
+  const summary = await promptForCommitMessageSummary();
+
+  return `${type.name}${scope ? '(' + scope + ')' : ''}: ${summary}\n\n`;
+}
+
+/** Prompts in the terminal for the commit message's type. */
+async function promptForCommitMessageType(): Promise<CommitType> {
+  info('The type of change in the commit. Allows a reader to know the effect of the change,');
+  info('whether it brings a new feature, adds additional testing, documents the `project, etc.');
+
+  /** List of commit type options for the autocomplete prompt. */
+  const typeOptions: ListChoiceOptions[] =
+      Object.values(COMMIT_TYPES).map(({description, name}) => {
+        return {
+          name: `${name} - ${description}`,
+          value: name,
+          short: name,
+        };
+      });
+  /** The key of a commit message type, selected by the user via prompt. */
+  const typeName = await promptAutocomplete('Select a type for the commit:', typeOptions);
+
+  return COMMIT_TYPES[typeName];
+}
+
+/** Prompts in the terminal for the commit message's scope. */
+async function promptForCommitMessageScopeForType(type: CommitType): Promise<string|false> {
+  // If the commit type's scope requirement is forbidden, return early.
+  if (type.scope === ScopeRequirement.Forbidden) {
+    info(`Skipping scope selection as the '${type.name}' type does not allow scopes`);
+    return false;
+  }
+  /** Commit message configuration */
+  const config = getCommitMessageConfig();
+
+  info('The area of the repository the changes in this commit most affects.');
+  return await promptAutocomplete(
+      'Select a scope for the commit:', config.commitMessage.scopes,
+      type.scope === ScopeRequirement.Optional ? '<no scope>' : '');
+}
+
+/** Prompts in the terminal for the commit message's summary. */
+async function promptForCommitMessageSummary(): Promise<string> {
+  info('Provide a short summary of what the changes in the commit do');
+  return await promptInput('Provide a short summary of the commit');
+}

dev-infra/commit-message/cli.ts

@@ -9,13 +9,56 @@ import * as yargs from 'yargs';
 
 import {info} from '../utils/console';
 
+import {restoreCommitMessage} from './restore-commit-message';
 import {validateFile} from './validate-file';
 import {validateCommitRange} from './validate-range';
+import {runWizard} from './wizard';
 
 /** Build the parser for the commit-message commands. */
 export function buildCommitMessageParser(localYargs: yargs.Argv) {
   return localYargs.help()
       .strict()
+      .command(
+          'restore-commit-message-draft', false,
+          args => {
+            return args.option('file-env-variable', {
+              type: 'string',
+              array: true,
+              conflicts: ['file'],
+              required: true,
+              description:
+                  'The key for the environment variable which holds the arguments for the\n' +
+                  'prepare-commit-msg hook as described here:\n' +
+                  'https://git-scm.com/docs/githooks#_prepare_commit_msg',
+              coerce: arg => {
+                const [file, source] = (process.env[arg] || '').split(' ');
+                if (!file) {
+                  throw new Error(`Provided environment variable "${arg}" was not found.`);
+                }
+                return [file, source];
+              },
+            });
+          },
+          args => {
+            restoreCommitMessage(args['file-env-variable'][0], args['file-env-variable'][1] as any);
+          })
+      .command(
+          'wizard <filePath> [source] [commitSha]', '', ((args: any) => {
+            return args
+                .positional(
+                    'filePath',
+                    {description: 'The file path to write the generated commit message into'})
+                .positional('source', {
+                  choices: ['message', 'template', 'merge', 'squash', 'commit'],
+                  description: 'The source of the commit message as described here: ' +
+                      'https://git-scm.com/docs/githooks#_prepare_commit_msg'
+                })
+                .positional(
+                    'commitSha', {description: 'The commit sha if source is set to `commit`'});
+          }),
+          async (args: any) => {
+            await runWizard(args);
+          })
       .command(
           'pre-commit-validate', 'Validate the most recent commit message', {
             'file': {
@@ -38,7 +81,7 @@ export function buildCommitMessageParser(localYargs: yargs.Argv) {
             }
           },
           args => {
-            const file = args.file || args.fileEnvVariable || '.git/COMMIT_EDITMSG';
+            const file = args.file || args['file-env-variable'] || '.git/COMMIT_EDITMSG';
             validateFile(file);
           })
       .command(

dev-infra/commit-message/commit-message-draft.ts

@@ -0,0 +1,30 @@
+/**
+ * @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 {existsSync, readFileSync, unlinkSync, writeFileSync} from 'fs';
+
+/** Load the commit message draft from the file system if it exists. */
+export function loadCommitMessageDraft(basePath: string) {
+  const commitMessageDraftPath = `${basePath}.ngDevSave`;
+  if (existsSync(commitMessageDraftPath)) {
+    return readFileSync(commitMessageDraftPath).toString();
+  }
+  return '';
+}
+
+/** Remove the commit message draft from the file system. */
+export function deleteCommitMessageDraft(basePath: string) {
+  const commitMessageDraftPath = `${basePath}.ngDevSave`;
+  if (existsSync(commitMessageDraftPath)) {
+    unlinkSync(commitMessageDraftPath);
+  }
+}
+
+/** Save the commit message draft to the file system for later retrieval. */
+export function saveCommitMessageDraft(basePath: string, commitMessage: string) {
+  writeFileSync(`${basePath}.ngDevSave`, commitMessage);
+}

dev-infra/commit-message/config.ts

@@ -12,7 +12,6 @@ export interface CommitMessageConfig {
   maxLineLength: number;
   minBodyLength: number;
   minBodyLengthTypeExcludes?: string[];
-  types: string[];
   scopes: string[];
 }
 
@@ -30,3 +29,66 @@ export function getCommitMessageConfig() {
   assertNoErrors(errors);
   return config as Required<typeof config>;
 }
+
+/** Scope requirement level to be set for each commit type.  */
+export enum ScopeRequirement {
+  Required,
+  Optional,
+  Forbidden,
+}
+
+/** A commit type */
+export interface CommitType {
+  description: string;
+  name: string;
+  scope: ScopeRequirement;
+}
+
+/** The valid commit types for Angular commit messages. */
+export const COMMIT_TYPES: {[key: string]: CommitType} = {
+  build: {
+    name: 'build',
+    description: 'Changes to local repository build system and tooling',
+    scope: ScopeRequirement.Optional,
+  },
+  ci: {
+    name: 'ci',
+    description: 'Changes to CI configuration and CI specific tooling',
+    scope: ScopeRequirement.Forbidden,
+  },
+  docs: {
+    name: 'docs',
+    description: 'Changes which exclusively affects documentation.',
+    scope: ScopeRequirement.Optional,
+  },
+  feat: {
+    name: 'feat',
+    description: 'Creates a new feature',
+    scope: ScopeRequirement.Required,
+  },
+  fix: {
+    name: 'fix',
+    description: 'Fixes a previously discovered failure/bug',
+    scope: ScopeRequirement.Required,
+  },
+  perf: {
+    name: 'perf',
+    description: 'Improves performance without any change in functionality or API',
+    scope: ScopeRequirement.Required,
+  },
+  refactor: {
+    name: 'refactor',
+    description: 'Refactor without any change in functionality or API (includes style changes)',
+    scope: ScopeRequirement.Required,
+  },
+  release: {
+    name: 'release',
+    description: 'A release point in the repository',
+    scope: ScopeRequirement.Forbidden,
+  },
+  test: {
+    name: 'test',
+    description: 'Improvements or corrections made to the project\'s test suite',
+    scope: ScopeRequirement.Required,
+  },
+};

dev-infra/commit-message/parse.spec.ts

@@ -0,0 +1,105 @@
+/**
+ * @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 {parseCommitMessage, ParsedCommitMessage} from './parse';
+
+
+const commitValues = {
+  prefix: '',
+  type: 'fix',
+  scope: 'changed-area',
+  summary: 'This is a short summary of the change',
+  body: 'This is a longer description of the change Closes #1',
+};
+
+function buildCommitMessage(params = {}) {
+  const {prefix, type, scope, summary, body} = {...commitValues, ...params};
+  return `${prefix}${type}${scope ? '(' + scope + ')' : ''}: ${summary}\n\n${body}`;
+}
+
+
+describe('commit message parsing:', () => {
+  it('parses the scope', () => {
+    const message = buildCommitMessage();
+    expect(parseCommitMessage(message).scope).toBe(commitValues.scope);
+  });
+
+  it('parses the type', () => {
+    const message = buildCommitMessage();
+    expect(parseCommitMessage(message).type).toBe(commitValues.type);
+  });
+
+  it('parses the header', () => {
+    const message = buildCommitMessage();
+    expect(parseCommitMessage(message).header)
+        .toBe(`${commitValues.type}(${commitValues.scope}): ${commitValues.summary}`);
+  });
+
+  it('parses the body', () => {
+    const message = buildCommitMessage();
+    expect(parseCommitMessage(message).body).toBe(commitValues.body);
+  });
+
+  it('parses the body without Github linking', () => {
+    const body = 'This has linking\nCloses #1';
+    const message = buildCommitMessage({body});
+    expect(parseCommitMessage(message).bodyWithoutLinking).toBe('This has linking\n');
+  });
+
+  it('parses the subject', () => {
+    const message = buildCommitMessage();
+    expect(parseCommitMessage(message).subject).toBe(commitValues.summary);
+  });
+
+  it('identifies if a commit is a fixup', () => {
+    const message1 = buildCommitMessage();
+    expect(parseCommitMessage(message1).isFixup).toBe(false);
+
+    const message2 = buildCommitMessage({prefix: 'fixup! '});
+    expect(parseCommitMessage(message2).isFixup).toBe(true);
+  });
+
+  it('identifies if a commit is a revert', () => {
+    const message1 = buildCommitMessage();
+    expect(parseCommitMessage(message1).isRevert).toBe(false);
+
+    const message2 = buildCommitMessage({prefix: 'revert: '});
+    expect(parseCommitMessage(message2).isRevert).toBe(true);
+
+    const message3 = buildCommitMessage({prefix: 'revert '});
+    expect(parseCommitMessage(message3).isRevert).toBe(true);
+  });
+
+  it('identifies if a commit is a squash', () => {
+    const message1 = buildCommitMessage();
+    expect(parseCommitMessage(message1).isSquash).toBe(false);
+
+    const message2 = buildCommitMessage({prefix: 'squash! '});
+    expect(parseCommitMessage(message2).isSquash).toBe(true);
+  });
+
+  it('ignores comment lines', () => {
+    const message = buildCommitMessage({
+      prefix: '# This is a comment line before the header.\n' +
+          '## This is another comment line before the headers.\n',
+      body: '# This is a comment line befor the body.\n' +
+          'This is line 1 of the actual body.\n' +
+          '## This is another comment line inside the body.\n' +
+          'This is line 2 of the actual body (and it also contains a # but it not a comment).\n' +
+          '### This is yet another comment line after the body.\n',
+    });
+    const parsedMessage = parseCommitMessage(message);
+
+    expect(parsedMessage.header)
+        .toBe(`${commitValues.type}(${commitValues.scope}): ${commitValues.summary}`);
+    expect(parsedMessage.body)
+        .toBe(
+            'This is line 1 of the actual body.\n' +
+            'This is line 2 of the actual body (and it also contains a # but it not a comment).\n');
+  });
+});

dev-infra/commit-message/parse.ts

@@ -0,0 +1,77 @@
+/**
+ * @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
+ */
+
+/** A parsed commit message. */
+export interface ParsedCommitMessage {
+  header: string;
+  body: string;
+  bodyWithoutLinking: string;
+  type: string;
+  scope: string;
+  subject: string;
+  isFixup: boolean;
+  isSquash: boolean;
+  isRevert: boolean;
+}
+
+/** Regex determining if a commit is a fixup. */
+const FIXUP_PREFIX_RE = /^fixup! /i;
+/** Regex finding all github keyword links. */
+const GITHUB_LINKING_RE = /((closed?s?)|(fix(es)?(ed)?)|(resolved?s?))\s\#(\d+)/ig;
+/** Regex determining if a commit is a squash. */
+const SQUASH_PREFIX_RE = /^squash! /i;
+/** Regex determining if a commit is a revert. */
+const REVERT_PREFIX_RE = /^revert:? /i;
+/** Regex determining the scope of a commit if provided. */
+const TYPE_SCOPE_RE = /^(\w+)(?:\(([^)]+)\))?\:\s(.+)$/;
+/** Regex determining the entire header line of the commit. */
+const COMMIT_HEADER_RE = /^(.*)/i;
+/** Regex determining the body of the commit. */
+const COMMIT_BODY_RE = /^.*\n\n([\s\S]*)$/;
+
+/** Parse a full commit message into its composite parts. */
+export function parseCommitMessage(commitMsg: string): ParsedCommitMessage {
+  // Ignore comments (i.e. lines starting with `#`). Comments are automatically removed by git and
+  // should not be considered part of the final commit message.
+  commitMsg = commitMsg.split('\n').filter(line => !line.startsWith('#')).join('\n');
+
+  let header = '';
+  let body = '';
+  let bodyWithoutLinking = '';
+  let type = '';
+  let scope = '';
+  let subject = '';
+
+  if (COMMIT_HEADER_RE.test(commitMsg)) {
+    header = COMMIT_HEADER_RE.exec(commitMsg)![1]
+                 .replace(FIXUP_PREFIX_RE, '')
+                 .replace(SQUASH_PREFIX_RE, '');
+  }
+  if (COMMIT_BODY_RE.test(commitMsg)) {
+    body = COMMIT_BODY_RE.exec(commitMsg)![1];
+    bodyWithoutLinking = body.replace(GITHUB_LINKING_RE, '');
+  }
+
+  if (TYPE_SCOPE_RE.test(header)) {
+    const parsedCommitHeader = TYPE_SCOPE_RE.exec(header)!;
+    type = parsedCommitHeader[1];
+    scope = parsedCommitHeader[2];
+    subject = parsedCommitHeader[3];
+  }
+  return {
+    header,
+    body,
+    bodyWithoutLinking,
+    type,
+    scope,
+    subject,
+    isFixup: FIXUP_PREFIX_RE.test(commitMsg),
+    isSquash: SQUASH_PREFIX_RE.test(commitMsg),
+    isRevert: REVERT_PREFIX_RE.test(commitMsg),
+  };
+}

dev-infra/commit-message/restore-commit-message.ts

@@ -0,0 +1,49 @@
+/**
+ * @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 {writeFileSync} from 'fs';
+
+import {debug, log} from '../utils/console';
+
+import {loadCommitMessageDraft} from './commit-message-draft';
+
+/**
+ * Restore the commit message draft to the git to be used as the default commit message.
+ *
+ * The source provided may be one of the sources described in
+ *   https://git-scm.com/docs/githooks#_prepare_commit_msg
+ */
+export function restoreCommitMessage(
+    filePath: string, source?: 'message'|'template'|'squash'|'commit') {
+  if (!!source) {
+    log('Skipping commit message restoration attempt');
+    if (source === 'message') {
+      debug('A commit message was already provided via the command with a -m or -F flag');
+    }
+    if (source === 'template') {
+      debug('A commit message was already provided via the -t flag or config.template setting');
+    }
+    if (source === 'squash') {
+      debug('A commit message was already provided as a merge action or via .git/MERGE_MSG');
+    }
+    if (source === 'commit') {
+      debug('A commit message was already provided through a revision specified via --fixup, -c,');
+      debug('-C or --amend flag');
+    }
+    process.exit(0);
+  }
+  /** A draft of a commit message. */
+  const commitMessage = loadCommitMessageDraft(filePath);
+
+  // If the commit message draft has content, restore it into the provided filepath.
+  if (commitMessage) {
+    writeFileSync(filePath, commitMessage);
+  }
+  // Exit the process
+  process.exit(0);
+}

dev-infra/commit-message/validate-file.ts

@@ -11,6 +11,7 @@ import {resolve} from 'path';
 import {getRepoBaseDir} from '../utils/config';
 import {info} from '../utils/console';
 
+import {deleteCommitMessageDraft, saveCommitMessageDraft} from './commit-message-draft';
 import {validateCommitMessage} from './validate';
 
 /** Validate commit message at the provided file path. */
@@ -18,8 +19,12 @@ export function validateFile(filePath: string) {
   const commitMessage = readFileSync(resolve(getRepoBaseDir(), filePath), 'utf8');
   if (validateCommitMessage(commitMessage)) {
     info('√  Valid commit message');
+    deleteCommitMessageDraft(filePath);
     return;
   }
+  // On all invalid commit messages, the commit message should be saved as a draft to be
+  // restored on the next commit attempt.
+  saveCommitMessageDraft(filePath, commitMessage);
   // If the validation did not return true, exit as a failure.
   process.exit(1);
 }

dev-infra/commit-message/validate-range.ts

@@ -8,7 +8,8 @@
 import {info} from '../utils/console';
 import {exec} from '../utils/shelljs';
 
-import {parseCommitMessage, validateCommitMessage, ValidateCommitMessageOptions} from './validate';
+import {parseCommitMessage} from './parse';
+import {validateCommitMessage, ValidateCommitMessageOptions} from './validate';
 
 // Whether the provided commit is a fixup commit.
 const isNonFixup = (m: string) => !parseCommitMessage(m).isFixup;

dev-infra/commit-message/validate.spec.ts

@@ -18,13 +18,6 @@ const config: {commitMessage: CommitMessageConfig} = {
   commitMessage: {
     maxLineLength: 120,
     minBodyLength: 0,
-    types: [
-      'feat',
-      'fix',
-      'refactor',
-      'release',
-      'style',
-    ],
     scopes: [
       'common',
       'compiler',
@@ -33,7 +26,7 @@ const config: {commitMessage: CommitMessageConfig} = {
     ]
   }
 };
-const TYPES = config.commitMessage.types.join(', ');
+const TYPES = Object.keys(validateConfig.COMMIT_TYPES).join(', ');
 const SCOPES = config.commitMessage.scopes.join(', ');
 const INVALID = false;
 const VALID = true;
@@ -47,7 +40,8 @@ describe('validate-commit-message.js', () => {
     lastError = '';
 
     spyOn(console, 'error').and.callFake((msg: string) => lastError = msg);
-    spyOn(validateConfig, 'getCommitMessageConfig').and.returnValue(config);
+    spyOn(validateConfig, 'getCommitMessageConfig')
+        .and.returnValue(config as ReturnType<typeof validateConfig.getCommitMessageConfig>);
   });
 
   describe('validateMessage()', () => {
@@ -55,16 +49,16 @@ describe('validate-commit-message.js', () => {
       expect(validateCommitMessage('feat(packaging): something')).toBe(VALID);
       expect(lastError).toBe('');
 
-      expect(validateCommitMessage('release(packaging): something')).toBe(VALID);
+      expect(validateCommitMessage('fix(packaging): something')).toBe(VALID);
       expect(lastError).toBe('');
 
-      expect(validateCommitMessage('fixup! release(packaging): something')).toBe(VALID);
+      expect(validateCommitMessage('fixup! fix(packaging): something')).toBe(VALID);
       expect(lastError).toBe('');
 
-      expect(validateCommitMessage('squash! release(packaging): something')).toBe(VALID);
+      expect(validateCommitMessage('squash! fix(packaging): something')).toBe(VALID);
       expect(lastError).toBe('');
 
-      expect(validateCommitMessage('Revert: "release(packaging): something"')).toBe(VALID);
+      expect(validateCommitMessage('Revert: "fix(packaging): something"')).toBe(VALID);
       expect(lastError).toBe('');
     });
 
@@ -110,8 +104,8 @@ describe('validate-commit-message.js', () => {
       expect(validateCommitMessage('feat(bah): something')).toBe(INVALID);
       expect(lastError).toContain(errorMessageFor('bah', 'feat(bah): something'));
 
-      expect(validateCommitMessage('style(webworker): something')).toBe(INVALID);
-      expect(lastError).toContain(errorMessageFor('webworker', 'style(webworker): something'));
+      expect(validateCommitMessage('fix(webworker): something')).toBe(INVALID);
+      expect(lastError).toContain(errorMessageFor('webworker', 'fix(webworker): something'));
 
       expect(validateCommitMessage('refactor(security): something')).toBe(INVALID);
       expect(lastError).toContain(errorMessageFor('security', 'refactor(security): something'));
@@ -119,12 +113,12 @@ describe('validate-commit-message.js', () => {
       expect(validateCommitMessage('refactor(docs): something')).toBe(INVALID);
       expect(lastError).toContain(errorMessageFor('docs', 'refactor(docs): something'));
 
-      expect(validateCommitMessage('release(angular): something')).toBe(INVALID);
-      expect(lastError).toContain(errorMessageFor('angular', 'release(angular): something'));
+      expect(validateCommitMessage('feat(angular): something')).toBe(INVALID);
+      expect(lastError).toContain(errorMessageFor('angular', 'feat(angular): something'));
     });
 
     it('should allow empty scope', () => {
-      expect(validateCommitMessage('fix: blablabla')).toBe(VALID);
+      expect(validateCommitMessage('build: blablabla')).toBe(VALID);
       expect(lastError).toBe('');
     });
 
@@ -243,7 +237,6 @@ describe('validate-commit-message.js', () => {
           maxLineLength: 120,
           minBodyLength: 30,
           minBodyLengthTypeExcludes: ['docs'],
-          types: ['fix', 'docs'],
           scopes: ['core']
         }
       };

dev-infra/commit-message/validate.ts

@@ -7,7 +7,8 @@
  */
 import {error} from '../utils/console';
 
-import {getCommitMessageConfig} from './config';
+import {COMMIT_TYPES, getCommitMessageConfig, ScopeRequirement} from './config';
+import {parseCommitMessage} from './parse';
 
 /** Options for commit message validation. */
 export interface ValidateCommitMessageOptions {
@@ -15,53 +16,9 @@ export interface ValidateCommitMessageOptions {
   nonFixupCommitHeaders?: string[];
 }
 
-const FIXUP_PREFIX_RE = /^fixup! /i;
-const GITHUB_LINKING_RE = /((closed?s?)|(fix(es)?(ed)?)|(resolved?s?))\s\#(\d+)/ig;
-const SQUASH_PREFIX_RE = /^squash! /i;
-const REVERT_PREFIX_RE = /^revert:? /i;
-const TYPE_SCOPE_RE = /^(\w+)(?:\(([^)]+)\))?\:\s(.+)$/;
-const COMMIT_HEADER_RE = /^(.*)/i;
-const COMMIT_BODY_RE = /^.*\n\n([\s\S]*)$/;
+/** Regex matching a URL for an entire commit body line. */
 const COMMIT_BODY_URL_LINE_RE = /^https?:\/\/.*$/;
 
-/** Parse a full commit message into its composite parts. */
-export function parseCommitMessage(commitMsg: string) {
-  let header = '';
-  let body = '';
-  let bodyWithoutLinking = '';
-  let type = '';
-  let scope = '';
-  let subject = '';
-
-  if (COMMIT_HEADER_RE.test(commitMsg)) {
-    header = COMMIT_HEADER_RE.exec(commitMsg)![1]
-                 .replace(FIXUP_PREFIX_RE, '')
-                 .replace(SQUASH_PREFIX_RE, '');
-  }
-  if (COMMIT_BODY_RE.test(commitMsg)) {
-    body = COMMIT_BODY_RE.exec(commitMsg)![1];
-    bodyWithoutLinking = body.replace(GITHUB_LINKING_RE, '');
-  }
-
-  if (TYPE_SCOPE_RE.test(header)) {
-    const parsedCommitHeader = TYPE_SCOPE_RE.exec(header)!;
-    type = parsedCommitHeader[1];
-    scope = parsedCommitHeader[2];
-    subject = parsedCommitHeader[3];
-  }
-  return {
-    header,
-    body,
-    bodyWithoutLinking,
-    type,
-    scope,
-    subject,
-    isFixup: FIXUP_PREFIX_RE.test(commitMsg),
-    isSquash: SQUASH_PREFIX_RE.test(commitMsg),
-    isRevert: REVERT_PREFIX_RE.test(commitMsg),
-  };
-}
-
 /** Validate a commit message against using the local repo's config. */
 export function validateCommitMessage(
     commitMsg: string, options: ValidateCommitMessageOptions = {}) {
@@ -129,8 +86,26 @@ export function validateCommitMessage(
     return false;
   }
 
-  if (!config.types.includes(commit.type)) {
-    printError(`'${commit.type}' is not an allowed type.\n => TYPES: ${config.types.join(', ')}`);
+
+
+  if (COMMIT_TYPES[commit.type] === undefined) {
+    printError(`'${commit.type}' is not an allowed type.\n => TYPES: ${
+        Object.keys(COMMIT_TYPES).join(', ')}`);
+    return false;
+  }
+
+  /** The scope requirement level for the provided type of the commit message. */
+  const scopeRequirementForType = COMMIT_TYPES[commit.type].scope;
+
+  if (scopeRequirementForType === ScopeRequirement.Forbidden && commit.scope) {
+    printError(`Scopes are forbidden for commits with type '${commit.type}', but a scope of '${
+        commit.scope}' was provided.`);
+    return false;
+  }
+
+  if (scopeRequirementForType === ScopeRequirement.Required && !commit.scope) {
+    printError(
+        `Scopes are required for commits with type '${commit.type}', but no scope was provided.`);
     return false;
   }
 

dev-infra/commit-message/wizard.ts

@@ -0,0 +1,43 @@
+/**
+ * @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 {writeFileSync} from 'fs';
+
+import {info} from '../utils/console';
+
+import {buildCommitMessage} from './builder';
+
+/**
+ * The source triggering the git commit message creation.
+ * As described in: https://git-scm.com/docs/githooks#_prepare_commit_msg
+ */
+export type PrepareCommitMsgHookSource = 'message'|'template'|'merge'|'squash'|'commit';
+
+/** The default commit message used if the wizard does not procude a commit message. */
+const defaultCommitMessage = `<type>(<scope>): <summary>
+
+# <Describe the motivation behind this change - explain WHY you are making this change. Wrap all
+#  lines at 100 characters.>\n\n`;
+
+export async function runWizard(
+    args: {filePath: string, source?: PrepareCommitMsgHookSource, commitSha?: string}) {
+  // TODO(josephperrott): Add support for skipping wizard with local untracked config file
+
+  if (args.source !== undefined) {
+    info(`Skipping commit message wizard due because the commit was created via '${
+        args.source}' source`);
+    process.exitCode = 0;
+    return;
+  }
+
+  // Set the default commit message to be updated if the user cancels out of the wizard in progress
+  writeFileSync(args.filePath, defaultCommitMessage);
+
+  /** The generated commit message. */
+  const commitMessage = await buildCommitMessage();
+  writeFileSync(args.filePath, commitMessage);
+}