release: cut the v7.0.2 release

build: remove problematic yarn prefix for running bazel
fix(core): Remove static dependency from @angular/core to @angular/compiler (#26734 ) (#26879 )
2018-10-31 16:05:54 -07:00 · 2018-10-31 16:03:29 -07:00 · 2018-10-31 13:14:01 -07:00 · 2018-10-31 12:50:28 -04:00 · 2018-10-31 12:50:28 -04:00 · 2018-10-30 18:37:12 -04:00
582 changed files with 25206 additions and 37712 deletions
--- a/.bazelrc
+++ b/.bazelrc
@ -24,10 +24,6 @@ build --symlink_prefix=/
 # Performance: avoid stat'ing input files
 build --watchfs

-# Turn off legacy external runfiles
-run --nolegacy_external_runfiles
-test --nolegacy_external_runfiles
-
 ###############################
 # Release support             #
 ###############################
--- a/.circleci/bazel.rc
+++ b/.circleci/bazel.rc
@ -16,6 +16,10 @@ test --test_tag_filters=-manual
 # (e.g. /etc/bazel.bazelrc vs. tools/bazel.rc)
 build --announce_rc

+# Create dist/bin symlink to $(bazel info bazel-bin)
+# We use this when uploading artifacts after the build finishes
+build --symlink_prefix=dist/
+
 # Workaround https://github.com/bazelbuild/bazel/issues/3645
 # Bazel doesn't calculate the memory ceiling correctly when running under Docker.
 # Limit Bazel to consuming resources that fit in CircleCI "xlarge" class
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@ -33,18 +33,24 @@ var_6: &job_defaults
  docker:
  - image: *default_docker_image

+var_7: &start-xvfb
+  run:
+    name: Running X virtual framebuffer
+    command: Xvfb :99 -screen 0 1280x1024x24
+    background: true
+
 # After checkout, rebase on top of master.
 # Similar to travis behavior, but not quite the same.
 # See https://discuss.circleci.com/t/1662
-var_7: &post_checkout
+var_8: &post_checkout
  post: git pull --ff-only origin "refs/pull/${CI_PULL_REQUEST//*pull\//}/merge"

-var_8: &yarn_install
+var_9: &yarn_install
  run:
    name: Running Yarn install
    command: yarn install --frozen-lockfile --non-interactive

-var_9: &setup_circleci_bazel_config
+var_10: &setup_circleci_bazel_config
  run:
    name: Setting up CircleCI bazel configuration
    command: sudo cp .circleci/bazel.rc /etc/bazel.bazelrc
@ -90,37 +96,13 @@ jobs:
      - run: sudo cp .circleci/bazel.rc /etc/bazel.bazelrc
      - run: yarn bazel test //... --build_tag_filters=-ivy-only,local --test_tag_filters=-ivy-only,local

-      - save_cache:
-          key: *cache_key
-          paths:
-            - "node_modules"
-            - "~/bazel_repository_cache"
-
-  # Temporary job to test what will happen when we flip the Ivy flag to true
-  test_ivy_aot:
-    <<: *job_defaults
-    resource_class: xlarge
-    steps:
-      - checkout:
-          <<: *post_checkout
-      - restore_cache:
-          key: *cache_key
-      - *define_env_vars
-      - *setup_circleci_bazel_config
-      - *yarn_install
-      - *setup_bazel_remote_execution
-
-        # We need to explicitly specify the --symlink_prefix option because otherwise we would
-        # not be able to easily find the output bin directory when uploading artifacts for size
-        # measurements.
-      - run: yarn test-ivy-aot //... --symlink_prefix=dist/
-
-        # Publish bundle artifacts which will be used to calculate the size change. **Note**: Make
-        # sure that the size plugin from the Angular robot fetches the artifacts from this CircleCI
-        # job (see .github/angular-robot.yml). Additionally any artifacts need to be stored with the
-        # following path format: "{projectName}/{context}/{fileName}". This format is necessary
-        # because otherwise the bot is not able to pick up the artifacts from CircleCI. See:
-        # https://github.com/angular/github-robot/blob/master/functions/src/plugins/size.ts#L392-L394
+      # CircleCI will allow us to go back and view/download these artifacts from past builds.
+      # Also we can use a service like https://buildsize.org/ to automatically track binary size of these artifacts.
+      # The destination keys need be format {projectName}/{context}/{fileName} so that the github-robot can process them for size calculations
+      # projectName should remain consistant to group files
+      # context and fileName can be almost anything (within usual URI rules)
+      # There should only be exactly 2 forward slashes in the path
+      # This is so they're backwards compatiable with the existing data we have on bundle sizes
      - store_artifacts:
          path: dist/bin/packages/core/test/bundling/hello_world/bundle.min.js
          destination: core/hello_world/bundle
@ -133,6 +115,46 @@ jobs:
      - store_artifacts:
          path: dist/bin/packages/core/test/bundling/todo/bundle.min.js.br
          destination: core/todo/bundle.br
+      - save_cache:
+          key: *cache_key
+          paths:
+            - "node_modules"
+            - "~/bazel_repository_cache"
+
+  # Temporary job to test what will happen when we flip the Ivy flag to true
+  test_ivy_jit:
+    <<: *job_defaults
+    resource_class: xlarge
+    steps:
+      # don't run this job on the patch branch (to preserve resources)
+      - run: circleci step halt
+      - checkout:
+          <<: *post_checkout
+      - restore_cache:
+          key: *cache_key
+      - *define_env_vars
+      - *setup_circleci_bazel_config
+      - *yarn_install
+      - *setup_bazel_remote_execution
+
+      - run: yarn test-ivy-jit //...
+
+  test_ivy_aot:
+    <<: *job_defaults
+    resource_class: xlarge
+    steps:
+      # don't run this job on the patch branch (to preserve resources)
+      - run: circleci step halt
+      - checkout:
+          <<: *post_checkout
+      - restore_cache:
+          key: *cache_key
+      - *define_env_vars
+      - *setup_circleci_bazel_config
+      - *yarn_install
+      - *setup_bazel_remote_execution
+
+      - run: yarn test-ivy-aot //...

  test_aio:
    <<: *job_defaults
@ -145,6 +167,7 @@ jobs:
      - restore_cache:
          key: *cache_key
      - *define_env_vars
+      - *start-xvfb
        # Build aio
      - run: yarn --cwd aio build --progress=false
        # Lint the code
@ -173,6 +196,7 @@ jobs:
      - restore_cache:
          key: *cache_key
      - *define_env_vars
+      - *start-xvfb
        # Deploy angular.io to production (if necessary)
      - run: setPublicVar CI_STABLE_BRANCH "$(npm info @angular/core dist-tags.latest | sed -r 's/^\s*([0-9]+\.[0-9]+)\.[0-9]+.*$/\1.x/')"
      - run: yarn --cwd aio deploy-production
@ -190,6 +214,7 @@ jobs:
      - attach_workspace:
          at: dist
      - *define_env_vars
+      - *start-xvfb
        # Build aio (with local Angular packages)
      - run: yarn --cwd aio build-local --progress=false
        # Run PWA-score tests
@ -230,6 +255,7 @@ jobs:
      - attach_workspace:
          at: dist
      - *define_env_vars
+      - *start-xvfb
        # Install root
      - *yarn_install
        # Install aio
@ -250,6 +276,7 @@ jobs:
      - attach_workspace:
          at: dist
      - *define_env_vars
+      - *start-xvfb
        # Install root
      - *yarn_install
        # Install aio
@ -288,6 +315,7 @@ jobs:
      - restore_cache:
          key: *cache_key
      - *define_env_vars
+      - *start-xvfb
      - run: yarn install --cwd aio --frozen-lockfile --non-interactive
      - run:
          name: Wait for preview and run tests
@ -347,6 +375,7 @@ jobs:
      - attach_workspace:
          at: dist
      - *define_env_vars
+      - *start-xvfb
      - run: ./integration/run_tests.sh

  # This job updates the content of repos like github.com/angular/core-builds
@ -390,6 +419,7 @@ jobs:
      - restore_cache:
          key: *cache_key
      - *define_env_vars
+      - *start-xvfb
      - run:
          name: Run tests against the deployed apps
          command: ./aio/scripts/test-production.sh $CI_AIO_MIN_PWA_SCORE
@ -404,6 +434,7 @@ workflows:
    jobs:
      - lint
      - test
+      - test_ivy_jit
      - test_ivy_aot
      - build-packages-dist
      - test_aio
@ -441,6 +472,7 @@ workflows:
          requires:
            # Only publish if tests and integration tests pass
            - test
+            - test_ivy_jit
            - test_ivy_aot
            - integration_test
            # Only publish if `aio`/`docs` tests using the locally built Angular packages pass
--- a/.github/ISSUE_TEMPLATE.md
+++ b/.github/ISSUE_TEMPLATE.md
@ -1,10 +1,59 @@
-🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑
+<!--
+PLEASE HELP US PROCESS GITHUB ISSUES FASTER BY PROVIDING THE FOLLOWING INFORMATION.

-Please help us process issues more efficiently by filing an
-issue using one of the following templates:
+ISSUES MISSING IMPORTANT INFORMATION MAY BE CLOSED WITHOUT INVESTIGATION.
+-->

-https://github.com/angular/angular/issues/new/choose
+## I'm submitting a...
+<!-- Check one of the following options with "x" -->
+<pre><code>
+[ ] Regression (a behavior that used to work and stopped working in a new release)
+[ ] Bug report  <!-- Please search GitHub for a similar issue or PR before submitting -->
+[ ] Performance issue
+[ ] Feature request
+[ ] Documentation issue or request
+[ ] Support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question
+[ ] Other... Please describe:
+</code></pre>

-Thank you!
+## Current behavior
+<!-- Describe how the issue manifests. -->

-🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑
+
+## Expected behavior
+<!-- Describe what the desired behavior would be. -->
+
+
+## Minimal reproduction of the problem with instructions
+<!--
+For bug reports please provide the *STEPS TO REPRODUCE* and if possible a *MINIMAL DEMO* of the problem via
+https://stackblitz.com or similar (you can use this template as a starting point: https://stackblitz.com/fork/angular-gitter).
+-->
+
+## What is the motivation / use case for changing the behavior?
+<!-- Describe the motivation or the concrete use case. -->
+
+
+## Environment
+
+<pre><code>
+Angular version: X.Y.Z
+<!-- Check whether this is still an issue in the most recent Angular version -->
+
+Browser:
+- [ ] Chrome (desktop) version XX
+- [ ] Chrome (Android) version XX
+- [ ] Chrome (iOS) version XX
+- [ ] Firefox version XX
+- [ ] Safari (desktop) version XX
+- [ ] Safari (iOS) version XX
+- [ ] IE version XX
+- [ ] Edge version XX
+ 
+For Tooling issues:
+- Node version: XX  <!-- run `node --version` -->
+- Platform:  <!-- Mac, Linux, Windows -->
+
+Others:
+<!-- Anything else relevant?  Operating system version, IDE, package manager, HTTP server, ... -->
+</code></pre>
--- a/.github/ISSUE_TEMPLATE/1-bug-report.md
+++ b/.github/ISSUE_TEMPLATE/1-bug-report.md
@ -1,63 +0,0 @@
---
-name: "\U0001F41EBug report"
-about: Report a bug in the Angular Framework
---
-<!--🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅
-
-Oh hi there! 😄 
-
-To expedite issue processing please search open and closed issues before submitting a new one.
-Existing issues often contain information about workarounds, resolution, or progress updates.
-
-🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅-->
-
-
-# 🐞 bug report
-
-### Affected Package
-<!-- Can you pin-point one or more @angular/* packages as the source of the bug? -->
-<!-- ✍️edit: --> The issue is caused by package @angular/....
-
-
-### Is this a regression?
-
-<!-- Did this behavior use to work in the previous version? -->
-<!-- ✍️--> Yes, the previous version in which this bug was not present was: ....
-
-
-### Description
-
-<!-- ✍️--> A clear and concise description of the problem...
-
-
-## 🔬 Minimal Reproduction
-<!--
-Please create and share minimal reproduction of the issue starting with this template: https://stackblitz.com/fork/angular-issue-repro2
-->
-<!-- ✍️--> https://stackblitz.com/...
-
-<!--
-If StackBlitz is not suitable for reproduction of your issue, please create a minimal GitHub repository with the reproduction of the issue. Share the link to the repo below along with step-by-step instructions to reproduce the problem, as well as expected and actual behavior.
-->
-
-## 🔥 Exception or Error
-<pre><code>
-<!-- If the issue is accompanied by an exception or an error, please share it below: -->
-<!-- ✍️-->
-
-</code></pre>
-
-
-## 🌍  Your Environment
-
-**Angular Version:**
-<pre><code>
-<!-- run `ng version` and paste output below -->
-<!-- ✍️-->
-
-</code></pre>
-
-**Anything else relevant?**
-<!-- ✍️Is this a browser specific issue? If so, please specify the browser and version. -->
-
-<!-- ✍️Do any of these matter: operating system, IDE, package manager, HTTP server, ...? If so, please mention it below. -->
--- a/.github/ISSUE_TEMPLATE/2-feature-request.md
+++ b/.github/ISSUE_TEMPLATE/2-feature-request.md
@ -1,32 +0,0 @@
---
-name: "\U0001F680Feature request"
-about: Suggest a feature for Angular Framework
-
---
-<!--🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅
-
-Oh hi there! 😄 
-
-To expedite issue processing please search open and closed issues before submitting a new one.
-Existing issues often contain information about workarounds, resolution, or progress updates.
-
-🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅-->
-
-
-# 🚀 feature request
-
-### Relevant Package
-<!-- Can you pin-point one or more @angular/* packages the are relevant for this feature request? -->
-<!-- ✍️edit: --> This feature request is for @angular/....
-
-
-### Description
-<!-- ✍️--> A clear and concise description of the problem or missing capability...
-
-
-### Describe the solution you'd like
-<!-- ✍️--> If you have a solution in mind, please describe it.
-
-
-### Describe alternatives you've considered
-<!-- ✍️--> Have you considered any alternative solutions or workarounds?
--- a/.github/ISSUE_TEMPLATE/3-docs-bug.md
+++ b/.github/ISSUE_TEMPLATE/3-docs-bug.md
@ -1,55 +0,0 @@
---
-name: "📚 Docs or angular.io issue report"
-about: Report an issue in Angular's documentation or angular.io application
-
---
-<!--🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅
-
-Oh hi there! 😄
-
-To expedite issue processing please search open and closed issues before submitting a new one.
-Existing issues often contain information about workarounds, resolution, or progress updates.
-
-🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅-->
-
-# 📚 Docs or angular.io bug report
-
-### Description
-
-<!-- ✍️edit:--> A clear and concise description of the problem...
-
-
-## 🔬 Minimal Reproduction
-
-### What's the affected URL?**
-<!-- ✍️edit:--> https://angular.io/...
-
-### Reproduction Steps**
-<!-- If applicable please list the steps to take to reproduce the issue -->
-<!-- ✍️edit:-->
-
-### Expected vs Actual Behavior**
-<!-- If applicable please describe the difference between the expected and actual behavior after following the repro steps. -->
-<!-- ✍️edit:-->
-
-
-## 📷Screenshot
-<!-- Often a screenshot can help to capture the issue better than a long description. -->
-<!-- ✍️upload a screenshot:-->
-
-
-## 🔥 Exception or Error
-<pre><code>
-<!-- If the issue is accompanied by an exception or an error, please share it below: -->
-<!-- ✍️-->
-
-</code></pre>
-
-
-## 🌍  Your Environment
-
-### Browser info
-<!-- ✍️Is this a browser specific issue? If so, please specify the device, browser, and version. -->
-
-### Anything else relevant?
-<!-- ✍️Please provide additional info if necessary. -->
--- a/.github/ISSUE_TEMPLATE/4-security-issue-disclosure.md
+++ b/.github/ISSUE_TEMPLATE/4-security-issue-disclosure.md
@ -1,11 +0,0 @@
---
-name: ⚠️ Security issue disclosure
-about: Report a security issue in Angular Framework, Material, or CLI
-
---
-
-🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑
-
-Please read https://angular.io/guide/security#report-issues on how to disclose security related issues.
-
-🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑
--- a/.github/ISSUE_TEMPLATE/5-support-request.md
+++ b/.github/ISSUE_TEMPLATE/5-support-request.md
@ -1,16 +0,0 @@
---
-name: "❓Support request"
-about: Questions and requests for support
-
---
-
-🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑
-
-Please do not file questions or support requests on the GitHub issues tracker.
-
-You can get your questions answered using other communication channels. Please see: 
-https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question
-
-Thank you!
-
-🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑
--- a/.github/ISSUE_TEMPLATE/6-angular-cli.md
+++ b/.github/ISSUE_TEMPLATE/6-angular-cli.md
@ -1,13 +0,0 @@
---
-name: "\U0001F6E0️Angular CLI"
-about: Issues and feature requests for Angular CLI
-
---
-
-🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑
-
-Please file any Angular CLI issues at: https://github.com/angular/angular-cli/issues/new
-
-For the time being, we keep Angular CLI issues in a separate repository.
-
-🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑
--- a/.github/ISSUE_TEMPLATE/7-angular-material.md
+++ b/.github/ISSUE_TEMPLATE/7-angular-material.md
@ -1,13 +0,0 @@
---
-name: "\U0001F48EAngular Material"
-about: Issues and feature requests for Angular Material
-
---
-
-🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑
-
-Please file any Angular Material issues at: https://github.com/angular/material2/issues/new
-
-For the time being, we keep Angular Material issues in a separate repository.
-
-🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑🛑
--- a/.github/angular-robot.yml
+++ b/.github/angular-robot.yml
@ -4,7 +4,7 @@
 size:
  disabled: false
  maxSizeIncrease: 2000
-  circleCiStatusName: "ci/circleci: test_ivy_aot"
+  circleCiStatusName: "ci/circleci: test"

 # options for the merge plugin
 merge:
@ -50,7 +50,6 @@ merge:
      - "**/BUILD.bazel"
      - "packages/**/integrationtest/**"
      - "packages/**/test/**"
-      - "packages/compiler-cli/src/ngcc/**"

  # 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.
--- a/.gitignore
+++ b/.gitignore
@ -1,7 +1,7 @@
 .DS_STORE

 /dist/
-/bazel-*
+bazel-*
 e2e_test.*
 node_modules
 bower_components
--- a/.pullapprove.yml
+++ b/.pullapprove.yml
@ -108,9 +108,8 @@ groups:
          - "*.lock"
          - "tools/*"
        exclude:
-          - "aio/*"
-          - "packages/core/test/bundling/*"
          - "tools/public_api_guard/*"
+          - "aio/*"
    users:
      - IgorMinar #primary
      - alexeagle
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -1,138 +1,3 @@
-<a name="7.1.1"></a>
-## [7.1.1](https://github.com/angular/angular/compare/7.1.0...7.1.1) (2018-11-28)
-
-
-### Bug Fixes
-
-* **core:** export a value for InjectFlags ([#27279](https://github.com/angular/angular/issues/27279)) ([bdf5f3e](https://github.com/angular/angular/commit/bdf5f3e)), closes [#27251](https://github.com/angular/angular/issues/27251)
-
-
-
-<a name="7.1.0"></a>
-# [7.1.0](https://github.com/angular/angular/compare/7.1.0-rc.0...7.1.0) (2018-11-21)
-
-
-### Bug Fixes
-
-* **core:** allow null value for renderer setElement(…) ([#17065](https://github.com/angular/angular/issues/17065)) ([ff15043](https://github.com/angular/angular/commit/ff15043)), closes [#13686](https://github.com/angular/angular/issues/13686)
-* **router:** fix regression where navigateByUrl promise didn't resolve on CanLoad failure ([#26455](https://github.com/angular/angular/issues/26455)) ([1c9b065](https://github.com/angular/angular/commit/1c9b065)), closes [#26284](https://github.com/angular/angular/issues/26284)
-* **service-worker:** clean up caches from old SW versions ([#26319](https://github.com/angular/angular/issues/26319)) ([2326b9c](https://github.com/angular/angular/commit/2326b9c))
-* **upgrade:** properly destroy upgraded component elements and descendants ([#26209](https://github.com/angular/angular/issues/26209)) ([071934e](https://github.com/angular/angular/commit/071934e)), closes [#26208](https://github.com/angular/angular/issues/26208)
-* **compiler:** generate inputs with aliases properly ([#26774](https://github.com/angular/angular/issues/26774)) ([19fcfc3](https://github.com/angular/angular/commit/19fcfc3))
-* **compiler:** generate relative paths only in summary file errors ([#26759](https://github.com/angular/angular/issues/26759)) ([56f44be](https://github.com/angular/angular/commit/56f44be))
-* **core:** ignore comment nodes under unsafe elements ([#25879](https://github.com/angular/angular/issues/25879)) ([d5cbcef](https://github.com/angular/angular/commit/d5cbcef))
-* **core:** Remove static dependency from [@angular](https://github.com/angular)/core to [@angular](https://github.com/angular)/compiler ([#26734](https://github.com/angular/angular/issues/26734)) ([d042c4a](https://github.com/angular/angular/commit/d042c4a))
-* **core:** support computed base class in metadata inheritance ([#24014](https://github.com/angular/angular/issues/24014)) ([95743e3](https://github.com/angular/angular/commit/95743e3))
-* **bazel:** unknown replay compiler error in windows ([#26711](https://github.com/angular/angular/issues/26711)) ([aed95fd](https://github.com/angular/angular/commit/aed95fd))
-* **core:** ensure that `ɵdefineNgModule` is available in flat-file formats ([#26403](https://github.com/angular/angular/issues/26403)) ([a64859b](https://github.com/angular/angular/commit/a64859b))
-* **router:** remove type bludgeoning of context and outlet when running CanDeactivate ([#26496](https://github.com/angular/angular/issues/26496)) ([496372d](https://github.com/angular/angular/commit/496372d)), closes [#18253](https://github.com/angular/angular/issues/18253)
-* **service-worker:** add typing to public api guard and fix lint errors ([#25860](https://github.com/angular/angular/issues/25860)) ([1061875](https://github.com/angular/angular/commit/1061875))
-* **upgrade:** improve downgrading-related error messages ([#26217](https://github.com/angular/angular/issues/26217)) ([7dbc103](https://github.com/angular/angular/commit/7dbc103))
-* **upgrade:** make typings compatible with older AngularJS typings ([#26880](https://github.com/angular/angular/issues/26880)) ([64647af](https://github.com/angular/angular/commit/64647af)), closes [#26420](https://github.com/angular/angular/issues/26420)
-* **compiler-cli:** add missing tslib dependency ([#27063](https://github.com/angular/angular/issues/27063)) ([c31e78f](https://github.com/angular/angular/commit/c31e78f))
-* **compiler-cli:** only pass canonical genfile paths to compiler host ([#27062](https://github.com/angular/angular/issues/27062)) ([0ada23a](https://github.com/angular/angular/commit/0ada23a))
-* **router:** add `relativeLinkResolution` to `recognize` operator ([#26990](https://github.com/angular/angular/issues/26990)) ([a752971](https://github.com/angular/angular/commit/a752971)), closes [#26983](https://github.com/angular/angular/issues/26983)
-
-
-### Features
-
-* **bazel:** Bazel workspace schematics ([#26971](https://github.com/angular/angular/issues/26971)) ([b07bd30](https://github.com/angular/angular/commit/b07bd30))
-* **router:** add prioritizedGuardValue operator optimization and allowing UrlTree return from guard ([#26478](https://github.com/angular/angular/issues/26478)) ([fdfedce](https://github.com/angular/angular/commit/fdfedce))
-* **compiler:** ability to mark an InvokeFunctionExpr as pure ([#26860](https://github.com/angular/angular/issues/26860)) ([4dfa71f](https://github.com/angular/angular/commit/4dfa71f))
-* **forms:** add updateOn option to FormBuilder ([#24599](https://github.com/angular/angular/issues/24599)) ([e9e804f](https://github.com/angular/angular/commit/e9e804f))
-* **router:** allow guards to return UrlTree as well as boolean ([#26521](https://github.com/angular/angular/issues/26521)) ([081f95c](https://github.com/angular/angular/commit/081f95c))
-* **router:** allow redirect from guards by returning UrlTree ([#26521](https://github.com/angular/angular/issues/26521)) ([152ca66](https://github.com/angular/angular/commit/152ca66))
-* **router:** guard returning UrlTree cancels current navigation and redirects ([#26521](https://github.com/angular/angular/issues/26521)) ([4e9f2e5](https://github.com/angular/angular/commit/4e9f2e5)), closes [#24618](https://github.com/angular/angular/issues/24618)
-* **service-worker:** add typing for messagesClicked in SwPush service ([#25860](https://github.com/angular/angular/issues/25860)) ([c78c221](https://github.com/angular/angular/commit/c78c221))
-* **service-worker:** close notifications and focus window on click ([#25860](https://github.com/angular/angular/issues/25860)) ([f5d5a3d](https://github.com/angular/angular/commit/f5d5a3d))
-* **service-worker:** handle 'notificationclick' events ([#25860](https://github.com/angular/angular/issues/25860)) ([cf6ea28](https://github.com/angular/angular/commit/cf6ea28)), closes [#20956](https://github.com/angular/angular/issues/20956) [#22311](https://github.com/angular/angular/issues/22311)
-* **upgrade:** support downgrading multiple modules ([#26217](https://github.com/angular/angular/issues/26217)) ([93837e9](https://github.com/angular/angular/commit/93837e9)), closes [#26062](https://github.com/angular/angular/issues/26062)
-* **router:** add pathParamsChange mode for runGuardsAndResolvers ([#26861](https://github.com/angular/angular/issues/26861)) ([bf6ac6c](https://github.com/angular/angular/commit/bf6ac6c)), closes [#18253](https://github.com/angular/angular/issues/18253)
-
-
-<a name="7.1.0-rc.0"></a>
-# [7.1.0-rc.0](https://github.com/angular/angular/compare/7.1.0-beta.2...7.1.0-rc.0) (2018-11-14)
-
-
-### Bug Fixes
-
-* **compiler-cli:** add missing tslib dependency ([#27063](https://github.com/angular/angular/issues/27063)) ([c31e78f](https://github.com/angular/angular/commit/c31e78f))
-* **compiler-cli:** only pass canonical genfile paths to compiler host ([#27062](https://github.com/angular/angular/issues/27062)) ([0ada23a](https://github.com/angular/angular/commit/0ada23a))
-* **router:** add `relativeLinkResolution` to `recognize` operator ([#26990](https://github.com/angular/angular/issues/26990)) ([a752971](https://github.com/angular/angular/commit/a752971)), closes [#26983](https://github.com/angular/angular/issues/26983)
-
-
-### Features
-
-* **router:** add pathParamsChange mode for runGuardsAndResolvers ([#26861](https://github.com/angular/angular/issues/26861)) ([bf6ac6c](https://github.com/angular/angular/commit/bf6ac6c)), closes [#18253](https://github.com/angular/angular/issues/18253)
-
-
-
-<a name="7.0.4"></a>
-## [7.0.4](https://github.com/angular/angular/compare/7.0.3...7.0.4) (2018-11-14)
-
-
-### Bug Fixes
-
-* **compiler-cli:** add missing tslib dependency ([#27063](https://github.com/angular/angular/issues/27063)) ([4348c47](https://github.com/angular/angular/commit/4348c47))
-* **compiler-cli:** only pass canonical genfile paths to compiler host ([#27062](https://github.com/angular/angular/issues/27062)) ([188e9ce](https://github.com/angular/angular/commit/188e9ce))
-* **router:** add `relativeLinkResolution` to `recognize` operator ([#26990](https://github.com/angular/angular/issues/26990)) ([d304427](https://github.com/angular/angular/commit/d304427)), closes [#26983](https://github.com/angular/angular/issues/26983)
-
-
-
-<a name="7.1.0-beta.2"></a>
-# [7.1.0-beta.2](https://github.com/angular/angular/compare/7.1.0-beta.1...7.1.0-beta.2) (2018-11-07)
-
-
-### Bug Fixes
-
-* **bazel:** unknown replay compiler error in windows ([#26711](https://github.com/angular/angular/issues/26711)) ([aed95fd](https://github.com/angular/angular/commit/aed95fd))
-* **core:** ensure that `ɵdefineNgModule` is available in flat-file formats ([#26403](https://github.com/angular/angular/issues/26403)) ([a64859b](https://github.com/angular/angular/commit/a64859b))
-* **router:** remove type bludgeoning of context and outlet when running CanDeactivate ([#26496](https://github.com/angular/angular/issues/26496)) ([496372d](https://github.com/angular/angular/commit/496372d)), closes [#18253](https://github.com/angular/angular/issues/18253)
-* **service-worker:** add typing to public api guard and fix lint errors ([#25860](https://github.com/angular/angular/issues/25860)) ([1061875](https://github.com/angular/angular/commit/1061875))
-* **upgrade:** improve downgrading-related error messages ([#26217](https://github.com/angular/angular/issues/26217)) ([7dbc103](https://github.com/angular/angular/commit/7dbc103))
-* **upgrade:** make typings compatible with older AngularJS typings ([#26880](https://github.com/angular/angular/issues/26880)) ([64647af](https://github.com/angular/angular/commit/64647af)), closes [#26420](https://github.com/angular/angular/issues/26420)
-
-
-### Features
-
-* **compiler:** ability to mark an InvokeFunctionExpr as pure ([#26860](https://github.com/angular/angular/issues/26860)) ([4dfa71f](https://github.com/angular/angular/commit/4dfa71f))
-* **forms:** add updateOn option to FormBuilder ([#24599](https://github.com/angular/angular/issues/24599)) ([e9e804f](https://github.com/angular/angular/commit/e9e804f))
-* **router:** allow guards to return UrlTree as well as boolean ([#26521](https://github.com/angular/angular/issues/26521)) ([081f95c](https://github.com/angular/angular/commit/081f95c))
-* **router:** allow redirect from guards by returning UrlTree ([#26521](https://github.com/angular/angular/issues/26521)) ([152ca66](https://github.com/angular/angular/commit/152ca66))
-* **router:** guard returning UrlTree cancels current navigation and redirects ([#26521](https://github.com/angular/angular/issues/26521)) ([4e9f2e5](https://github.com/angular/angular/commit/4e9f2e5)), closes [#24618](https://github.com/angular/angular/issues/24618)
-* **service-worker:** add typing for messagesClicked in SwPush service ([#25860](https://github.com/angular/angular/issues/25860)) ([c78c221](https://github.com/angular/angular/commit/c78c221))
-* **service-worker:** close notifications and focus window on click ([#25860](https://github.com/angular/angular/issues/25860)) ([f5d5a3d](https://github.com/angular/angular/commit/f5d5a3d))
-* **service-worker:** handle 'notificationclick' events ([#25860](https://github.com/angular/angular/issues/25860)) ([cf6ea28](https://github.com/angular/angular/commit/cf6ea28)), closes [#20956](https://github.com/angular/angular/issues/20956) [#22311](https://github.com/angular/angular/issues/22311)
-* **upgrade:** support downgrading multiple modules ([#26217](https://github.com/angular/angular/issues/26217)) ([93837e9](https://github.com/angular/angular/commit/93837e9)), closes [#26062](https://github.com/angular/angular/issues/26062)
-
-
-
-<a name="7.0.3"></a>
-## [7.0.3](https://github.com/angular/angular/compare/7.0.2...7.0.3) (2018-11-07)
-
-
-### Bug Fixes
-
-* **bazel:** unknown replay compiler error in windows ([#26711](https://github.com/angular/angular/issues/26711)) ([4d532df](https://github.com/angular/angular/commit/4d532df))
-* **router:** remove type bludgeoning of context and outlet when running CanDeactivate ([#26496](https://github.com/angular/angular/issues/26496)) ([dc05385](https://github.com/angular/angular/commit/dc05385)), closes [#18253](https://github.com/angular/angular/issues/18253)
-* **upgrade:** make typings compatible with older AngularJS typings ([#26880](https://github.com/angular/angular/issues/26880)) ([315d95c](https://github.com/angular/angular/commit/315d95c)), closes [#26420](https://github.com/angular/angular/issues/26420)
-
-
-
-<a name="7.1.0-beta.1"></a>
-# [7.1.0-beta.1](https://github.com/angular/angular/compare/7.1.0-beta.0...7.1.0-beta.1) (2018-10-31)
-
-
-### Bug Fixes
-
-* **compiler:** generate inputs with aliases properly ([#26774](https://github.com/angular/angular/issues/26774)) ([19fcfc3](https://github.com/angular/angular/commit/19fcfc3))
-* **compiler:** generate relative paths only in summary file errors ([#26759](https://github.com/angular/angular/issues/26759)) ([56f44be](https://github.com/angular/angular/commit/56f44be))
-* **core:** ignore comment nodes under unsafe elements ([#25879](https://github.com/angular/angular/issues/25879)) ([d5cbcef](https://github.com/angular/angular/commit/d5cbcef))
-* **core:** Remove static dependency from [@angular](https://github.com/angular)/core to [@angular](https://github.com/angular)/compiler ([#26734](https://github.com/angular/angular/issues/26734)) ([d042c4a](https://github.com/angular/angular/commit/d042c4a))
-* **core:** support computed base class in metadata inheritance ([#24014](https://github.com/angular/angular/issues/24014)) ([95743e3](https://github.com/angular/angular/commit/95743e3))
-
-
-
 <a name="7.0.2"></a>
 ## [7.0.2](https://github.com/angular/angular/compare/7.0.1...7.0.2) (2018-10-31)

@ -145,23 +10,6 @@



-<a name="7.1.0-beta.0"></a>
-# [7.1.0-beta.0](https://github.com/angular/angular/compare/7.0.0-rc.1...7.1.0-beta.0) (2018-10-24)
-
-
-### Bug Fixes
-* **core:** allow null value for renderer setElement(…) ([#17065](https://github.com/angular/angular/issues/17065)) ([ff15043](https://github.com/angular/angular/commit/ff15043)), closes [#13686](https://github.com/angular/angular/issues/13686)
-* **router:** fix regression where navigateByUrl promise didn't resolve on CanLoad failure ([#26455](https://github.com/angular/angular/issues/26455)) ([1c9b065](https://github.com/angular/angular/commit/1c9b065)), closes [#26284](https://github.com/angular/angular/issues/26284)
-* **service-worker:** clean up caches from old SW versions ([#26319](https://github.com/angular/angular/issues/26319)) ([2326b9c](https://github.com/angular/angular/commit/2326b9c))
-* **upgrade:** properly destroy upgraded component elements and descendants ([#26209](https://github.com/angular/angular/issues/26209)) ([071934e](https://github.com/angular/angular/commit/071934e)), closes [#26208](https://github.com/angular/angular/issues/26208)
-
-
-### Features
-
-* **router:** add prioritizedGuardValue operator optimization and allowing UrlTree return from guard ([#26478](https://github.com/angular/angular/issues/26478)) ([fdfedce](https://github.com/angular/angular/commit/fdfedce))
-
-
-
 <a name="7.0.1"></a>
 ## [7.0.1](https://github.com/angular/angular/compare/7.0.0...7.0.1) (2018-10-24)

@ -243,7 +91,6 @@ To learn about the release highlights and our new CLI-powered update workflow fo
 ### Bug Fixes

 * **platform-browser:** fix [#22155](https://github.com/angular/angular/issues/22155), destroy hammer manager when `HammerInstance.off()` is run ([#22156](https://github.com/angular/angular/issues/22156)) ([3b4d9dc](https://github.com/angular/angular/commit/3b4d9dc))
-* **upgrade:** properly destroy upgraded component elements and descendants ([#26209](https://github.com/angular/angular/issues/26209)) ([623adbb](https://github.com/angular/angular/commit/623adbb)), closes [#26208](https://github.com/angular/angular/issues/26208)



--- a/2
+++ b/2
@ -53,7 +53,7 @@ node_repositories(
    node_version = "10.9.0",
    package_json = ["//:package.json"],
    preserve_symlinks = True,
-    yarn_version = "1.12.1",
+    yarn_version = "1.9.2",
 )

 yarn_install(
--- a/aio/aio-builds-setup/dockerbuild/scripts-js/package.json
+++ b/aio/aio-builds-setup/dockerbuild/scripts-js/package.json
@ -46,7 +46,7 @@
    "@types/shelljs": "^0.8.0",
    "@types/supertest": "^2.0.5",
    "nodemon": "^1.18.3",
-    "npm-run-all": "^4.1.5",
+    "npm-run-all": "^4.1.3",
    "supertest": "^3.1.0",
    "tslint": "^5.11.0",
    "tslint-jasmine-noSkipOrFocus": "^1.0.9",
--- a/aio/aio-builds-setup/dockerbuild/scripts-js/yarn.lock
+++ b/aio/aio-builds-setup/dockerbuild/scripts-js/yarn.lock
@ -129,7 +129,7 @@ ansi-styles@^2.2.1:
  version "2.2.1"
  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-2.2.1.tgz#b432dd3358b634cf75e1e4664368240533c1ddbe"

-ansi-styles@^3.2.1:
+ansi-styles@^3.2.0, ansi-styles@^3.2.1:
  version "3.2.1"
  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-3.2.1.tgz#41fbb20243e50b12be0f04b8dedbf07520ce841d"
  dependencies:
@ -384,7 +384,7 @@ chalk@^1.1.3:
    strip-ansi "^3.0.0"
    supports-color "^2.0.0"

-chalk@^2.0.1, chalk@^2.3.0, chalk@^2.4.1:
+chalk@^2.0.1, chalk@^2.1.0, chalk@^2.3.0:
  version "2.4.1"
  resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.1.tgz#18c49ab16a037b6eb0152cc83e3471338215b66e"
  dependencies:
@ -532,10 +532,9 @@ cross-spawn@^5.0.1:
    shebang-command "^1.2.0"
    which "^1.2.9"

-cross-spawn@^6.0.5:
+cross-spawn@^6.0.4:
  version "6.0.5"
  resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-6.0.5.tgz#4a5ec7c64dfae22c3a14124dbacdee846d80cbc4"
-  integrity sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==
  dependencies:
    nice-try "^1.0.4"
    path-key "^2.0.1"
@ -1631,17 +1630,16 @@ npm-packlist@^1.1.6:
    ignore-walk "^3.0.1"
    npm-bundled "^1.0.1"

-npm-run-all@^4.1.5:
-  version "4.1.5"
-  resolved "https://registry.yarnpkg.com/npm-run-all/-/npm-run-all-4.1.5.tgz#04476202a15ee0e2e214080861bff12a51d98fba"
-  integrity sha512-Oo82gJDAVcaMdi3nuoKFavkIHBRVqQ1qvMb+9LHk/cF4P6B2m8aP04hGf7oL6wZ9BuGwX1onlLhpuoofSyoQDQ==
+npm-run-all@^4.1.3:
+  version "4.1.3"
+  resolved "https://registry.yarnpkg.com/npm-run-all/-/npm-run-all-4.1.3.tgz#49f15b55a66bb4101664ce270cb18e7103f8f185"
  dependencies:
-    ansi-styles "^3.2.1"
-    chalk "^2.4.1"
-    cross-spawn "^6.0.5"
+    ansi-styles "^3.2.0"
+    chalk "^2.1.0"
+    cross-spawn "^6.0.4"
    memorystream "^0.3.1"
    minimatch "^3.0.4"
-    pidtree "^0.3.0"
+    ps-tree "^1.1.0"
    read-pkg "^3.0.0"
    shell-quote "^1.6.1"
    string.prototype.padend "^3.0.0"
@ -1788,11 +1786,6 @@ pause-stream@0.0.11:
  dependencies:
    through "~2.3"

-pidtree@^0.3.0:
-  version "0.3.0"
-  resolved "https://registry.yarnpkg.com/pidtree/-/pidtree-0.3.0.tgz#f6fada10fccc9f99bf50e90d0b23d72c9ebc2e6b"
-  integrity sha512-9CT4NFlDcosssyg8KVFltgokyKZIFjoBxw8CTGy+5F38Y1eQWrt8tRayiUOXE+zVKQnYu5BR8JjCtvK3BcnBhg==
-
 pify@^2.3.0:
  version "2.3.0"
  resolved "https://registry.yarnpkg.com/pify/-/pify-2.3.0.tgz#ed141a6ac043a849ea588498e7dca8b15330e90c"
--- a/aio/content/cli/index.md
+++ b/aio/content/cli/index.md
@ -11,13 +11,13 @@ Install the CLI using the `npm` package manager:
 npm install -g @angular/cli
 </code-example>

-For details about changes between versions, and information about updating from previous releases,
+For details about changes between versions, and information about updating from previous releases, 
 see the Releases tab on GitHub: https://github.com/angular/angular-cli/releases

 ## Basic workflow

-Invoke the tool on the command line through the `ng` executable.
-Online help is available on the command line.
+Invoke the tool on the command line through the `ng` executable. 
+Online help is available on the command line. 
 Enter the following to list commands or options for a given command (such as [generate](cli/generate)) with a short description.

 <code-example format="." language="bash">
@ -34,34 +34,33 @@ ng serve
 </code-example>

 In your browser, open http://localhost:4200/ to see the new app run.
-When you use the [ng serve](cli/serve) command to build an app and serve it locally, the server automatically rebuilds the app and reloads the page when you change any of the source files.

 ## Workspaces and project files

-The [ng new](cli/new) command creates an *Angular workspace* folder and generates a new app skeleton.
+The [ng new](cli/new) command creates an *Angular workspace* folder and generates a new app skeleton. 
 A workspace can contain multiple apps and libraries.
-The initial app created by the [ng new](cli/new) command is at the top level of the workspace.
+The initial app created by the [ng new](cli/new) command is at the top level of the workspace. 
 When you generate an additional app or library in a workspace, it goes into a `projects/` subfolder.

-A newly generated app contains the source files for a root module, with a root component and template.
+A newly generated app contains the source files for a root module, with a root component and template. 
 Each app has a `src` folder that contains the logic, data, and assets.

-You can edit the generated files directly, or add to and modify them using CLI commands.
-Use the [ng generate](cli/generate) command to add new files for additional components and services, and code for new pipes, directives, and so on.
+You can edit the generated files directly, or add to and modify them using CLI commands. 
+Use the [ng generate](cli/generate) command to add new files for additional components and services, and code for new pipes, directives, and so on. 
 Commands such as [add](cli/add) and [generate](cli/generate), which create or operate on apps and libraries, must be executed from within a workspace or project folder.

 * See more about the [Workspace file structure](guide/file-structure).

-### Workspace and project configuration
+When you use the [ng serve](cli/serve) command to build an app and serve it locally, the server automatically rebuilds the app and reloads the page when you change any of the source files.

-A single workspace configuration file, `angular.json`, is created at the top level of the workspace.
-This is where you can set per-project defaults for CLI command options, and specify configurations to use when the CLI builds a project for different targets.
+A single workspace configuration file, `angular.json`, is created at the top level of the workspace. 
+This is where you can set workspace-wide defaults, and specify configurations to use when the CLI builds a project for different targets.

 The [ng config](cli/config) command lets you set and retrieve configuration values from the command line, or you can edit the `angular.json` file directly.
-Note that option names in the configuration file must use [camelCase](guide/glossary#case-types), while option names supplied to commands can use either camelCase or dash-case.

-* See more about [Workspace Configuration](guide/workspace-config).
 * See the [complete schema](https://github.com/angular/angular-cli/wiki/angular-workspace) for `angular.json`.
+<!-- * Learn more about *configuration options for Angular(links to new guide or topics TBD)*. -->
+

 ## CLI command-language syntax

@ -71,20 +70,20 @@ Command syntax is shown as follows:

 * Most commands, and some options, have aliases. Aliases are shown in the syntax statement for each command.

-* Option names are prefixed with a double dash (--).
-    Option aliases are prefixed with a single dash (-).
+* Option names are prefixed with a double dash (--). 
+    Option aliases are prefixed with a single dash (-). 
    Arguments are not prefixed.
    For example: `ng build my-app -c production`

-* Typically, the name of a generated artifact can be given as an argument to the command or specified with the --name option.
+* Typically, the name of a generated artifact can be given as an argument to the command or specified with the --name option. 

-* Argument and option names can be given in either
-[camelCase or dash-case](guide/glossary#case-types).
+* Argument and option names can be given in either 
+[camelCase or dash-case](guide/glossary#case-types). 
 `--myOptionName` is equivalent to `--my-option-name`.

 ### Boolean and enumerated options

-Boolean options have two forms: `--thisOption` sets the flag, `--noThisOption` clears it.
+Boolean options have two forms: `--thisOption` sets the flag, `--noThisOption` clears it.  
 If neither option is supplied, the flag remains in its default state, as listed in the reference documentation.

 Allowed values are given with each enumerated option description, with the default value in **bold**.
@ -95,6 +94,7 @@ Options that specify files can be given as absolute paths, or as paths relative

 ### Schematics

-The [ng generate](cli/generate) and  [ng add](cli/add) commands take as an argument the artifact or library to be generated or added to the current project.
-In addition to any general options, each artifact or library defines its own options in a *schematic*.
-Schematic options are supplied to the command in the same format as immediate command options.
+The [ng generate](cli/generate) and  [ng add](cli/add) commands take as an argument the artifact or library to be generated or added to the current project. 
+In addition to any general options, each artifact or library defines its own options in a *schematic*. 
+Schematic options are supplied to the command in the same format as immediate command options. 
+
--- a/aio/content/examples/forms/src/app/hero-form/hero-form.component.html
+++ b/aio/content/examples/forms/src/app/hero-form/hero-form.component.html
@ -72,15 +72,15 @@
    <h2>You submitted the following:</h2>
    <div class="row">
      <div class="col-xs-3">Name</div>
-      <div class="col-xs-9">{{ model.name }}</div>
+      <div class="col-xs-9  pull-left">{{ model.name }}</div>
    </div>
    <div class="row">
      <div class="col-xs-3">Alter Ego</div>
-      <div class="col-xs-9">{{ model.alterEgo }}</div>
+      <div class="col-xs-9 pull-left">{{ model.alterEgo }}</div>
    </div>
    <div class="row">
      <div class="col-xs-3">Power</div>
-      <div class="col-xs-9">{{ model.power }}</div>
+      <div class="col-xs-9 pull-left">{{ model.power }}</div>
    </div>
    <br>
    <button class="btn btn-primary" (click)="submitted=false">Edit</button>
--- a/aio/content/examples/security/e2e/src/app.e2e-spec.ts
+++ b/aio/content/examples/security/e2e/src/app.e2e-spec.ts
@ -10,7 +10,7 @@ describe('Security E2E Tests', () => {
    expect(interpolated.getText())
        .toContain('Template <script>alert("0wned")</script> <b>Syntax</b>');
    let bound = element(By.className('e2e-inner-html-bound'));
-    expect(bound.getText()).toContain('Template Syntax');
+    expect(bound.getText()).toContain('Template alert("0wned") Syntax');
    let bold = element(By.css('.e2e-inner-html-bound b'));
    expect(bold.getText()).toContain('Syntax');
  });
--- a/aio/content/examples/toh-pt6/src/app/hero-search/hero-search.component.html
+++ b/aio/content/examples/toh-pt6/src/app/hero-search/hero-search.component.html
@ -2,7 +2,7 @@
  <h4>Hero Search</h4>

  <!-- #docregion input -->
-  <input #searchBox id="search-box" (input)="search(searchBox.value)" />
+  <input #searchBox id="search-box" (keyup)="search(searchBox.value)" />
  <!-- #enddocregion input -->

  <ul class="search-result">
--- a/aio/content/examples/toh-pt6/src/app/in-memory-data.service.ts
+++ b/aio/content/examples/toh-pt6/src/app/in-memory-data.service.ts
@ -1,11 +1,7 @@
 // #docregion , init
 import { InMemoryDbService } from 'angular-in-memory-web-api';
 import { Hero } from './hero';
-import { Injectable } from '@angular/core';

-@Injectable({
-  providedIn: 'root',
-})
 export class InMemoryDataService implements InMemoryDbService {
  createDb() {
    const heroes = [
--- a/aio/content/examples/universal/src/app/hero-search/hero-search.component.html
+++ b/aio/content/examples/universal/src/app/hero-search/hero-search.component.html
@ -1,7 +1,7 @@
 <div id="search-component">
  <h4>Hero Search</h4>

-  <input #searchBox id="search-box" (input)="search(searchBox.value)" />
+  <input #searchBox id="search-box" (keyup)="search(searchBox.value)" />

  <ul class="search-result">
    <li *ngFor="let hero of heroes | async" >
--- a/aio/content/guide/architecture-modules.md
+++ b/aio/content/guide/architecture-modules.md
@ -56,9 +56,7 @@ A component and its template together define a *view*. A component can contain a
 When you create a component, it's associated directly with a single view, called the *host view*. The host view can be the root of a view hierarchy, which can contain *embedded views*, which are in turn the host views of other components. Those components can be in the same NgModule, or can be imported from other NgModules. Views in the tree can be nested to any depth.

 <div class="alert is-helpful">
-
-**Note:** The hierarchical structure of views is a key factor in the way Angular detects and responds to changes in the DOM and app data.
-
+    **Note:** The hierarchical structure of views is a key factor in the way Angular detects and responds to changes in the DOM and app data. 
 </div>

 ## NgModules and JavaScript modules
--- a/aio/content/guide/architecture-services.md
+++ b/aio/content/guide/architecture-services.md
@ -48,7 +48,7 @@ Similarly, use the `@Injectable()` decorator to indicate that a component or oth

 * An injector creates dependencies, and maintains a *container* of dependency instances that it reuses if possible.

-* A *provider* is an object that tells an injector how to obtain or create a dependency.
+* A *provider* is an object that tell an injector how to obtain or create a dependency.

 For any dependency that you need in your app, you must register a provider with the app's injector, 
 so that the injector can use the provider to create new instances. 
--- a/aio/content/guide/build.md
+++ b/aio/content/guide/build.md
@ -32,11 +32,11 @@ For example:

 The base file `environment.ts`, contains the default environment settings. For example:

-```
+<code-example language="none" class="code-shell">
 export const environment = {
  production: false
 };
-```
+</code-example>

 The `build` command uses this as the build target when no environment is specified. 
 You can add further variables, either as additional properties on the environment object, or as separate objects. 
@ -144,11 +144,7 @@ You can add additional configurations as required. To add a staging environment,
 You can add more configuration options to this target environment as well. 
 Any option that your build supports can be overridden in a build target configuration.

-To build using the staging configuration, run the following command:
-
-<code-example language="sh" class="code-shell">
- ng build --configuration=staging
-</code-example>
+To build using the staging configuration, run `ng build --configuration=staging`.

 You can also configure the `serve` command to use the targeted build configuration if you add it to the "serve:configurations" section of `angular.json`:

--- a/aio/content/guide/elements.md
+++ b/aio/content/guide/elements.md
@ -107,7 +107,7 @@ The recently-developed [custom elements](https://developer.mozilla.org/en-US/doc
 </tr>
 <tr>
  <td>Firefox</td>
-  <td>Supported natively as of version 63. In older versions: Set the <code>dom.webcomponents.enabled</code> and <code>dom.webcomponents.customelements.enabled</code> preferences to true.</td>
+  <td> Set the <code>dom.webcomponents.enabled</code> and <code>dom.webcomponents.customelements.enabled</code> preferences to true. Planned to be enabled by default in version 63.</td>
 </tr>
 <tr>
  <td>Edge</td>
--- a/aio/content/guide/file-structure.md
+++ b/aio/content/guide/file-structure.md
@ -20,15 +20,16 @@ The top level of the workspace contains a number of workspace-wide configuration
 | :--------------------- | :------------------------------------------|
 | `.editorconfig`        | Configuration for code editors. See [EditorConfig](https://editorconfig.org/). |
 | `.gitignore`           | Specifies intentionally untracked files that [Git](https://git-scm.com/) should ignore. |
-| `angular.json`         | CLI configuration defaults for all projects in the workspace, including configuration options for build, serve, and test tools that the CLI uses, such as [TSLint](https://palantir.github.io/tslint/), [Karma](https://karma-runner.github.io/), and [Protractor](http://www.protractortest.org/). For details, see [Angular Workspace Configuration](guide/workspace-config). |
+| `angular.json`        | CLI configuration for all projects in the workspace, including configuration options for build, serve, and test tools that the CLI uses, such as [Karma](https://karma-runner.github.io/) and [Protractor](http://www.protractortest.org/).  |
 | `node_modules`         | Provides [npm packages](guide/npm-packages) to the entire workspace. |
-| `package.json`         | Configures [npm package dependencies](guide/npm-packages) that are available to all projects in the workspace. See [npm documentation](https://docs.npmjs.com/files/package.json) for the specific format and contents of this file. |
-| `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. |
-| `tsconfig.json`        | Default [TypeScript](https://www.typescriptlang.org/) configuration for apps in the workspace, including TypeScript and Angular template compiler options. See [TypeScript Configuration](guide/typescript-configuration). |
-| `tslint.json`          | Default [TSLint](https://palantir.github.io/tslint/) configuration for apps in the workspace. |
+| `package.json`        | Lists package dependencies. See [npm documentation](https://docs.npmjs.com/files/package.json) for the specific format and contents of this file.|
+| `tsconfig.app.json`   | Default [TypeScript](https://www.typescriptlang.org/) configuration for apps in the workspace. |
+| `tsconfig.spec.json`  | Default TypeScript configuration for e2e test apps in the workspace. |
+| `tslint.json`         | Default [TSLint](https://palantir.github.io/tslint/) configuration for apps in the workspace. |
 | `README.md`            | Introductory documentation. |
+| `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. |

-All projects within a workspace share a [CLI configuration context](guide/workspace-config). 
+All projects within a workspace share this configuration context. 
 Project-specific [TypeScript](https://www.typescriptlang.org/) configuration files inherit from the workspace-wide `tsconfig.*.json`, and app-specific [TSLint](https://palantir.github.io/tslint/) configuration files inherit from the workspace-wide `tslint.json`.

 ### Default app project files
@ -39,9 +40,9 @@ This initial app is the *default app* for CLI commands (unless you change the de
 A newly generated app contains the source files for a root module, with a root component and template. 
 When the workspace file structure is in place, you can use the `ng generate` command on the command line to add functionality and data to the initial app.

-<div class="alert is-helpful">
+<div class="alert is-helpful>

-   Besides using the CLI on the command line, you can also use an interactive development environment like [Angular Console](https://angularconsole.com/), or manipulate files directly in the app's source folder and configuration files.
+ Besides using the CLI on the command line, You can also use an interactive development environment like [Angular Console](https://angular.console.com), or manipulate files directly in the app's source folder and configuration files.

 </div>

@ -103,6 +104,18 @@ my-app/

 Inside the `src/` folder, the `app/` folder contains your app's logic and data. Angular components, templates, and styles go here. An `assets/` subfolder contains images and anything else your app needs. Files at the top level of `src/` support testing and running your app.

+<code-example language="none" linenums="false">
+   src/
+    app/
+        app.component.css
+        app.component.html
+        app.component.spec.ts
+        app.component.ts
+        app.module.ts
+        assets/...
+    ...
+</code-example>
+
 | APP SOURCE FILES | PURPOSE |
 | :-------------------------- | :------------------------------------------|
 | `app/app.component.ts`      | Defines the logic for the app's root component, named `AppComponent`. The view associated with this root component becomes the root of the [view hierarchy](guide/glossary#view-hierarchy) as you add components and services to your app. |
--- a/aio/content/guide/glossary.md
+++ b/aio/content/guide/glossary.md
@ -317,30 +317,6 @@ Within Angular, use [NgModules](guide/glossary#ngmodule) to make public parts av

 {@a F}

-{@a form-control}
-
-## form control
-
-A instance of `FormControl`, which is a fundamental building block for Angular forms. Together with `FormGroup` and `FormArray`, tracks the value, validation, and status of a form input element.
-
-Read more forms in the [Introduction to forms in Angular](guide/forms-overview).
-
-{@a form-model}
-
-## form model
-
-The "source of truth" for the value and validation status of a form input element at a given point in time. When using [reactive forms](guide/glossary#reactive-forms), the form model is created explicitly in the component class. When using [template-driven forms](guide/glossary#template-driven-forms), the form model is implicitly created by directives.
-
-Learn more about reactive and template-driven forms in the [Introduction to forms in Angular](guide/forms-overview).
-
-{@a form-validation}
-
-## form validation
-
-A check that runs when form values change and reports whether the given values are correct and complete, according to the defined constraints. Reactive forms apply [validator functions](guide/form-validation#adding-to-reactive-forms). Template-driven forms use [validator directives](guide/form-validation#adding-to-template-driven-forms).
-
-
-To learn more, see [Form Validation](guide/form-validation).

 {@a G}

@ -349,14 +325,6 @@ To learn more, see [Form Validation](guide/form-validation).

 {@a I}

-
-{@a immutability}
-
-## immutability
-
-The ability to alter the state of a value after its creation. [Reactive forms](guide/glossary#reactive-forms) perform immutable changes in that
-each change to the data model produces a new data model rather than modifying the existing one. [Template-driven forms](guide/glossary#template-driven-forms) perform mutable changes with `NgModel` and [two-way data binding](guide/glossary#data-binding) to modify the existing data model in place.
-
 {@a injectable}

 ## injectable
@ -607,15 +575,14 @@ Learn more in [Dependency Injection](guide/dependency-injection).
 A framework for building Angular forms through code in a component.
 The alternative is a [template-driven form](guide/glossary#template-driven-forms).

-When using reactive forms:
+When building reactive forms:

-* The "source of truth", the form model, is defined in the component class.
-* Validation is set up through validation functions rather than valdation directives.
-* Each control is explicitly created in the component class by creating a `FormControl` instance manually or with `FormBuilder`.
+* The "source of truth" is the component. The validation is defined using code in the component.
+* Each control is explicitly created in the component class with `new FormControl()` or with `FormBuilder`.
 * The template input elements do *not* use `ngModel`.
-* The associated Angular directives are prefixed with `form`, such as `formControl`, `formGroup`, and `formControlName`.
+* The associated Angular directives are prefixed with `Form`, such as `FormGroup()`, `FormControl()`, and `FormControlName()`.

-The alternative is a template-driven form. For an introduction and comparison of both forms approaches, see [Introduction to Angular Forms](guide/forms-overview).
+Reactive forms are powerful, flexible, and a good choice for more complex data-entry form scenarios, such as dynamic generation of form controls.

 {@a router}
 {@a router-module}
@ -730,14 +697,16 @@ Additional templates, represented by `TemplateRef` objects, can define alternati
 A format for building Angular forms using HTML forms and input elements in the view.
 The alternative format uses the [reactive forms](guide/glossary#reactive-forms) framework.

-When using template-driven forms:
+When building template-driven forms:

 * The "source of truth" is the template. The validation is defined using attributes on the individual input elements.
 * [Two-way binding](guide/glossary#data-binding) with `ngModel` keeps the component model synchronized with the user's entry into the input elements.
 * Behind the scenes, Angular creates a new control for each input element, provided you have set up a `name` attribute and two-way binding for each input.
 * The associated Angular directives are prefixed with `ng` such as `ngForm`, `ngModel`, and `ngModelGroup`.

-The alternative is a reactive form. For an introduction and comparison of both forms approaches, see [Introduction to Angular Forms](guide/forms-overview).
+Template-driven forms are convenient, quick, and simple. They are a good choice for many basic data-entry form scenarios.
+
+Read about how to build template-driven forms in [Forms](guide/forms).

 {@a template-expression}

--- a/aio/content/guide/npm-packages.md
+++ b/aio/content/guide/npm-packages.md
@ -81,7 +81,7 @@ The following support packages are included as dependencies in the default `pack

 Package name                               | Description
 ----------------------------------------   | --------------------------------------------------
-[**rxjs**](https://github.com/ReactiveX/rxjs) | Many Angular APIs return [_observables_](guide/glossary#observable). RxJS is an implementation of the proposed [Observables specification](https://github.com/tc39/proposal-observable) currently before the [TC39](https://www.ecma-international.org/memento/tc39-m.htm) committee, which determines standards for the JavaScript language.
+[**rxjs**](https://github.com/ReactiveX/rxjs) | Many Angular APIs return [_observables_](guide/glossary#observable). RxJS is an implementation of the proposed [Observables specification](https://github.com/zenparsing/es-observable) currently before the [TC39](http://www.ecma-international.org/memento/TC39.htm) committee, which determines standards for the JavaScript language.
 [**zone.js**](https://github.com/angular/zone.js) | Angular relies on zone.js to run Angular's change detection processes when native JavaScript operations raise events.  Zone.js is an implementation of a [specification](https://gist.github.com/mhevery/63fdcdf7c65886051d55) currently before the [TC39](http://www.ecma-international.org/memento/TC39.htm) committee that determines standards for the JavaScript language.


--- a/aio/content/guide/router.md
+++ b/aio/content/guide/router.md
@ -3066,13 +3066,11 @@ A guard's return value controls the router's behavior:

 * If it returns `true`, the navigation process continues.
 * If it returns `false`, the navigation process stops and the user stays put.
-* If it returns a `UrlTree`, the current navigation cancels and a new navigation is initiated to the `UrlTree` returned.


 <div class="alert is-helpful">

-**Note:** The guard can also tell the router to navigate elsewhere, effectively canceling the current navigation. When
-doing so inside a guard, the guard should return `false`;
+**Note:** The guard can also tell the router to navigate elsewhere, effectively canceling the current navigation.

 </div>

--- a/aio/content/guide/security.md
+++ b/aio/content/guide/security.md
@ -119,7 +119,7 @@ vulnerability. For example, code contained in a `<script>` tag is executed:


 Angular recognizes the value as unsafe and automatically sanitizes it, which removes the `<script>`
-tag but keeps safe content such as the `<b>` element.
+tag but keeps safe content such as the text content of the `<script>` tag and the `<b>` element.


 <figure>
--- a/aio/content/guide/universal.md
+++ b/aio/content/guide/universal.md
@ -62,7 +62,7 @@ Your app may have to launch faster to engage these users before they decide to d

 With Angular Universal, you can generate landing pages for the app that look like the complete app.
 The pages are pure HTML, and can display even if JavaScript is disabled.
-The pages don't handle browser events, but they _do_ support navigation through the site using [`routerLink`](guide/router#router-link).
+The pages don't handle browser events, but they _do_ support navigation through the site using `[routerLink](guide/router#router-link)`.

 In practice, you'll serve a static version of the landing page to hold the user's attention.
 At the same time, you'll load the full Angular app behind it. 
--- a/aio/content/guide/upgrade-performance.md
+++ b/aio/content/guide/upgrade-performance.md
@ -281,28 +281,22 @@ The differences between `downgradeModule()` and `UpgradeModule` end here. The re
 `upgrade/static` APIs and concepts work in the exact same way for both types of hybrid apps.
 See [Upgrading from AngularJS](guide/upgrade) to learn about:

- [Using Angular Components from AngularJS Code](guide/upgrade#using-angular-components-from-angularjs-code).<br />
-  _NOTE: If you are downgrading multiple modules, you need to specify the name of the downgraded
-  module each component belongs to, when calling `downgradeComponent()`._
+- [Using Angular Components from AngularJS Code](guide/upgrade#using-angular-components-from-angularjs-code).
 - [Using AngularJS Component Directives from Angular Code](guide/upgrade#using-angularjs-component-directives-from-angular-code).
 - [Projecting AngularJS Content into Angular Components](guide/upgrade#projecting-angularjs-content-into-angular-components).
 - [Transcluding Angular Content into AngularJS Component Directives](guide/upgrade#transcluding-angular-content-into-angularjs-component-directives).
 - [Making AngularJS Dependencies Injectable to Angular](guide/upgrade#making-angularjs-dependencies-injectable-to-angular).
- [Making Angular Dependencies Injectable to AngularJS](guide/upgrade#making-angular-dependencies-injectable-to-angularjs).<br />
-  _NOTE: If you are downgrading multiple modules, you need to specify the name of the downgraded
-  module each injectable belongs to, when calling `downgradeInjectable()`._
+- [Making Angular Dependencies Injectable to AngularJS](guide/upgrade#making-angular-dependencies-injectable-to-angularjs).

 <div class="alert is-important">

  While it is possible to downgrade injectables, downgraded injectables will not be available until
-  the Angular module that provides them is instantiated. In order to be safe, you need to ensure
-  that the downgraded injectables are not used anywhere _outside_ the part of the app where it is
-  guaranteed that their module has been instantiated.
+  the Angular module is instantiated. In order to be safe, you need to ensure that the downgraded
+  injectables are not used anywhere _outside_ the part of the app that is controlled by Angular.

  For example, it is _OK_ to use a downgraded service in an upgraded component that is only used
-  from a downgraded Angular component provided by the same Angular module as the injectable, but it
-  is _not OK_ to use it in an AngularJS component that may be used independently of Angular or use
-  it in a downgraded Angular component from a different module.
+  from Angular components, but it is _not OK_ to use it in an AngularJS component that may be used
+  independently of Angular.

 </div>

--- a/aio/content/guide/workspace-config.md
+++ b/aio/content/guide/workspace-config.md
@ -78,7 +78,7 @@ Each target object specifies the `builder` for that target, which is the npm pac
      }
 </code-example>

-* The `architect/build` section configures defaults for options of the `ng build` command. See [Build target](#build-target) below for more information.
+* The `architect/build` section configures defaults for options of the `ng build` command. See [Build target]{#build-target} below for more information.

 * The `architect/serve` section overrides build defaults and supplies additional serve defaults for the `ng serve` command.  In addition to the options available for the `ng build` command, it adds options related to serving the app.

--- a/aio/content/images/guide/security/binding-inner-html.png
+++ b/aio/content/images/guide/security/binding-inner-html.png
--- a/aio/content/marketing/resources.json
+++ b/aio/content/marketing/resources.json
@ -22,12 +22,6 @@
            "rev": true,
            "title": "Made with Angular",
            "url": "https://www.madewithangular.com/"
-          },
-          "angular-subreddit": {
-            "desc": "An Angular-dedicated subreddit.",
-            "rev": true,
-            "title": "Angular Subreddit",
-            "url": "https://www.reddit.com/r/Angular2/"
          }
        }
      },
@ -155,13 +149,6 @@
            "rev": true,
            "title": "AngularCommerce",
            "url": "https://github.com/NodeArt/angular-commerce"
-          },
-          "ngx-api-utils": {
-            "desc": "ngx-api-utils is a lean library of utilities and helpers to quickly integrate any HTTP API (REST, Ajax, and any other) with Angular.",
-            "logo": "",
-            "rev": true,
-            "title": "ngx-api-utils",
-            "url": "https://github.com/ngx-api-utils/ngx-api-utils"
          }
        }
      },
--- a/aio/content/marketing/test.html
+++ b/aio/content/marketing/test.html
@ -120,20 +120,3 @@ Try this <live-example></live-example>.
 <live-example embedded name="testy" stackblitz="super-stackblitz"></live-example>

 <p>More text follows ...</p>
-
-<p>Getting Started Widgets</p>
-
-<p>Interpolation</p>
-<aio-gs-interpolation></aio-gs-interpolation>
-
-<p>Property Binding</p>
-<aio-gs-property-binding></aio-gs-property-binding>
-
-<p>Event Binding</p>
-<aio-gs-event-binding></aio-gs-event-binding>
-
-<p>NgIf</p>
-<aio-gs-ng-if></aio-gs-ng-if>
-
-<p>NgFor</p>
-<aio-gs-ng-for></aio-gs-ng-for>
--- a/aio/content/tutorial/toh-pt0.md
+++ b/aio/content/tutorial/toh-pt0.md
@ -19,7 +19,7 @@ To set up your development environment, follow these instructions in [Getting St

 <div class="alert is-helpful">

-**Note:** You do not need to complete the entire Getting Started. After you complete the above two sections of Getting Started, your environment is set up. Continue below to create the Tour of Heroes workspace and an initial app project.
+**Note:**: You do not need to complete the entire Getting Started. After you complete the above two sections of Getting Started, your environment is set up. Continue below to create the Tour of Heroes workspace and an initial app project.
 </div>


--- a/aio/content/tutorial/toh-pt6.md
+++ b/aio/content/tutorial/toh-pt6.md
@ -77,13 +77,8 @@ _after importing the `HttpClientModule`_,
 The `forRoot()` configuration method takes an `InMemoryDataService` class
 that primes the in-memory database.

-The class `src/app/in-memory-data.service.ts` is generated by the following command:
-
-<code-example language="sh" class="code-shell">
-  ng generate service InMemoryData
-</code-example>
-
-This class has the following content:
+The _Tour of Heroes_ sample creates such a class 
+`src/app/in-memory-data.service.ts` which has the following content:

 <code-example path="toh-pt6/src/app/in-memory-data.service.ts" region="init" header="src/app/in-memory-data.service.ts" linenums="false"></code-example>

@ -466,7 +461,7 @@ Replace the generated `HeroSearchComponent` _template_ with a text box and a lis
 Add private CSS styles to `hero-search.component.css`
 as listed in the [final code review](#herosearchcomponent) below.

-As the user types in the search box, an *input* event binding calls the component's `search()`
+As the user types in the search box, a *keyup* event binding calls the component's `search()`
 method with the new search box value.

 {@a asyncpipe}
@ -516,7 +511,7 @@ You can also push values into that `Observable` by calling its `next(value)` met
 as the `search()` method does.

 The `search()` method is called via an _event binding_ to the
-textbox's `input` event.
+textbox's `keystroke` event.

 <code-example path="toh-pt6/src/app/hero-search/hero-search.component.html" region="input"></code-example>

--- a/aio/package.json
+++ b/aio/package.json
@ -18,7 +18,7 @@
    "build-for": "yarn ~~build --configuration",
    "prebuild-local": "yarn setup-local",
    "build-local": "yarn ~~build --configuration=stable",
-    "extract-cli-command-docs": "node tools/transforms/cli-docs-package/extract-cli-commands.js a176d127a",
+    "extract-cli-command-docs": "node tools/transforms/cli-docs-package/extract-cli-commands.js 4faa81e25",
    "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",
@ -71,7 +71,7 @@
  },
  "engines": {
    "node": ">=10.9.0 <11.0.0",
-    "yarn": ">=1.10.1 <1.13.0"
+    "yarn": ">=1.9.2 <2.0.0"
  },
  "private": true,
  "dependencies": {
@ -104,7 +104,7 @@
    "@types/jasminewd2": "^2.0.4",
    "@types/node": "~6.0.60",
    "archiver": "^1.3.0",
-    "canonical-path": "1.0.0",
+    "canonical-path": "^0.0.2",
    "chalk": "^2.1.0",
    "cjson": "^0.5.0",
    "codelyzer": "~4.2.1",
@ -141,7 +141,7 @@
    "lighthouse": "^3.2.1",
    "lodash": "^4.17.4",
    "lunr": "^2.1.0",
-    "npm-run-all": "^4.1.5",
+    "npm-run-all": "^4.1.3",
    "protractor": "^5.2.0",
    "rehype": "^6.0.0",
    "rehype-slug": "^2.0.0",
--- a/aio/scripts/_payload-limits.json
+++ b/aio/scripts/_payload-limits.json
@ -2,8 +2,8 @@
  "aio": {
    "master": {
      "uncompressed": {
-        "runtime": 3881,
-        "main": 499953,
+        "runtime": 3173,
+        "main": 494475,
        "polyfills": 53926,
        "prettify": 14917
      }
--- a/aio/src/app/app.component.spec.ts
+++ b/aio/src/app/app.component.spec.ts
@ -742,7 +742,7 @@ describe('AppComponent', () => {
          expect(component.showSearchResults).toBe(true);
        });

-        it('should not intercept clicks on the searchBox', () => {
+        it('should not intercept clicks om the searchBox', () => {
          component.showSearchResults = true;
          fixture.detectChanges();

@ -752,11 +752,6 @@ describe('AppComponent', () => {

          expect(component.showSearchResults).toBe(true);
        });
-
-        it('should not call `locationService.setSearch` when searchResults are not shown', () => {
-          docViewer.click();
-          expect(locationService.setSearch).not.toHaveBeenCalled();
-        });
      });

      describe('keyup handling', () => {
--- a/aio/src/app/app.component.ts
+++ b/aio/src/app/app.component.ts
@ -389,10 +389,7 @@ export class AppComponent implements OnInit {

  hideSearchResults() {
    this.showSearchResults = false;
-    const oldSearch = this.locationService.search();
-    if (oldSearch.search !== undefined) {
-      this.locationService.setSearch('', { ...oldSearch, search: undefined });
-    }
+    this.locationService.setSearch('', { ...this.locationService.search(), search: undefined });
  }

  focusSearchBox() {
--- a/aio/src/app/custom-elements/element-registry.ts
+++ b/aio/src/app/custom-elements/element-registry.ts
@ -48,26 +48,6 @@ export const ELEMENT_MODULE_PATHS_AS_ROUTES = [
    selector: 'live-example',
    loadChildren: './live-example/live-example.module#LiveExampleModule'
  },
-  {
-    selector: 'aio-gs-interpolation',
-    loadChildren: './getting-started/interpolation/interpolation.module#InterpolationModule'
-  },
-  {
-    selector: 'aio-gs-property-binding',
-    loadChildren: './getting-started/property-binding/property-binding.module#PropertyBindingModule'
-  },
-  {
-    selector: 'aio-gs-event-binding',
-    loadChildren: './getting-started/event-binding/event-binding.module#EventBindingModule'
-  },
-  {
-    selector: 'aio-gs-ng-if',
-    loadChildren: './getting-started/ng-if/ng-if.module#NgIfModule'
-  },
-  {
-    selector: 'aio-gs-ng-for',
-    loadChildren: './getting-started/ng-for/ng-for.module#NgForModule'
-  },
 ];

 /**
--- a/aio/src/app/custom-elements/getting-started/container/container.component.spec.ts
+++ b/aio/src/app/custom-elements/getting-started/container/container.component.spec.ts
@ -1,39 +0,0 @@
-import { Component } from '@angular/core';
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { ContainerComponent } from './container.component';
-
-@Component({
-  template: `
-    <aio-gs-container>
-      <ng-container class="template">Template</ng-container>
-      <ng-container class="data">Data</ng-container>
-      <ng-container class="result">Result</ng-container>
-    </aio-gs-container>
-  `
-})
-export class TestComponent {}
-
-describe('Getting Started Container Component', () => {
-  let fixture: ComponentFixture<ContainerComponent>;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      declarations: [ ContainerComponent, TestComponent ]
-    });
-
-    fixture = TestBed.createComponent(TestComponent);
-    fixture.detectChanges();
-  });
-
-  it('should project the content into the appropriate areas', () => {
-    const compiled = fixture.debugElement.nativeElement;
-    const pre = compiled.querySelector('pre');
-    const code = compiled.querySelector('code');
-    const tabledata = compiled.querySelectorAll('td');
-
-    expect(pre.textContent).toContain('Template');
-    expect(code.textContent).toContain('Data');
-    expect(tabledata[2].textContent).toContain('Result');
-  });
-});
--- a/aio/src/app/custom-elements/getting-started/container/container.component.ts
+++ b/aio/src/app/custom-elements/getting-started/container/container.component.ts
@ -1,80 +0,0 @@
-import { Component } from '@angular/core';
-
-@Component({
-  selector: 'aio-gs-container',
-  template: `
-    <table>
-      <thead>
-        <tr>
-          <th>Template</th>
-          <th>Data</th>
-          <th>Result</th>
-        </tr>
-      </thead>
-      <tbody>
-        <tr>
-          <td>
-            <pre><ng-content select=".template"></ng-content></pre>
-          </td>
-          <td>
-            <code><ng-content select=".data"></ng-content></code>
-          </td>
-          <td><ng-content select=".result"></ng-content></td>
-        </tr>
-      </tbody>
-    </table>
-  `,
-  styles: [
-    `
-    pre {
-      margin: 0;
-    }
-
-    code {
-      display: flex;
-      align-items: center;
-    }
-
-    @media only screen and (max-width: 760px),
-    (min-device-width: 768px) and (max-device-width: 1024px)  {
-      /* Force table to not be like tables anymore */
-      table, thead, tbody, th, td, tr {
-        display: block;
-      }
-
-      /* Hide table headers (but not display: none;, for accessibility) */
-      thead tr {
-        position: absolute;
-        top: -9999px;
-        left: -9999px;
-      }
-
-      tr { border: 1px solid #ccc; }
-
-      td {
-        /* Behave  like a "row" */
-        border: none;
-        border-bottom: 1px solid #eee;
-        position: relative;
-        padding-top: 10%;
-      }
-
-      td:before {
-        /* Now like a table header */
-        position: absolute;
-        /* Top/left values mimic padding */
-        top: 6px;
-        left: 6px;
-        width: 45%;
-        padding-right: 10px;
-      }
-
-      /* Label the data */
-      td:nth-of-type(1):before { content: "Template"; }
-      td:nth-of-type(2):before { content: "Data"; }
-      td:nth-of-type(3):before { content: "Result"; }
-    }
-    `
-  ]
-})
-export class ContainerComponent { }
--- a/aio/src/app/custom-elements/getting-started/container/container.module.ts
+++ b/aio/src/app/custom-elements/getting-started/container/container.module.ts
@ -1,10 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ContainerComponent } from './container.component';
-
-@NgModule({
-  imports: [ CommonModule ],
-  declarations: [ ContainerComponent ],
-  exports: [ ContainerComponent ]
-})
-export class ContainerModule { }
--- a/aio/src/app/custom-elements/getting-started/event-binding/event-binding.component.spec.ts
+++ b/aio/src/app/custom-elements/getting-started/event-binding/event-binding.component.spec.ts
@ -1,46 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { ContainerModule } from '../container/container.module';
-import { EventBindingComponent } from './event-binding.component';
-import { createCustomEvent } from '../../../../testing/dom-utils';
-
-describe('Getting Started Event Binding Component', () => {
-  let component: EventBindingComponent;
-  let fixture: ComponentFixture<EventBindingComponent>;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      imports: [ ContainerModule ],
-      declarations: [ EventBindingComponent ]
-    });
-
-    fixture = TestBed.createComponent(EventBindingComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-
-    spyOn(window, 'alert');
-  });
-
-  it('should update the name property on input change', () => {
-    const text = 'Hello Angular';
-    const compiled = fixture.debugElement.nativeElement;
-    const input: HTMLInputElement = compiled.querySelector('input');
-
-
-    input.value = text;
-    input.dispatchEvent(createCustomEvent(document, 'input', ''));
-
-    fixture.detectChanges();
-
-    expect(component.name).toBe(text);
-  });
-
-  it('should display an alert when the button is clicked', () => {
-    const compiled = fixture.debugElement.nativeElement;
-    const button: HTMLButtonElement = compiled.querySelector('button');
-
-    button.click();
-
-    expect(window.alert).toHaveBeenCalledWith('Hello, Angular!');
-  });
-});
--- a/aio/src/app/custom-elements/getting-started/event-binding/event-binding.component.ts
+++ b/aio/src/app/custom-elements/getting-started/event-binding/event-binding.component.ts
@ -1,30 +0,0 @@
-import { Component } from '@angular/core';
-
-@Component({
-  selector: 'aio-gs-event-binding',
-  template: `
-    <aio-gs-container>
-      <ng-container class="template">&lt;button (click)="greet(name)"&gt;
-  Greet
-&lt;/button&gt;</ng-container>
-
-      <ng-container class="data">
-        name = '<input #input (input)="name = input.value" [value]="name">';
-      </ng-container>
-
-      <ng-container class="result">
-        <button (click)="greet(name)">
-          Greet
-        </button>
-      </ng-container>
-    </aio-gs-container>
-  `,
-  preserveWhitespaces: true
-})
-export class EventBindingComponent {
-  name = 'Angular';
-
-  greet(name: string) {
-    window.alert(`Hello, ${name}!`);
-  }
-}
--- a/aio/src/app/custom-elements/getting-started/event-binding/event-binding.module.ts
+++ b/aio/src/app/custom-elements/getting-started/event-binding/event-binding.module.ts
@ -1,15 +0,0 @@
-import { NgModule, Type } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { WithCustomElementComponent } from '../../element-registry';
-import { EventBindingComponent } from './event-binding.component';
-import { ContainerModule } from '../container/container.module';
-
-@NgModule({
-  imports: [ CommonModule, ContainerModule ],
-  declarations: [ EventBindingComponent ],
-  exports: [ EventBindingComponent ],
-  entryComponents: [ EventBindingComponent ]
-})
-export class EventBindingModule implements WithCustomElementComponent {
-  customElementComponent: Type<any> = EventBindingComponent;
-}
--- a/aio/src/app/custom-elements/getting-started/interpolation/interpolation.component.spec.ts
+++ b/aio/src/app/custom-elements/getting-started/interpolation/interpolation.component.spec.ts
@ -1,41 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { InterpolationComponent } from './interpolation.component';
-import { ContainerModule } from '../container/container.module';
-import { createCustomEvent } from '../../../../testing/dom-utils';
-
-describe('Getting Started Interpolation Component', () => {
-  let component: InterpolationComponent;
-  let fixture: ComponentFixture<InterpolationComponent>;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      imports: [ ContainerModule ],
-      declarations: [ InterpolationComponent ]
-    });
-
-    fixture = TestBed.createComponent(InterpolationComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should update the siteName property on input change', () => {
-    const text = 'Hello Angular';
-    const compiled = fixture.debugElement.nativeElement;
-    const input: HTMLInputElement = compiled.querySelector('input');
-
-    input.value = text;
-    input.dispatchEvent(createCustomEvent(document, 'input', ''));
-
-    fixture.detectChanges();
-
-    expect(component.siteName).toBe(text);
-  });
-
-  it('should display the siteName', () => {
-    const compiled = fixture.debugElement.nativeElement;
-    const header: HTMLHeadingElement = compiled.querySelector('h1');
-
-    expect(header.textContent).toContain('My Store');
-  });
-});
--- a/aio/src/app/custom-elements/getting-started/interpolation/interpolation.component.ts
+++ b/aio/src/app/custom-elements/getting-started/interpolation/interpolation.component.ts
@ -1,20 +0,0 @@
-import { Component } from '@angular/core';
-
-
-@Component({
-  selector: 'aio-gs-interpolation',
-  template: `
-    <aio-gs-container>
-      <ng-container class="template">&lt;h1&gt;Welcome to {{'{'+'{'}}siteName{{'}'+'}'}}&lt;h1&gt;</ng-container>
-
-      <ng-container class="data">
-        siteName = '<input #input (input)="siteName = input.value" [value]="siteName">';
-      </ng-container>
-
-      <ng-container class="result"><h1>Welcome to {{ siteName }}</h1></ng-container>
-    </aio-gs-container>
-  `
-})
-export class InterpolationComponent {
-  siteName = 'My Store';
-}
--- a/aio/src/app/custom-elements/getting-started/interpolation/interpolation.module.ts
+++ b/aio/src/app/custom-elements/getting-started/interpolation/interpolation.module.ts
@ -1,15 +0,0 @@
-import { NgModule, Type } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { WithCustomElementComponent } from '../../element-registry';
-import { InterpolationComponent } from './interpolation.component';
-import { ContainerModule } from '../container/container.module';
-
-@NgModule({
-  imports: [ CommonModule, ContainerModule ],
-  declarations: [ InterpolationComponent ],
-  exports: [ InterpolationComponent ],
-  entryComponents: [ InterpolationComponent ]
-})
-export class InterpolationModule implements WithCustomElementComponent {
-  customElementComponent: Type<any> = InterpolationComponent;
-}
--- a/aio/src/app/custom-elements/getting-started/ng-for/ng-for.component.spec.ts
+++ b/aio/src/app/custom-elements/getting-started/ng-for/ng-for.component.spec.ts
@ -1,42 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { NgForComponent } from './ng-for.component';
-import { ContainerModule } from '../container/container.module';
-import { ProductService } from '../product.service';
-
-describe('Getting Started NgFor Component', () => {
-  let component: NgForComponent;
-  let fixture: ComponentFixture<NgForComponent>;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      imports: [ ContainerModule ],
-      declarations: [ NgForComponent ],
-      providers: [ ProductService ]
-    });
-
-    fixture = TestBed.createComponent(NgForComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should display the products', () => {
-    const compiled = fixture.debugElement.nativeElement;
-    const spans = compiled.querySelectorAll('span');
-
-    expect(spans[0]!.textContent).toContain('Shoes');
-    expect(spans[1]!.textContent).toContain('Phones');
-  });
-
-  it('should display an error message if provided products JSON is invalid', () => {
-    fixture.detectChanges();
-
-    component.productsData$.next('bad');
-
-    fixture.detectChanges();
-
-    component.parseError$.subscribe(error => {
-      expect(error).toBeTruthy();
-    })
-  });
-});
--- a/aio/src/app/custom-elements/getting-started/ng-for/ng-for.component.ts
+++ b/aio/src/app/custom-elements/getting-started/ng-for/ng-for.component.ts
@ -1,46 +0,0 @@
-import { Component, OnInit, OnDestroy } from '@angular/core';
-import { Subscription } from 'rxjs';
-
-import { ProductService } from '../product.service';
-
-@Component({
-  selector: 'aio-gs-ng-for',
-  template: `
-    <aio-gs-container>
-      <ng-container class="template">&lt;span *ngFor="let product of products">
-  {{'{'+'{'}}product{{'}'+'}'}}
-&lt;/span&gt;</ng-container>
-
-      <ng-container class="data">
-        products = <input #input (input)="productsData$.next(input.value)" [value]="productsData$ | async">;
-        <div *ngIf="parseError$ | async" class="material-icons" matTooltip="The provided JSON is invalid">error_outline</div>
-      </ng-container>
-
-      <ng-container class="result">
-        <span *ngFor="let product of products$ | async">{{product}}</span>
-      </ng-container>
-    </aio-gs-container>
-  `,
-  styles: [`
-    span::after {
-      content: ' ';
-    }
-  `],
-  preserveWhitespaces: true
-})
-export class NgForComponent implements OnInit, OnDestroy {
-  productsData$ = this.productService.productsData$;
-  products$ = this.productService.products$;
-  parseError$ = this.productService.parseError$;
-  productsSub: Subscription;
-
-  constructor(private productService: ProductService) {}
-
-  ngOnInit() {
-    this.productsSub = this.productService.init().subscribe();
-  }
-
-  ngOnDestroy() {
-    this.productsSub.unsubscribe();
-  }
-}
--- a/aio/src/app/custom-elements/getting-started/ng-for/ng-for.module.ts
+++ b/aio/src/app/custom-elements/getting-started/ng-for/ng-for.module.ts
@ -1,18 +0,0 @@
-import { NgModule, Type } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { MatTooltipModule } from '@angular/material/tooltip';
-import { WithCustomElementComponent } from '../../element-registry';
-import { NgForComponent } from './ng-for.component';
-import { ContainerModule } from '../container/container.module';
-import { ProductService } from '../product.service';
-
-@NgModule({
-  imports: [ CommonModule, ContainerModule, MatTooltipModule ],
-  declarations: [ NgForComponent ],
-  exports: [ NgForComponent ],
-  entryComponents: [ NgForComponent ],
-  providers: [ ProductService ]
-})
-export class NgForModule implements WithCustomElementComponent {
-  customElementComponent: Type<any> = NgForComponent;
-}
--- a/aio/src/app/custom-elements/getting-started/ng-if/ng-if.component.spec.ts
+++ b/aio/src/app/custom-elements/getting-started/ng-if/ng-if.component.spec.ts
@ -1,51 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { NgIfComponent } from './ng-if.component';
-import { ContainerModule } from '../container/container.module';
-import { ProductService } from '../product.service';
-
-describe('Getting Started NgIf Component', () => {
-  let component: NgIfComponent;
-  let fixture: ComponentFixture<NgIfComponent>;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      imports: [ ContainerModule ],
-      declarations: [ NgIfComponent ],
-      providers: [ ProductService ]
-    });
-
-    fixture = TestBed.createComponent(NgIfComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should display the message if products are listed', () => {
-    const compiled = fixture.debugElement.nativeElement;
-    const paragraph = compiled.querySelector('p');
-
-    expect(paragraph.textContent).toContain('available');
-  });
-
-  it('should not display the message if products list is empty', () => {
-    component.products$.next([]);
-    fixture.detectChanges();
-
-    const compiled = fixture.debugElement.nativeElement;
-    const paragraph = compiled.querySelector('p');
-
-    expect(paragraph).toBeFalsy();
-  });
-
-  it('should display an error message if provided products JSON is invalid', () => {
-    fixture.detectChanges();
-
-    component.productsData$.next('bad');
-
-    fixture.detectChanges();
-
-    component.parseError$.subscribe(error => {
-      expect(error).toBeTruthy();
-    })
-  });
-});
--- a/aio/src/app/custom-elements/getting-started/ng-if/ng-if.component.ts
+++ b/aio/src/app/custom-elements/getting-started/ng-if/ng-if.component.ts
@ -1,43 +0,0 @@
-import { Component, OnInit, OnDestroy } from '@angular/core';
-import { Subscription } from 'rxjs';
-
-import { ProductService } from '../product.service';
-
-@Component({
-  selector: 'aio-gs-ng-if',
-  template: `
-    <aio-gs-container>
-      <ng-container class="template">&lt;p *ngIf="products.length > 0"&gt;
-  We still have products available.
-&lt;/p&gt;</ng-container>
-
-      <ng-container class="data">
-        products = <input #input (input)="productsData$.next(input.value)" [value]="productsData$ | async">;
-        <div *ngIf="parseError$ | async" class="material-icons" matTooltip="The provided JSON is invalid">error_outline</div>
-      </ng-container>
-
-      <ng-container class="result">
-        <p *ngIf="(products$ | async)?.length > 0">
-          We still have products available.
-        </p>
-      </ng-container>
-    </aio-gs-container>
-  `,
-  preserveWhitespaces: true
-})
-export class NgIfComponent implements OnInit, OnDestroy {
-  productsData$ = this.productService.productsData$;
-  products$ = this.productService.products$;
-  parseError$ = this.productService.parseError$;
-  productsSub: Subscription;
-
-  constructor(private productService: ProductService) {}
-
-  ngOnInit() {
-    this.productsSub = this.productService.init().subscribe();
-  }
-
-  ngOnDestroy() {
-    this.productsSub.unsubscribe();
-  }
-}
--- a/aio/src/app/custom-elements/getting-started/ng-if/ng-if.module.ts
+++ b/aio/src/app/custom-elements/getting-started/ng-if/ng-if.module.ts
@ -1,18 +0,0 @@
-import { NgModule, Type } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { MatTooltipModule } from '@angular/material/tooltip';
-import { WithCustomElementComponent } from '../../element-registry';
-import { NgIfComponent } from './ng-if.component';
-import { ContainerModule } from '../container/container.module';
-import { ProductService } from '../product.service';
-
-@NgModule({
-  imports: [ CommonModule, ContainerModule, MatTooltipModule ],
-  declarations: [ NgIfComponent ],
-  exports: [ NgIfComponent ],
-  entryComponents: [ NgIfComponent ],
-  providers: [ ProductService ]
-})
-export class NgIfModule implements WithCustomElementComponent {
-  customElementComponent: Type<any> = NgIfComponent;
-}
--- a/aio/src/app/custom-elements/getting-started/product.service.ts
+++ b/aio/src/app/custom-elements/getting-started/product.service.ts
@ -1,33 +0,0 @@
-import { Injectable } from '@angular/core';
-import { BehaviorSubject, Subject } from 'rxjs';
-import { tap, debounceTime } from 'rxjs/operators';
-
-export const PRODUCTS = ['Shoes', 'Phones'];
-
-@Injectable()
-export class ProductService  {
-  productsData$ = new BehaviorSubject(JSON.stringify(PRODUCTS));
-  products$ = new BehaviorSubject<string[]>(PRODUCTS);
-  parseError$ = new Subject<boolean>();
-
-  init() {
-    return this.productsData$.pipe(
-      debounceTime(250),
-      tap(data => {
-        let parsed;
-
-        try {
-          parsed = JSON.parse(data);
-        } catch (e) {
-          parsed = null;
-        }
-
-        if (parsed && Array.isArray(parsed)) {
-          this.products$.next(parsed);
-          this.parseError$.next(false);
-        } else {
-          this.parseError$.next(true);
-        }
-      }));
-  }
-}
--- a/aio/src/app/custom-elements/getting-started/property-binding/property-binding.component.spec.ts
+++ b/aio/src/app/custom-elements/getting-started/property-binding/property-binding.component.spec.ts
@ -1,46 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { PropertyBindingComponent } from './property-binding.component';
-import { ContainerModule } from '../container/container.module';
-import { createCustomEvent } from '../../../../testing/dom-utils';
-
-describe('Getting Started Property Binding Component', () => {
-  let component: PropertyBindingComponent;
-  let fixture: ComponentFixture<PropertyBindingComponent>;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({
-      imports: [ ContainerModule ],
-      declarations: [ PropertyBindingComponent ]
-    });
-
-    fixture = TestBed.createComponent(PropertyBindingComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-
-  it('should update the image title on input change', () => {
-    const text = 'Hello Angular';
-    const compiled = fixture.debugElement.nativeElement;
-    const input: HTMLInputElement = compiled.querySelector('input');
-
-    input.value = text;
-    input.dispatchEvent(createCustomEvent(document, 'input', ''));
-
-    fixture.detectChanges();
-
-    expect(component.imageTitle).toBe(text);
-  });
-
-  it('should display the image title', () => {
-    const compiled = fixture.debugElement.nativeElement;
-    const image: HTMLImageElement = compiled.querySelector('img');
-
-    expect(image.getAttribute('title')).toContain('Angular Logo');
-  });
-
-});
--- a/aio/src/app/custom-elements/getting-started/property-binding/property-binding.component.ts
+++ b/aio/src/app/custom-elements/getting-started/property-binding/property-binding.component.ts
@ -1,21 +0,0 @@
-import { Component } from '@angular/core';
-
-@Component({
-  selector: 'aio-gs-property-binding',
-  template: `
-    <aio-gs-container>
-      <ng-container class="template">&lt;img ... [title]="imageTitle"&gt;</ng-container>
-
-      <ng-container class="data">
-        imageTitle = '<input #input (input)="imageTitle = input.value" [value]="imageTitle">';
-      </ng-container>
-
-      <ng-container class="result">
-        <img src="/assets/images/logos/angular/angular.svg" width="37" height="40" [title]="imageTitle">
-      </ng-container>
-    </aio-gs-container>
-  `
-})
-export class PropertyBindingComponent {
-  imageTitle = 'Angular Logo';
-}
--- a/aio/src/app/custom-elements/getting-started/property-binding/property-binding.module.ts
+++ b/aio/src/app/custom-elements/getting-started/property-binding/property-binding.module.ts
@ -1,15 +0,0 @@
-import { NgModule, Type } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { WithCustomElementComponent } from '../../element-registry';
-import { PropertyBindingComponent } from './property-binding.component';
-import { ContainerModule } from '../container/container.module';
-
-@NgModule({
-  imports: [ CommonModule, ContainerModule ],
-  declarations: [ PropertyBindingComponent ],
-  exports: [ PropertyBindingComponent ],
-  entryComponents: [ PropertyBindingComponent ]
-})
-export class PropertyBindingModule implements WithCustomElementComponent {
-  customElementComponent: Type<any> = PropertyBindingComponent;
-}
--- a/aio/src/styles/0-base/_typography.scss
+++ b/aio/src/styles/0-base/_typography.scss
@ -123,7 +123,7 @@ td {
  padding: 8px 30px;
  letter-spacing: 0.30px;

-  p:first-child, p:last-child {
+  p {
    margin: 0;
  }
 }
--- a/aio/src/styles/1-layouts/_api-pages.scss
+++ b/aio/src/styles/1-layouts/_api-pages.scss
@ -0,0 +1,46 @@
+.api-body {
+
+    max-width: 1200px;
+
+    table {
+        margin: 12px 0 24px;
+
+        th {
+            text-transform: none;
+            font-size: 16px;
+            font-weight: bold;
+        }
+
+        tr {
+            border-bottom: 1px solid $lightgray;
+        }
+
+        td {
+            vertical-align: middle;
+        }
+
+        hr {
+            margin: 16px 0;
+        }
+
+        tr:last-child {
+            border-bottom: none;
+        }
+
+        &.item-table {
+            td {
+                padding: 32px;
+            }
+        }
+
+        &.list-table {
+            td {
+                padding: 16px 24px;
+            }
+        }
+
+        .short-description {
+            margin-left: 0;
+        }
+    }
+}
--- a/aio/src/styles/1-layouts/_layouts-dir.scss
+++ b/aio/src/styles/1-layouts/_layouts-dir.scss
@ -2,6 +2,7 @@
   LAYOUT STYLES
   ============================== */

+@import 'api-pages';
@import 'content-layout';
@import 'doc-viewer';
@import 'footer';
--- a/aio/src/styles/2-modules/_api-pages.scss
+++ b/aio/src/styles/2-modules/_api-pages.scss
@ -1,127 +1,3 @@
-.api-body {
-  max-width: 1200px;
-
-  table {
-      margin: 12px 0 24px;
-
-      th {
-          text-transform: none;
-          font-size: 16px;
-          font-weight: bold;
-      }
-
-      tr {
-          border-bottom: 1px solid $lightgray;
-      }
-
-      td {
-          vertical-align: middle;
-      }
-
-      // This is overriding a style here:
-      // https://github.com/angular/angular/blob/95993e1/aio/src/styles/2-modules/_table.scss#L58-L62
-      tbody > tr > td tr td:first-child {
-        @media screen and (max-width: 480px) {
-          background-color: inherit;
-        }
-      }
-
-      hr {
-          margin: 16px 0;
-      }
-
-      tr:last-child {
-          border-bottom: none;
-      }
-
-      &.item-table {
-          td {
-              padding: 32px;
-          }
-      }
-
-      &.list-table {
-          td {
-              padding: 16px 24px;
-          }
-      }
-
-      .short-description {
-          margin-left: 0;
-      }
-
-      &.parameters-table {
-        margin-top: 0;
-        font-size: 14px;
-        box-shadow: none;
-
-        tr {
-          @media screen and (max-width: 480px) {
-            display: flex;
-            flex-direction: column;
-          }
-
-          td:first-child {
-            font-weight: 600;
-            padding-left: 16px;
-            width: 20%;
-          }
-        }
-
-        td {
-          padding: 8px 8px 8px 0;
-          border: 0;
-          vertical-align: top;
-        }
-      }
-  }
-
-  .class-overview {
-    position: relative;
-
-    code-example {
-        clear: left;
-    }
-  }
-
-  .short-description {
-    margin: 6px 0 0 10px;
-  }
-
-  .properties-table {
-    font-size: 14px;
-
-    thead th {
-      &:nth-child(1) {
-        width: 20%;
-      }
-      &:nth-child(2) {
-        width: 20%;
-      }
-    }
-  }
-}
-
-.breadcrumb-container {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-}
-
-.api-header {
-  display: flex;
-  align-items: center;
-
-  @media screen and (max-width: 600px) {
-    flex-direction: column;
-    align-items: flex-start;
-  }
-
-  h1 {
-    margin-top: -4px;
-  }
-}
-
 .github-links {
  float: right;
  .material-icons {
@ -134,6 +10,16 @@
  }
 }

+.api-header {
+  display: flex;
+  align-items: center;
+
+  @media screen and (max-width: 600px) {
+    flex-direction: column;
+    align-items: flex-start;
+  }
+}
+
 .api-body {

  .class-overview {
@ -179,10 +65,10 @@
    }
  }

-
  .api-heading {
    padding: 5px 0;
-    font-size: 14px;
+    font-size: 16px;
+    font-weight: bold;
  }

  .parameters-table {
@ -194,71 +80,21 @@
  }

  details.overloads {
-    box-shadow: none;
-
-    .icon-action-header {
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-      justify-content: space-between;
-
-      a {
-        display: flex;
-      }
-    }
-
-    .detail-contents {
-      padding: 0;
-      border: 1px solid $lightgray;
-      border-radius: 2px;
-      box-shadow: none;
-
-      > *:not(hr) {
-        margin: 16px 24px;
-      }
-    }
+    margin-left: -8px;

    summary {
      height: inherit;
-      padding: 0;
-
+      padding: 8px 12px;
      h4 {
        margin: 0;
        clear: left;
      }
-
-      .show-all {
-        display: initial;
-      }
-      .collapse-all {
-        display: none;
-      }
-    }
-
-    &[open] > summary {
-      .show-all {
-        display: none;
-      }
-      .collapse-all {
-        display: initial;
-      }
    }
  }

-  details.overload {
-    box-shadow: none;
-    margin: 0;
-  }
-
-
  .from-constructor, .read-only-property, .write-only-property {
-    font-size: 12px;
-    font-weight: 600;
-    letter-spacing: 0.5px;
    font-style: italic;
-    background-color: $lightgray;
-    border-radius: 4px;
-    padding: 4px 6px;
+    color: $blue;
  }

  .ngmodule-list {
@ -284,6 +120,10 @@
      }
    }
  }
+
+  .member-name {
+    font-weight: bold;
+  }
 }

 .deprecated-api-item {
--- a/aio/src/styles/2-modules/_cli-pages.scss
+++ b/aio/src/styles/2-modules/_cli-pages.scss
@ -1,7 +1,5 @@
 .cli-name {
  font-weight: bold;
-
-  .kwd { color: initial }  /* override code format */
 }

 .cli-option-syntax {
--- a/aio/src/styles/2-modules/_details.scss
+++ b/aio/src/styles/2-modules/_details.scss
@ -25,7 +25,14 @@ summary {
    display: none; // Remove the built in details marker in webkit
  }

-  overflow: hidden;
+  &::before {
+    content: '\E5CE'; // See https://material.io/icons/#ic_expand_less
+    font-family: 'Material Icons';
+    font-size: 24px;
+    -webkit-font-smoothing: antialiased;
+    @include rotate(0deg); // We will rotate 180 degrees when details is open
+    float: right;
+  }
 }

 details {
@ -35,11 +42,7 @@ details {
    padding: 16px 24px;
  }

-  // Rotate the icon
-  summary i.material-icons.expand {
-    @include rotate(0deg);
-  }
-  &[open] > summary i.material-icons.expand {
-    @include rotate(180deg);
+  &[open] > summary::before {
+    @include rotate(180deg); // Rotate the icon
  }
 }
--- a/aio/src/styles/2-modules/_hr.scss
+++ b/aio/src/styles/2-modules/_hr.scss
@ -3,3 +3,12 @@ hr {
    background: $lightgray;
    height: 1px;
 }
+
+.hr-margin {
+    display: block;
+    height: 1px;
+    border: 0;
+    margin-top: 16px;
+    margin-bottom: 16px;
+    padding: 0;
+}
--- a/aio/src/styles/2-modules/_modules-dir.scss
+++ b/aio/src/styles/2-modules/_modules-dir.scss
@ -3,8 +3,8 @@
   ============================== */

   @import 'alert';
-   @import 'api-list';
   @import 'api-pages';
+   @import 'api-list';
   @import 'buttons';
   @import 'callout';
   @import 'card';
--- a/aio/src/test.ts
+++ b/aio/src/test.ts
@ -1,5 +1,9 @@
 // This file is required by karma.conf.js and loads recursively all the .spec and framework files

+// Reflect.metadata polyfill is only needed in the JIT mode which we use only for unit tests
+import 'core-js/es6/reflect';
+import 'core-js/es7/reflect';
+
 import 'zone.js/dist/zone-testing';
 import { getTestBed } from '@angular/core/testing';
 import {
--- a/aio/src/testing/dom-utils.ts
+++ b/aio/src/testing/dom-utils.ts
@ -1,16 +0,0 @@
-/**
- * Create a `CustomEvent` (even on browsers where `CustomEvent` is not a constructor).
- */
-export function createCustomEvent(doc: Document, name: string, detail: any): CustomEvent {
-  const bubbles = false;
-  const cancelable = false;
-
-  // On IE9-11, `CustomEvent` is not a constructor.
-  if (typeof CustomEvent !== 'function') {
-    const event = doc.createEvent('CustomEvent');
-    event.initCustomEvent(name, bubbles, cancelable, detail);
-    return event;
-  }
-
-  return new CustomEvent(name, {bubbles, cancelable, detail});
-}
--- a/aio/tools/examples/shared/package.json
+++ b/aio/tools/examples/shared/package.json
@ -12,7 +12,7 @@
  },
  "engines": {
    "node": ">=10.9.0 <11.0.0",
-    "yarn": ">=1.10.1 <1.13.0"
+    "yarn": ">=1.9.2 <2.0.0"
  },
  "keywords": [],
  "author": "",
@ -57,7 +57,7 @@
    "@types/jasminewd2": "^2.0.4",
    "@types/jquery": "^3.3.4",
    "@types/node": "~8.9.4",
-    "canonical-path": "1.0.0",
+    "canonical-path": "0.0.2",
    "concurrently": "^3.0.0",
    "http-server": "^0.9.0",
    "jasmine-core": "~2.99.1",
--- a/aio/tools/examples/shared/yarn.lock
+++ b/aio/tools/examples/shared/yarn.lock
@ -1450,11 +1450,6 @@ canonical-path@0.0.2:
  version "0.0.2"
  resolved "https://registry.yarnpkg.com/canonical-path/-/canonical-path-0.0.2.tgz#e31eb937a8c93ee2a01df1839794721902874574"

-canonical-path@1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/canonical-path/-/canonical-path-1.0.0.tgz#fcb470c23958def85081856be7a86e904f180d1d"
-  integrity sha512-feylzsbDxi1gPZ1IjystzIQZagYYLvfKrSuygUCgf7z6x790VEzze5QEkdSV1U58RA7Hi0+v6fv4K54atOzATg==
-
 caseless@~0.12.0:
  version "0.12.0"
  resolved "https://registry.yarnpkg.com/caseless/-/caseless-0.12.0.tgz#1b681c21ff84033c826543090689420d187151dc"
--- a/aio/tools/transforms/templates/api/base.template.html
+++ b/aio/tools/transforms/templates/api/base.template.html
@ -2,21 +2,19 @@
 {% set comma = joiner(',') %}
 {% set breadcrumbDelimiter = joiner('&gt;') %}
 <article>
-  <div class="breadcrumb-container">
-    <div class="breadcrumb">
-      <script type="application/ld+json">
-        {
-          "@context": "http://schema.org",
-          "@type": "BreadcrumbList",
-          "itemListElement": [
-            {%- for crumb in doc.breadCrumbs %}{$ comma() $}
-            { "@type": "ListItem", "position": {$ loop.index $}, "item": { "@id": "https://angular.io/{$ crumb.path $}", "name": "{$ crumb.text $}" } }{% endfor %}
-          ]
-        }
-      </script>
-      {% for crumb in doc.breadCrumbs %}{% if not loop.last %} {$ breadcrumbDelimiter() $} {% if crumb.path %}<a href="{$ crumb.path $}">{$ crumb.text $}</a>{% else %}{$ crumb.text $}{% endif %}{% endif %}{% endfor %}
-    </div>
-    {$ github.githubLinks(doc, versionInfo) $}
+  {$ github.githubLinks(doc, versionInfo) $}
+  <div class="breadcrumb">
+    <script type="application/ld+json">
+      {
+        "@context": "http://schema.org",
+        "@type": "BreadcrumbList",
+        "itemListElement": [
+          {%- for crumb in doc.breadCrumbs %}{$ comma() $}
+          { "@type": "ListItem", "position": {$ loop.index $}, "item": { "@id": "https://angular.io/{$ crumb.path $}", "name": "{$ crumb.text $}" } }{% endfor %}
+        ]
+      }
+    </script>
+    {% for crumb in doc.breadCrumbs %}{% if not loop.last %} {$ breadcrumbDelimiter() $} {% if crumb.path %}<a href="{$ crumb.path $}">{$ crumb.text $}</a>{% else %}{$ crumb.text $}{% endif %}{% endif %}{% endfor %}
  </div>
  {% block header %}
  <header class="api-header">
--- a/aio/tools/transforms/templates/api/lib/memberHelpers.html
+++ b/aio/tools/transforms/templates/api/lib/memberHelpers.html
@ -40,41 +40,40 @@
 {%- endmacro -%}

 {%- macro renderOverloadInfo(overload, cssClass, method) -%}
-<div class="overload-info">
-  {% if overload.shortDescription and (overload.shortDescription != method.shortDescription) %}
-  <div class="short-description">
-    {$ overload.shortDescription | marked $}
-  </div>{% endif %}

-  <code-example language="ts" hideCopy="true" linenums="false" class="no-box api-heading">{$ renderMemberSyntax(overload) $}</code-example>
+{% if overload.shortDescription and (overload.shortDescription != method.shortDescription) %}
+<div class="short-description">
+  {$ overload.shortDescription | marked $}
+</div>{% endif %}

-  {% if overload.deprecated !== undefined %}
-  <div class="deprecated">
-    {$ ('**Deprecated** ' + overload.deprecated) | marked $}
-  </div>{% endif %}
+<code-example language="ts" hideCopy="true" linenums="false" class="no-box api-heading">{$ renderMemberSyntax(overload) $}</code-example>

-  <h6 class="no-anchor">Parameters</h6>
-  {$ params.renderParameters(overload.parameterDocs, cssClass + '-parameters', cssClass + '-parameter', true) $}
+{% if overload.deprecated !== undefined %}
+<div class="deprecated">
+  {$ ('**Deprecated** ' + overload.deprecated) | marked $}
+</div>{% endif %}

-  {% if overload.type or overload.returns.type %}
-  <h6 class="no-anchor">Returns</h6>
-  {% marked %}`{$ (overload.type or overload.returns.type) $}`{% if overload.returns %}: {$ overload.returns.description $}{% endif %}{% endmarked %}
-  {% endif %}
+<h4 class="no-anchor">Parameters</h4>
+{$ params.renderParameters(overload.parameterDocs, cssClass + '-parameters', cssClass + '-parameter') $}
+
+{% if overload.type or overload.returns.type %}
+<h4 class="no-anchor">Returns</h4>
+{% marked %}`{$ (overload.type or overload.returns.type) $}`{% if overload.returns %}: {$ overload.returns.description $}{% endif %}{% endmarked %}
+{% endif %}


-  {% if overload.throws.length %}
-  <h6 class="no-anchor">Throws</h6>
-  {% for error in overload.throws %}
-  {% marked %}`{$ (error.typeList or 'Error') $}` {$ error.description $}{% endmarked %}
-  {% endfor %}
-  {% endif %}
+{% if overload.throws.length %}
+<h4 class="no-anchor">Throws</h4>
+{% for error in overload.throws %}
+{% marked %}`{$ (error.typeList or 'Error') $}` {$ error.description $}{% endmarked %}
+{% endfor %}
+{% endif %}

-  {% if overload.description and (overload.description != method.description) -%}
-  <div class="description">
-    {$ overload.description | marked $}
-  </div>
-  {%- endif %}
+{% if overload.description and (overload.description != method.description) -%}
+<div class="description">
+  {$ overload.description | marked $}
 </div>
+{%- endif %}
 {%- endmacro -%}

 {%- macro renderMethodDetail(versionInfo, method, cssClass) -%}
@ -82,13 +81,13 @@
 <table class="is-full-width method-table {$ cssClass $}">
  {% if method.name !== 'constructor' %}<thead><tr><th>
    <div class="with-github-links">
-    <h3>
-      {% if method.isCallMember %}<i>call signature</i>
-      {% elseif method.isNewMember %}<i>construct signature</i>
-      {% else %}{$ method.name $}()
-      {% endif %}
-    </h3>
-    {$ github.githubLinks(method, versionInfo) $}
+      <h3>
+        {% if method.isCallMember %}<i>call signature</i>
+        {% elseif method.isNewMember %}<i>construct signature</i>
+        {% else %}{$ method.name $}()
+        {% endif %}
+      </h3>
+      {$ github.githubLinks(method, versionInfo) $}
    </div>
  </th></tr></thead>{% endif %}
  <tbody>
@ -122,26 +121,16 @@
    <tr>
      <td>
        <details class="overloads">
-          <summary>
-            <div class="icon-action-header">
-                <h4 class="no-anchor">{$ method.overloads.length $} overloads...</h4>
-                <a>
-                  <span class="show-all">Show All</span>
-                  <span class="collapse-all">Hide All</span>
-                  <i class="material-icons expand">expand_more</i>
-                </a>
-              </div>
-          </summary>
+          <summary><h4 class="no-anchor">{$ method.overloads.length $} overloads...</h4></summary>
          <div class="detail-contents">
-            {% if method.isAbstract %}
-              {$ renderOverloadInfo(method, cssClass + '-overload', method) $}
-              <hr class="hr-margin fullwidth">
-            {% endif %}
-            {% for overload in method.overloads %}
-              <h5 class="no-anchor">Overload #{$ loop.index $}</h5>
-              {$ renderOverloadInfo(overload, cssClass + '-overload', method) $}
-              {% if not loop.last %}<hr class="hr-margin">{% endif %}
-            {% endfor %}
+                {% if method.isAbstract %}
+                  {$ renderOverloadInfo(method, cssClass + '-overload', method) $}
+                  <hr class="hr-margin fullwidth">
+                {% endif %}
+                {% for overload in method.overloads %}
+                {$ renderOverloadInfo(overload, cssClass + '-overload', method) $}
+                {% if not loop.last %}<hr class="hr-margin fullwidth">{% endif %}
+              {% endfor %}
          </div>
        </details>
      </td>
@ -151,7 +140,7 @@
  {% if method.description -%}
    <tr>
      <td class="description">
-        {$ method.description | marked({ h3: 'h5' }) $}
+        {$ method.description | marked({ h3: 'h4' }) $}
      </td>
    </tr>
  {%- endif %}
@ -159,8 +148,7 @@
  {% if method.usageNotes -%}
    <tr>
      <td class="usage-notes">
-        <h4 id="{$ method.anchor $}-usage-notes">Usage Notes</h4>
-        {$ method.usageNotes | marked({ h3: 'h5' }) $}
+        {$ method.usageNotes | marked({ h3: 'h4' }) $}
      </td>
    </tr>
  {%- endif %}
--- a/aio/tools/transforms/templates/api/lib/paramList.html
+++ b/aio/tools/transforms/templates/api/lib/paramList.html
@ -17,14 +17,12 @@
  <tbody>
  {% for parameter in parameters %}
    <tr class="{$ parameterClass $}">
-      <td class="param-name">
-        <a id="{$ parameter.anchor $}"></a>
-        <code>{$ parameter.name $}</code>
-      </td>
-      {% if showType %}<td class="param-type"><code>{% if r/^\{/.test(parameter.type) and r/\}$/.test(parameter.type) and parameter.type.length > 20 %}object{% else %}{$ parameter.type $}{% endif %}</code></td>{% endif %}
+      <td class="param-name"><a id="{$ parameter.anchor $}"></a>{$ parameter.name $}</td>
+      {% if showType %}<td class="param-type"><code>{$ parameter.type $}</code></td>{% endif %}
      <td class="param-description">
      {% marked %}
      {% if (parameter.shortDescription | trim) or (parameter.description | trim) %}{$ parameter.shortDescription + '\n\n' + parameter.description $}
+      {% elseif not showType and parameter.type %}<p>Type: <code>{$ parameter.type $}</code>.</p>
      {% endif %}

      {% if parameter.isOptional or parameter.defaultValue !== undefined %}Optional. Default is `{$ parameter.defaultValue === undefined and 'undefined' or parameter.defaultValue $}`.{% endif %}
@ -36,4 +34,4 @@
 {%- else -%}
 <p>There are no parameters.</p>
 {%- endif -%}
-{%- endmacro -%}
+{%- endmacro -%}
--- a/aio/yarn.lock
+++ b/aio/yarn.lock
--- a/docs/BAZEL.md
+++ b/docs/BAZEL.md
@ -63,7 +63,7 @@ See also: [`//.bazelrc`](https://github.com/angular/angular/blob/master/.bazelrc

 - `--config=debug`: build and launch in debug mode (see [debugging](#debugging) instructions below)
 - `--test_arg=--node_options=--inspect=9228`: change the inspector port.
- `--define=compile=<option>` Controls if ivy or legacy mode is enabled. This switches which compiler is used (ngc, ngtsc, or a tsc pass-through mode).
+- `--define=compile=<option>` Controls if ivy or legacy mode is enabled. This is done by generating the [`src/ivy_switch.ts`](https://github.com/angular/angular/blob/master/packages/core/src/ivy_switch.ts) file from [`ivy_switch_legacy.ts`](https://github.com/angular/angular/blob/master/packages/core/src/ivy_switch_legacy.ts) (default), [`ivy_switch_jit.ts`](https://github.com/angular/angular/blob/master/packages/core/src/ivy_switch_jit.ts), or [`ivy_switch_local.ts`](https://github.com/angular/angular/blob/master/packages/core/src/ivy_switch_local.ts).
    - `legacy`: (default behavior) compile against View Engine, e.g. `--define=compile=legacy`
    - `jit`: Compile in ivy JIT mode, e.g. `--define=compile=jit`
    - `aot`: Compile in ivy AOT move, e.g. `--define=compile=aot`
--- a/docs/DEVELOPER.md
+++ b/docs/DEVELOPER.md
@ -114,22 +114,23 @@ All the tests are executed on our Continuous Integration infrastructure and a PR

 ## <a name="clang-format"></a> Formatting your source code

-Angular uses [clang-format](http://clang.llvm.org/docs/ClangFormat.html) to format the source code.
-If the source code is not properly formatted, the CI will fail and the PR can not be merged.
+Angular uses [clang-format](http://clang.llvm.org/docs/ClangFormat.html) to format the source code. If the source code
+is not properly formatted, the CI will fail and the PR can not be merged.

 You can automatically format your code by running:
- `gulp format`: format all source code
- `gulp format:changed`: re-format only edited source code.

-A better way is to set up your IDE to format the changed file on each file save.
+``` shell
+$ gulp format
+```
+
+There is a handy [clang-format extension](https://marketplace.visualstudio.com/items?itemName=xaver.clang-format)
+for Visual Studio Code. Use the following settings to format your code when you save a file:

-### VS Code
-1. Install [Clang-Format](https://marketplace.visualstudio.com/items?itemName=xaver.clang-format) extension for VS Code. 
-2. Open `settings.json` in your workspace and add these lines:
 ```json
-  "files.autoSave": "onFocusChange",
-  "editor.formatOnSave": true,
-  "clang-format.executable": "PATH_TO_YOUR_WORKSPACE/angular/node_modules/.bin/clang-format",
+{
+    "editor.formatOnSave": true,
+    "clang-format.executable": "${workspaceRoot}/node_modules/.bin/clang-format"
+}
 ```

 ## Linting/verifying your source code
@ -166,33 +167,3 @@ $ ./scripts/publish/publish-build-artifacts.sh [github username]

 The script will publish the build snapshot to a branch with the same name as your current branch,
 and create it if it doesn't exist.
-
-## Bazel support
-### VS Code
-
-1. Install [Bazel](https://marketplace.visualstudio.com/items?itemName=DevonDCarew.bazel-code) extension for VS Code.
-2. Open `settings.json` in your workspace and add these lines:
-```json
-  "files.associations": {
-    "*.bazel": "bazel"
-  },
-```
-
-## General IDE settings
-### VS Code
-
-1. Open `settings.json` in your workspace and add these lines:
-```json
-  "editor.tabSize": 2,
-  "files.exclude": {
-    "bazel-out": true,
-    ".idea": true,
-    ".bowerrc": true,
-    ".circleci": true,
-    ".github": true,
-    "dist/**": true,
-    "node_modules/**": true,
-    ".rpt2_cache": true,
-    ".vscode": true
-  },
-```
--- a/integration/README.md
+++ b/integration/README.md
@ -10,11 +10,10 @@ To test Angular CLI applications, we use the integration test `cli-hello-world`.
 When a significant change is released in the CLI, the application should be updated with `ng update`:

 ```bash
-$ cd integration/cli-hello-world
-$ yarn install
-$ yarn ng update @angular/cli @angular-devkit/build-angular
-# yarn build
-# yarn test
+$ cd integration
+$ ng update
+# ng build
+# ng test
 # typescript version
 ```

@ -37,7 +36,7 @@ The API for each test is:

 This means that the test should be started by test script, like
 ```
-"scripts": {"test": "runProgramA && assertResultIsGood"}
+'scripts' { 'test': 'runProgramA && assertResultIsGood' }
 ```

 Note that the `package.json` file uses a special `file://../../dist` scheme
--- a/integration/_payload-limits.json
+++ b/integration/_payload-limits.json
@ -2,9 +2,9 @@
  "cli-hello-world": {
    "master": {
      "uncompressed": {
-        "runtime": 1497,
-        "main": 185238,
-        "polyfills": 59608
+        "runtime": 1110,
+        "main": 151765,
+        "polyfills": 59462
      }
    }
  },
@ -12,8 +12,32 @@
    "master": {
      "uncompressed": {
        "bundle": "TODO(i): temporarily increase the payload size limit from 105779 - this is due to a closure issue related to ESM reexports that still needs to be investigated",
-        "bundle": 177585
+        "bundle": 178101
+      }
+    }
+  },
+  "hello_world__render3__closure": {
+    "master": {
+      "uncompressed": {
+        "bundle": 8153
+      }
+    }
+  },
+  "hello_world__render3__rollup": {
+    "master": {
+      "uncompressed": {
+        "bundle": 10129
+      }
+    }
+  },
+  "hello_world__render3__cli": {
+    "master": {
+      "uncompressed": {
+        "inline": 1447,
+        "main": 40513,
+        "polyfills": 60105
      }
    }
  }
 }
+
--- a/integration/bazel/WORKSPACE
+++ b/integration/bazel/WORKSPACE
@ -36,7 +36,7 @@ load("@build_bazel_rules_nodejs//:defs.bzl", "check_bazel_version", "node_reposi
 check_bazel_version("0.17.0")
 node_repositories(
    node_version = "10.9.0",
-    yarn_version = "1.12.1",
+    yarn_version = "1.9.2",
 )

 yarn_install(
--- a/integration/bazel/src/package.json
+++ b/integration/bazel/src/package.json
@ -13,8 +13,8 @@
    "@angular/bazel": "file:../angular/dist/packages-dist/bazel",
    "@angular/compiler": "file:../angular/dist/packages-dist/compiler",
    "@angular/compiler-cli": "file:../angular/dist/packages-dist/compiler-cli",
-    "@bazel/karma": "0.21.0",
-    "@bazel/typescript": "0.21.0",
+    "@bazel/karma": "0.20.3",
+    "@bazel/typescript": "0.20.3",
    "@types/jasmine": "2.8.8",
    "@types/source-map": "0.5.1",
    "protractor": "5.1.2",
--- a/integration/cli-hello-world-ivy/.editorconfig
+++ b/integration/cli-hello-world-ivy/.editorconfig
@ -1,13 +0,0 @@
-# Editor configuration, see http://editorconfig.org
-root = true
-
-[*]
-charset = utf-8
-indent_style = space
-indent_size = 2
-insert_final_newline = true
-trim_trailing_whitespace = true
-
-[*.md]
-max_line_length = off
-trim_trailing_whitespace = false
--- a/integration/cli-hello-world-ivy/.gitignore
+++ b/integration/cli-hello-world-ivy/.gitignore
@ -1 +0,0 @@
-yarn.lock
--- a/integration/cli-hello-world-ivy/README.md
+++ b/integration/cli-hello-world-ivy/README.md
@ -1,27 +0,0 @@
-# CliHelloWorld
-
-This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 1.6.6.
-
-## Development server
-
-Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
-
-## Code scaffolding
-
-Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
-
-## Build
-
-Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `-prod` flag for a production build.
-
-## Running unit tests
-
-Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
-
-## Running end-to-end tests
-
-Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
-
-## Further help
-
-To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
--- a/integration/cli-hello-world-ivy/angular.json
+++ b/integration/cli-hello-world-ivy/angular.json
@ -1,170 +0,0 @@
-{
-  "$schema": "./node_modules/@angular-devkit/core/src/workspace/workspace-schema.json",
-  "version": 1,
-  "cli": {
-    "packageManager": "yarn"
-  },
-  "newProjectRoot": "projects",
-  "projects": {
-    "cli-hello-world": {
-      "root": "",
-      "projectType": "application",
-      "architect": {
-        "build": {
-          "builder": "@angular-devkit/build-angular:browser",
-          "options": {
-            "outputPath": "dist",
-            "index": "src/index.html",
-            "main": "src/main.ts",
-            "polyfills": "src/polyfills.ts",
-            "tsConfig": "src/tsconfig.app.json",
-            "assets": [
-              {
-                "glob": "assets",
-                "input": "/src",
-                "output": "/"
-              },
-              {
-                "glob": "favicon.ico",
-                "input": "/src",
-                "output": "/"
-              }
-            ],
-            "styles": [
-              {
-                "input": "src/styles.css"
-              }
-            ],
-            "scripts": []
-          },
-          "configurations": {
-            "dev": {
-              "fileReplacements": [
-                {
-                  "from": "src/environments/environment.ts",
-                  "to": "dist/environments/environment.ts"
-                }
-              ]
-            },
-            "production": {
-              "optimization": true,
-              "outputHashing": "all",
-              "sourceMap": true,
-              "extractCss": true,
-              "namedChunks": false,
-              "aot": true,
-              "extractLicenses": true,
-              "vendorChunk": false,
-              "buildOptimizer": true,
-              "fileReplacements": [
-                {
-                  "src": "src/environments/environment.ts",
-                  "replaceWith": "src/environments/environment.prod.ts"
-                }
-              ]
-            }
-          }
-        },
-        "serve": {
-          "builder": "@angular-devkit/build-angular:dev-server",
-          "options": {
-            "browserTarget": "cli-hello-world:build"
-          },
-          "configurations": {
-            "dev": {
-              "browserTarget": "cli-hello-world:build:dev"
-            },
-            "production": {
-              "browserTarget": "cli-hello-world:build:production"
-            }
-          }
-        },
-        "extract-i18n": {
-          "builder": "@angular-devkit/build-angular:extract-i18n",
-          "options": {
-            "browserTarget": "cli-hello-world:build"
-          }
-        },
-        "test": {
-          "builder": "@angular-devkit/build-angular:karma",
-          "options": {
-            "main": "src/test.ts",
-            "polyfills": "src/polyfills.ts",
-            "karmaConfig": "./karma.conf.js",
-            "tsConfig": "src/tsconfig.spec.json",
-            "scripts": [],
-            "styles": [
-              {
-                "input": "src/styles.css"
-              }
-            ],
-            "assets": [
-              {
-                "glob": "assets",
-                "input": "/src",
-                "output": "/"
-              },
-              {
-                "glob": "favicon.ico",
-                "input": "/src",
-                "output": "/"
-              }
-            ]
-          }
-        },
-        "lint": {
-          "builder": "@angular-devkit/build-angular:tslint",
-          "options": {
-            "tsConfig": [
-              "src/tsconfig.app.json",
-              "src/tsconfig.spec.json"
-            ],
-            "exclude": [
-              "**/node_modules/**"
-            ]
-          }
-        }
-      }
-    },
-    "cli-hello-world-e2e": {
-      "root": "",
-      "projectType": "application",
-      "cli": {},
-      "schematics": {},
-      "architect": {
-        "e2e": {
-          "builder": "@angular-devkit/build-angular:protractor",
-          "options": {
-            "protractorConfig": "./protractor.conf.js",
-            "devServerTarget": "cli-hello-world:serve"
-          },
-          "configurations": {
-            "production": {
-              "devServerTarget": "cli-hello-world:serve:production"
-            }
-          }
-        },
-        "lint": {
-          "builder": "@angular-devkit/build-angular:tslint",
-          "options": {
-            "tsConfig": [
-              "e2e/tsconfig.e2e.json"
-            ],
-            "exclude": [
-              "**/node_modules/**"
-            ]
-          }
-        }
-      }
-    }
-  },
-  "schematics": {
-    "@schematics/angular:component": {
-      "prefix": "app",
-      "styleext": "css"
-    },
-    "@schematics/angular:directive": {
-      "prefix": "app"
-    }
-  }
-}
--- a/integration/cli-hello-world-ivy/e2e/app.e2e-spec.ts
+++ b/integration/cli-hello-world-ivy/e2e/app.e2e-spec.ts
@ -1,19 +0,0 @@
-import { AppPage } from './app.po';
-
-describe('cli-hello-world App', () => {
-  let page: AppPage;
-
-  beforeEach(() => {
-    page = new AppPage();
-  });
-
-  it('should display welcome message', () => {
-    page.navigateTo();
-    expect(page.getParagraphText()).toEqual('Welcome to app!');
-  });
-
-  it('the percent pipe should work', () => {
-    page.navigateTo();
-    expect(page.getPipeContent()).toEqual('100 % awesome');
-  })
-});
--- a/integration/cli-hello-world-ivy/e2e/app.po.ts
+++ b/integration/cli-hello-world-ivy/e2e/app.po.ts
@ -1,15 +0,0 @@
-import { browser, by, element } from 'protractor';
-
-export class AppPage {
-  navigateTo() {
-    return browser.get('/');
-  }
-
-  getParagraphText() {
-    return element(by.css('app-root h1')).getText();
-  }
-
-  getPipeContent() {
-    return element(by.css('app-root p')).getText();
-  }
-}
--- a/integration/cli-hello-world-ivy/e2e/tsconfig.e2e.json
+++ b/integration/cli-hello-world-ivy/e2e/tsconfig.e2e.json
@ -1,14 +0,0 @@
-{
-  "extends": "../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../out-tsc/e2e",
-    "baseUrl": "./",
-    "module": "commonjs",
-    "target": "es5",
-    "types": [
-      "jasmine",
-      "jasminewd2",
-      "node"
-    ]
-  }
-}
--- a/integration/cli-hello-world-ivy/karma.conf.js
+++ b/integration/cli-hello-world-ivy/karma.conf.js
@ -1,39 +0,0 @@
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
-    plugins: [
-      require('karma-jasmine'),
-      require('karma-chrome-launcher'),
-      require('karma-jasmine-html-reporter'),
-      require('karma-coverage-istanbul-reporter'),
-      require('@angular-devkit/build-angular/plugins/karma')
-    ],
-    client:{
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
-    },
-    coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, 'coverage'), reports: [ 'html', 'lcovonly' ],
-      fixWebpackSourcePaths: true
-    },
-    angularCli: {
-      environment: 'dev'
-    },
-    reporters: ['progress', 'kjhtml'],
-    port: 9876,
-    colors: true,
-    logLevel: config.LOG_INFO,
-    autoWatch: true,
-    browsers: ['CustomChrome'],
-    singleRun: false,
-    customLaunchers: {
-      CustomChrome: {
-        base: 'Chrome',
-        flags: ['--no-sandbox']
-      }
-    }
-  });
-};
--- a/integration/cli-hello-world-ivy/package.json
+++ b/integration/cli-hello-world-ivy/package.json
@ -1,50 +0,0 @@
-{
-  "name": "cli-hello-world",
-  "version": "0.0.0",
-  "license": "MIT",
-  "scripts": {
-    "build": "ng build --prod --progress false",
-    "e2e": "ng e2e",
-    "lint": "ng lint",
-    "ng": "ng",
-    "postinstall": "webdriver-manager update --gecko false --standalone false $CHROMEDRIVER_VERSION_ARG && yarn ivy-ngcc",
-    "start": "ng serve",
-    "test": "ng build --progress false"
-  },
-  "private": true,
-  "dependencies": {
-    "@angular/animations": "file:../../dist/packages-dist/animations",
-    "@angular/common": "file:../../dist/packages-dist/common",
-    "@angular/compiler": "file:../../dist/packages-dist/compiler",
-    "@angular/core": "file:../../dist/packages-dist/core",
-    "@angular/forms": "file:../../dist/packages-dist/forms",
-    "@angular/http": "file:../../dist/packages-dist/http",
-    "@angular/platform-browser": "file:../../dist/packages-dist/platform-browser",
-    "@angular/platform-browser-dynamic": "file:../../dist/packages-dist/platform-browser-dynamic",
-    "@angular/router": "file:../../dist/packages-dist/router",
-    "core-js": "file:../../node_modules/core-js",
-    "rxjs": "file:../../node_modules/rxjs",
-    "zone.js": "file:../../node_modules/zone.js"
-  },
-  "devDependencies": {
-    "@angular-devkit/build-angular": "~0.5.0",
-    "@angular/cli": "^6.0.0-rc.5",
-    "@angular/compiler-cli": "file:../../dist/packages-dist/compiler-cli",
-    "@angular/language-service": "file:../../dist/packages-dist/language-service",
-    "@types/jasmine": "~2.8.3",
-    "@types/jasminewd2": "~2.0.2",
-    "@types/node": "~6.0.60",
-    "codelyzer": "^4.3.0",
-    "jasmine-core": "~2.8.0",
-    "jasmine-spec-reporter": "~4.2.1",
-    "karma": "~2.0.0",
-    "karma-chrome-launcher": "~2.2.0",
-    "karma-coverage-istanbul-reporter": "^1.2.1",
-    "karma-jasmine": "~1.1.0",
-    "karma-jasmine-html-reporter": "^0.2.2",
-    "protractor": "file:../../node_modules/protractor",
-    "ts-node": "~4.1.0",
-    "tslint": "~5.9.1",
-    "typescript": "file:../../node_modules/typescript"
-  }
-}
--- a/integration/cli-hello-world-ivy/protractor.conf.js
+++ b/integration/cli-hello-world-ivy/protractor.conf.js
@ -1,32 +0,0 @@
-// Protractor configuration file, see link for more information
-// https://github.com/angular/protractor/blob/master/lib/config.ts
-
-const { SpecReporter } = require('jasmine-spec-reporter');
-
-exports.config = {
-  allScriptsTimeout: 11000,
-  specs: [
-    './e2e/**/*.e2e-spec.ts'
-  ],
-  capabilities: {
-    browserName: 'chrome',
-    chromeOptions: {
-      binary: process.env.CHROME_BIN,
-      args: ['--no-sandbox']
-    }
-  },
-  directConnect: true,
-  baseUrl: 'http://localhost:4200/',
-  framework: 'jasmine',
-  jasmineNodeOpts: {
-    showColors: true,
-    defaultTimeoutInterval: 30000,
-    print: function() {}
-  },
-  onPrepare() {
-    require('ts-node').register({
-      project: 'e2e/tsconfig.e2e.json'
-    });
-    jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
-  }
-};
--- a/integration/cli-hello-world-ivy/src/app/app.component.css
+++ b/integration/cli-hello-world-ivy/src/app/app.component.css
--- a/integration/cli-hello-world-ivy/src/app/app.component.html
+++ b/integration/cli-hello-world-ivy/src/app/app.component.html
@ -1,21 +0,0 @@
-<!--The content below is only a placeholder and can be replaced.-->
-<div style="text-align:center">
-  <h1>
-    Welcome to {{ title }}!
-  </h1>
-  <img width="300" alt="Angular Logo" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg==">
-</div>
-<p>{{ 100 | json }}% awesome</p>
-<h2>Here are some links to help you start: </h2>
-<ul>
-  <li>
-    <h2><a target="_blank" rel="noopener" href="https://angular.io/tutorial">Tour of Heroes</a></h2>
-  </li>
-  <li>
-    <h2><a target="_blank" rel="noopener" href="https://github.com/angular/angular-cli/wiki">CLI Documentation</a></h2>
-  </li>
-  <li>
-    <h2><a target="_blank" rel="noopener" href="https://blog.angular.io/">Angular blog</a></h2>
-  </li>
-</ul>
-
--- a/integration/cli-hello-world-ivy/src/app/app.component.spec.ts
+++ b/integration/cli-hello-world-ivy/src/app/app.component.spec.ts
@ -1,27 +0,0 @@
-import { TestBed, async } from '@angular/core/testing';
-import { AppComponent } from './app.component';
-describe('AppComponent', () => {
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [
-        AppComponent
-      ],
-    }).compileComponents();
-  }));
-  it('should create the app', async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.debugElement.componentInstance;
-    expect(app).toBeTruthy();
-  }));
-  it(`should have as title 'app'`, async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.debugElement.componentInstance;
-    expect(app.title).toEqual('app');
-  }));
-  it('should render title in a h1 tag', async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-    const compiled = fixture.debugElement.nativeElement;
-    expect(compiled.querySelector('h1').textContent).toContain('Welcome to app!');
-  }));
-});
--- a/Show More
+++ b/Show More