ci: require green integration tests to publish snapshot

Now looks like https://circleci.com/workflow-run/921ffc90-cff6-4f48-97df-740d60d5bf2b

.circleci/config.yml

@@ -15,8 +15,12 @@
 var_1: &docker_image angular/ngcontainer:0.2.0
 var_2: &cache_key v2-angular-{{ .Branch }}-{{ checksum "yarn.lock" }}-0.2.0
 
+# Define common ENV vars
+var_3: &define_env_vars
+  run: echo "export PROJECT_ROOT=$(pwd)" >> $BASH_ENV
+
 # See remote cache documentation in /docs/BAZEL.md
-var_3: &setup-bazel-remote-cache
+var_4: &setup-bazel-remote-cache
   run:
     name: Start up bazel remote cache proxy
     command: ~/bazel-remote-proxy -backend circleci://
@@ -59,10 +63,11 @@ jobs:
       - run: yarn install --frozen-lockfile --non-interactive
       - run: ./node_modules/.bin/gulp lint
 
-  build:
+  test:
     <<: *job_defaults
     resource_class: xlarge
     steps:
+      - *define_env_vars
       - checkout:
           <<: *post_checkout
       # See remote cache documentation in /docs/BAZEL.md
@@ -103,6 +108,66 @@ jobs:
             - "node_modules"
             - "~/bazel_repository_cache"
 
+  # This job exists only for backwards-compatibility with old scripts and tests
+  # that rely on the pre-Bazel dist/packages-dist layout.
+  # It duplicates some work with the job above: we build the bazel packages
+  # twice. Even though we have a remote cache, these jobs will typically run in
+  # parallel so up-to-date outputs will not be available at the time the build
+  # starts.
+  # No new jobs should depend on this one.
+  build-packages-dist:
+    <<: *job_defaults
+    resource_class: xlarge
+    steps:
+      - *define_env_vars
+      - checkout:
+          <<: *post_checkout
+      # See remote cache documentation in /docs/BAZEL.md
+      - run: .circleci/setup_cache.sh
+      - run: sudo cp .circleci/bazel.rc /etc/bazel.bazelrc
+      - *setup-bazel-remote-cache
+
+      - run: bazel run @yarn//:yarn
+      - run: scripts/build-packages-dist.sh
+
+      # Save the npm packages from //packages/... for other workflow jobs to read
+      # https://circleci.com/docs/2.0/workflows/#using-workspaces-to-share-data-among-jobs
+      - persist_to_workspace:
+          root: dist
+          paths:
+            - packages-dist
+
+  # We run the integration tests outside of Bazel for now.
+  # They are a separate workflow job so that they can be easily re-run.
+  # When the tests are ported to bazel test targets, they should move to the "test"
+  # job above, as part of the bazel test command. That has flaky_test_attempts so the
+  # need to re-run manually should be alleviated.
+  # See comments inside the integration/run_tests.sh script.
+  integration_test:
+    <<: *job_defaults
+    steps:
+      - *define_env_vars
+      - checkout:
+          <<: *post_checkout
+      - attach_workspace:
+          at: dist
+      - run: xvfb-run --auto-servernum ./integration/run_tests.sh
+
+  # This job updates the content of repos like github.com/angular/core-builds
+  # for every green build on angular/angular.
+  publish_snapshot:
+    <<: *job_defaults
+    steps:
+      - checkout:
+          <<: *post_checkout
+      - attach_workspace:
+          at: dist
+      # CircleCI has a config setting to force SSH for all github connections
+      # This is not compatible with our mechanism of using a Personal Access Token
+      # Clear the global setting
+      - run: git config --global --unset "url.ssh://git@github.com.insteadof"
+      - run: ./scripts/ci/publish-build-artifacts.sh
+
   aio_monitoring:
     <<: *job_defaults
     steps:
@@ -117,7 +182,25 @@ workflows:
   default_workflow:
     jobs:
       - lint
-      - build
+      - test
+      - build-packages-dist
+      - integration_test:
+          requires:
+            - build-packages-dist
+      - publish_snapshot:
+          # Note: no filters on this job because we want it to run for all upstream branches
+          # We'd really like to filter out pull requests here, but not yet available:
+          # https://discuss.circleci.com/t/workflows-pull-request-filter/14396/4
+          # Instead, the publish-build-artifacts.sh script just terminates when
+          # CIRCLE_PR_NUMBER is set.
+          requires:
+            # Only publish if tests and integration tests pass
+            - test
+            - integration_test
+            # Get the artifacts to publish from the build-packages-dist job
+            # since the publishing script expects the legacy outputs layout.
+            - build-packages-dist
+
   aio_monitoring:
     jobs:
       - aio_monitoring

.circleci/github_token

@@ -0,0 +1 @@
+Salted__<EFBFBD><EFBFBD><EFBFBD><EFBFBD>˓]<5D><><EFBFBD>O<>ʤu'<27><>Uzh<7A><68><EFBFBD>bE<62>]+<2B>xC<78>Y-<2D>?<3F>c"q<>;ƲK@l#<23>xހ<78>I<EFBFBD>1&w0<77>+<2B>\p/O<>;<3B>

.pullapprove.yml

@@ -153,7 +153,7 @@ groups:
         - "packages/compiler/src/i18n/*"
     users:
       - vicb #primary
-      - chuckjaz
+      - alxhub
       - IgorMinar #fallback
       - mhevery #fallback
 
@@ -162,7 +162,7 @@ groups:
       files:
         - "packages/compiler/*"
     users:
-      - chuckjaz #primary
+      - alxhub #primary
       - vicb
       - mhevery
       - IgorMinar #fallback
@@ -187,7 +187,7 @@ groups:
           - "packages/compiler-cli/src/ngtools*"
     users:
       - alexeagle
-      - chuckjaz
+      - alxhub
       - vicb
       - IgorMinar #fallback
       - mhevery #fallback
@@ -310,6 +310,7 @@ groups:
     users:
       - andrewseguin #primary
       - gkalpak
+      - robwormald
       - IgorMinar #fallback
       - mhevery #fallback
 
@@ -365,4 +366,5 @@ groups:
       - petebacondarwin
       - gkalpak
       - IgorMinar
+      - robwormald
       - mhevery #fallback

.travis.yml

@@ -45,7 +45,6 @@ env:
   matrix:
     # Order: a slower build first, so that we don't occupy an idle travis worker waiting for others to complete.
     - CI_MODE=e2e
-    - CI_MODE=e2e_2
     - CI_MODE=js
     - CI_MODE=saucelabs_required
     # deactivated, see #19768

CHANGELOG.md

@@ -1,5 +1,55 @@
+<a name="5.2.10"></a>
+## [5.2.10](https://github.com/angular/angular/compare/5.2.9...5.2.10) (2018-04-16)
+
+
+### Bug Fixes
+
+* **animations:** avoid animation insertions during router back/refresh ([#21977](https://github.com/angular/angular/issues/21977)) ([641cc49](https://github.com/angular/angular/commit/641cc49)), closes [#19712](https://github.com/angular/angular/issues/19712)
+* **common:** properly take className changes into account ([#21937](https://github.com/angular/angular/issues/21937)) ([54e9108](https://github.com/angular/angular/commit/54e9108)), closes [#21932](https://github.com/angular/angular/issues/21932)
+* **compiler:** fix support for html-like text in translatable attributes ([#23053](https://github.com/angular/angular/issues/23053)) ([4f7c369](https://github.com/angular/angular/commit/4f7c369))
+* **compiler-cli:** emit correct css string escape sequences ([#22776](https://github.com/angular/angular/issues/22776)) ([db0afa9](https://github.com/angular/angular/commit/db0afa9))
+* **forms:** improve error message for invalid value accessors ([#22731](https://github.com/angular/angular/issues/22731)) ([dd61595](https://github.com/angular/angular/commit/dd61595))
+* **service-worker:** add badge to NOTIFICATION_OPTION_NAMES ([#23241](https://github.com/angular/angular/issues/23241)) ([7b23983](https://github.com/angular/angular/commit/7b23983)), closes [#23196](https://github.com/angular/angular/issues/23196)
+* **service-worker:** do not enter degraded mode when offline ([#22883](https://github.com/angular/angular/issues/22883)) ([ae9c25f](https://github.com/angular/angular/commit/ae9c25f)), closes [#21636](https://github.com/angular/angular/issues/21636)
+* **service-worker:** fix LruList bugs ([#22769](https://github.com/angular/angular/issues/22769)) ([65f8943](https://github.com/angular/angular/commit/65f8943)), closes [#22218](https://github.com/angular/angular/issues/22218) [#22768](https://github.com/angular/angular/issues/22768)
+* **service-worker:** ignore invalid `only-if-cached` requests ([#22883](https://github.com/angular/angular/issues/22883)) ([0d4fe38](https://github.com/angular/angular/commit/0d4fe38)), closes [#22362](https://github.com/angular/angular/issues/22362)
+* **upgrade:** correctly handle downgraded `OnPush` components ([#22209](https://github.com/angular/angular/issues/22209)) ([f43fba6](https://github.com/angular/angular/commit/f43fba6)), closes [#14286](https://github.com/angular/angular/issues/14286)
+* **upgrade:** propagate return value of resumeBootstrap ([#22754](https://github.com/angular/angular/issues/22754)) ([ae76eec](https://github.com/angular/angular/commit/ae76eec)), closes [#22723](https://github.com/angular/angular/issues/22723)
+* **upgrade:** two-way binding and listening for event ([#22772](https://github.com/angular/angular/issues/22772)) ([5391f96](https://github.com/angular/angular/commit/5391f96)), closes [#22734](https://github.com/angular/angular/issues/22734)
+
+
+
+<a name="4.4.7"></a>
+## [4.4.7](https://github.com/angular/angular/compare/4.4.6...4.4.7) (2018-04-16)
+
+
+### Bug Fixes
+
+* **core:** use appropriate inert document strategy for Firefox & Safari ([#22077](https://github.com/angular/angular/issues/22077)) ([2c5cf19](https://github.com/angular/angular/commit/2c5cf19))
+
+
+
+<a name="6.0.0-rc.5"></a>
+## [6.0.0-rc.5](https://github.com/angular/angular/compare/6.0.0-rc.4...6.0.0-rc.5) (2018-04-14)
+
+
+### Bug Fixes
+
+* **compiler:** use correct global name in compiler.umd.js ([#23354](https://github.com/angular/angular/issues/23354)) ([b76dd3b](https://github.com/angular/angular/commit/b76dd3b)), closes [#23343](https://github.com/angular/angular/issues/23343)
+* **compiler-cli:** shorten resolved module name in fileNameToModuleName to npm package name for typings ([#23231](https://github.com/angular/angular/issues/23231)) ([6199ea5](https://github.com/angular/angular/commit/6199ea5))
+* **elements:** include schematics in npm distro ([#23350](https://github.com/angular/angular/issues/23350)) ([9fabe2f](https://github.com/angular/angular/commit/9fabe2f))
+* **service-worker:** let `*` match 0 characters in globs ([#23339](https://github.com/angular/angular/issues/23339)) ([6c2c958](https://github.com/angular/angular/commit/6c2c958))
+
+
+### Features
+
+* **platform-browser:** add token marking which the type of animation module nearest in the injector tree ([#23075](https://github.com/angular/angular/issues/23075)) ([b551f84](https://github.com/angular/angular/commit/b551f84))
+* **service-worker:** add support for configuring navigations URLs ([#23339](https://github.com/angular/angular/issues/23339)) ([08325aa](https://github.com/angular/angular/commit/08325aa)), closes [#20404](https://github.com/angular/angular/issues/20404)
+
+
+
 <a name="6.0.0-rc.4"></a>
-# [6.0.0-rc.4](https://github.com/angular/angular/compare/6.0.0-rc.3...6.0.0-rc.4) (2018-04-12)
+## [6.0.0-rc.4](https://github.com/angular/angular/compare/6.0.0-rc.3...6.0.0-rc.4) (2018-04-12)
 
 
 ### Bug Fixes
@@ -20,7 +70,7 @@
 
 
 <a name="6.0.0-rc.3"></a>
-# [6.0.0-rc.3](https://github.com/angular/angular/compare/6.0.0-rc.2...6.0.0-rc.3) (2018-04-06)
+## [6.0.0-rc.3](https://github.com/angular/angular/compare/6.0.0-rc.2...6.0.0-rc.3) (2018-04-06)
 
 
 ### Bug Fixes
@@ -31,7 +81,7 @@
 
 
 <a name="6.0.0-rc.2"></a>
-# [6.0.0-rc.2](https://github.com/angular/angular/compare/6.0.0-rc.1...6.0.0-rc.2) (2018-04-05)
+## [6.0.0-rc.2](https://github.com/angular/angular/compare/6.0.0-rc.1...6.0.0-rc.2) (2018-04-05)
 
 
 ### Bug Fixes
@@ -52,7 +102,7 @@
 
 
 <a name="6.0.0-rc.1"></a>
-# [6.0.0-rc.1](https://github.com/angular/angular/compare/6.0.0-rc.0...6.0.0-rc.1) (2018-03-30)
+## [6.0.0-rc.1](https://github.com/angular/angular/compare/6.0.0-rc.0...6.0.0-rc.1) (2018-03-30)
 
 
 ### Bug Fixes
@@ -112,7 +162,7 @@ possible, and ideally also a include a good reproduction of the problem.
 
 
 <a name="6.0.0-beta.8"></a>
-# [6.0.0-beta.8](https://github.com/angular/angular/compare/6.0.0-beta.7...6.0.0-beta.8) (2018-03-16)
+## [6.0.0-beta.8](https://github.com/angular/angular/compare/6.0.0-beta.7...6.0.0-beta.8) (2018-03-16)
 
 
 ### Bug Fixes

WORKSPACE

@@ -20,9 +20,9 @@ yarn_install(
 
 http_archive(
     name = "build_bazel_rules_typescript",
-    url = "https://github.com/bazelbuild/rules_typescript/archive/0.11.1.zip",
-    strip_prefix = "rules_typescript-0.11.1",
-    sha256 = "7406bea7954e1c906f075115dfa176551a881119f6820b126ea1eacb09f34a1a",
+    url = "https://github.com/bazelbuild/rules_typescript/archive/0.12.1.zip",
+    strip_prefix = "rules_typescript-0.12.1",
+    sha256 = "24e2c36f60508c6d270ae4265b89b381e3f66d550e70c367ed3755ad8d7ce3b0",
 )
 
 load("@build_bazel_rules_typescript//:defs.bzl", "ts_setup_workspace")

aio/.angular-cli.json

@@ -1,73 +0,0 @@
-{
-  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
-  "project": {
-    "name": "site"
-  },
-  "apps": [
-    {
-      "root": "src",
-      "outDir": "dist",
-      "assets": [
-        "assets",
-        "generated",
-        "app/search/search-worker.js",
-        "favicon.ico",
-        "pwa-manifest.json",
-        "google385281288605d160.html",
-        { "glob": "custom-elements.min.js", "input": "../node_modules/@webcomponents/custom-elements", "output": "./assets/js" },
-        { "glob": "native-shim.js", "input": "../node_modules/@webcomponents/custom-elements/src", "output": "./assets/js" }
-      ],
-      "index": "index.html",
-      "main": "main.ts",
-      "polyfills": "polyfills.ts",
-      "test": "test.ts",
-      "tsconfig": "tsconfig.app.json",
-      "testTsconfig": "tsconfig.spec.json",
-      "prefix": "aio",
-      "serviceWorker": false,
-      "styles": [
-        "styles.scss"
-      ],
-      "scripts": [
-      ],
-      "environmentSource": "environments/environment.ts",
-      "environments": {
-        "dev": "environments/environment.ts",
-        "next": "environments/environment.next.ts",
-        "stable": "environments/environment.stable.ts",
-        "archive": "environments/environment.archive.ts"
-      }
-    }
-  ],
-  "e2e": {
-    "protractor": {
-      "config": "tests/e2e/protractor.conf.js"
-    }
-  },
-  "lint": [
-    {
-      "project": "src/tsconfig.app.json"
-    },
-    {
-      "project": "src/tsconfig.spec.json"
-    },
-    {
-      "project": "tests/e2e/tsconfig.e2e.json"
-    }
-  ],
-  "test": {
-    "karma": {
-      "config": "src/karma.conf.js"
-    }
-  },
-  "defaults": {
-    "styleExt": "scss",
-    "component": {
-      "inlineStyle": true
-    },
-    "build": {
-      "namedChunks": true
-    }
-  },
-  "packageManager": "yarn"
-}

aio/README.md

@@ -22,7 +22,8 @@ Here are the most important tasks you might need to use:
 * `yarn start` - run a development web server that watches the files; then builds the doc-viewer and reloads the page, as necessary.
 * `yarn serve-and-sync` - run both the `docs-watch` and `start` in the same console.
 * `yarn lint` - check that the doc-viewer code follows our style rules.
-* `yarn test` - watch all the source files, for the doc-viewer, and run all the unit tests when any change.
+* `yarn test` - run all the unit tests once.
+* `yarn test --watch` - watch all the source files, for the doc-viewer, and run all the unit tests when any change.
 * `yarn e2e` - run all the e2e tests for the doc-viewer.
 
 * `yarn docs` - generate all the docs from the source files.

aio/angular.json

@@ -0,0 +1,235 @@
+{
+  "$schema": "./node_modules/@angular-devkit/core/src/workspace/workspace-schema.json",
+  "version": 1,
+  "cli": {
+    "packageManager": "yarn"
+  },
+  "newProjectRoot": "projects",
+  "projects": {
+    "site": {
+      "root": "",
+      "projectType": "application",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "dist",
+            "index": "src/index.html",
+            "main": "src/main.ts",
+            "tsConfig": "src/tsconfig.app.json",
+            "aot": true,
+            "optimization": true,
+            "buildOptimizer": true,
+            "outputHashing": "all",
+            "sourceMap": true,
+            "statsJson": true,
+            "extractCss": true,
+            "extractLicenses": true,
+            "namedChunks": true,
+            "vendorChunk": false,
+            "polyfills": "src/polyfills.ts",
+            "assets": [
+              {
+                "glob": "**/*",
+                "input": "src/assets",
+                "output": "/assets"
+              },
+              {
+                "glob": "**/*",
+                "input": "src/generated",
+                "output": "/generated"
+              },
+              {
+                "glob": "app/search/search-worker.js",
+                "input": "src",
+                "output": "/"
+              },
+              {
+                "glob": "favicon.ico",
+                "input": "src",
+                "output": "/"
+              },
+              {
+                "glob": "pwa-manifest.json",
+                "input": "src",
+                "output": "/"
+              },
+              {
+                "glob": "google385281288605d160.html",
+                "input": "src",
+                "output": "/"
+              },
+              {
+                "glob": "custom-elements.min.js",
+                "input": "node_modules/@webcomponents/custom-elements",
+                "output": "/assets/js"
+              },
+              {
+                "glob": "native-shim.js",
+                "input": "node_modules/@webcomponents/custom-elements/src",
+                "output": "/assets/js"
+              }
+            ],
+            "styles": [
+              {
+                "input": "src/styles.scss"
+              }
+            ],
+            "scripts": [],
+
+          },
+          "configurations": {
+            "next": {
+              "fileReplacements": [
+                {
+                  "src": "src/environments/environment.ts",
+                  "replaceWith": "src/environments/environment.next.ts"
+                }
+              ]
+            },
+            "stable": {
+              "fileReplacements": [
+                {
+                  "src": "src/environments/environment.ts",
+                  "replaceWith": "src/environments/environment.stable.ts"
+                }
+              ]
+            },
+            "archive": {
+              "fileReplacements": [
+                {
+                  "src": "src/environments/environment.ts",
+                  "replaceWith": "src/environments/environment.archive.ts"
+                }
+              ]
+            }
+          }
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "options": {
+            "browserTarget": "site:build"
+          },
+          "configurations": {
+            "next": {
+              "browserTarget": "site:build:next"
+            },
+            "stable": {
+              "browserTarget": "site:build:stable"
+            },
+            "archive": {
+              "browserTarget": "site:build:archive"
+            }
+          }
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "options": {
+            "browserTarget": "site:build"
+          }
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "src/test.ts",
+            "karmaConfig": "src/karma.conf.js",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "src/tsconfig.spec.json",
+            "scripts": [],
+            "styles": [
+              {
+                "input": "src/styles.scss"
+              }
+            ],
+            "assets": [
+              {
+                "glob": "**/*",
+                "input": "src/assets",
+                "output": "/assets"
+              },
+              {
+                "glob": "**/*",
+                "input": "src/generated",
+                "output": "/generated"
+              },
+              {
+                "glob": "app/search/search-worker.js",
+                "input": "src",
+                "output": "/"
+              },
+              {
+                "glob": "favicon.ico",
+                "input": "src",
+                "output": "/"
+              },
+              {
+                "glob": "pwa-manifest.json",
+                "input": "src",
+                "output": "/"
+              },
+              {
+                "glob": "google385281288605d160.html",
+                "input": "src",
+                "output": "/"
+              },
+              {
+                "glob": "custom-elements.min.js",
+                "input": "node_modules/@webcomponents/custom-elements",
+                "output": "/assets/js"
+              },
+              {
+                "glob": "native-shim.js",
+                "input": "node_modules/@webcomponents/custom-elements/src",
+                "output": "/assets/js"
+              }
+            ]
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [
+              "src/tsconfig.app.json",
+              "src/tsconfig.spec.json"
+            ],
+            "exclude": []
+          }
+        }
+      }
+    },
+    "site-e2e": {
+      "root": "",
+      "projectType": "application",
+      "cli": {},
+      "schematics": {},
+      "architect": {
+        "e2e": {
+          "builder": "@angular-devkit/build-angular:protractor",
+          "options": {
+            "protractorConfig": "tests/e2e/protractor.conf.js",
+            "devServerTarget": "site:serve"
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [
+              "tests/e2e/tsconfig.e2e.json"
+            ],
+            "exclude": []
+          }
+        }
+      }
+    }
+  },
+  "schematics": {
+    "@schematics/angular:component": {
+      "inlineStyle": true,
+      "prefix": "aio",
+      "styleext": "scss"
+    },
+    "@schematics/angular:directive": {
+      "prefix": "aio"
+    }
+  }
+}

aio/content/examples/.gitignore

@@ -13,18 +13,20 @@
 **/src/tsconfig.app.json
 **/src/tsconfig.spec.json
 **/src/typings.d.ts
-**/e2e/app.po.ts
+**/e2e/src/app.po.ts
 **/e2e/tsconfig.e2e.json
+**/src/karma.conf.js
 **/.angular-cli.json
 **/.editorconfig
+**/angular.json
 **/tsconfig.json
 **/bs-config.e2e.json
 **/bs-config.json
 **/package.json
 **/tslint.json
-**/karma.conf.js
 **/karma-test-shim.js
 **/browser-test-shim.js
+**/browserslist
 **/node_modules
 
 # built files

aio/content/examples/architecture/src/app/backend.service.ts

@@ -15,7 +15,7 @@ export class BackendService {
 
   getAll(type: Type<any>): PromiseLike<any[]> {
     if (type === Hero) {
-      // TODO get from the database
+      // TODO: get from the database
       return Promise.resolve<Hero[]>(HEROES);
     }
     let err = new Error('Cannot get object of this type');

aio/content/examples/dependency-injection-in-action/src/app/hero-of-the-month.component.1.ts

@@ -8,7 +8,7 @@ import { MinimalLogger }       from './minimal-logger.service';
 @Component({
   selector: 'app-hero-of-the-month',
   templateUrl: './hero-of-the-month.component.html',
-  // Todo: move this aliasing, `useExisting` provider to the AppModule
+  // TODO: move this aliasing, `useExisting` provider to the AppModule
   providers: [{ provide: MinimalLogger, useExisting: LoggerService }]
 })
 export class HeroOfTheMonthComponent {

aio/content/examples/dependency-injection-in-action/src/app/hero.service.ts

@@ -5,7 +5,7 @@ import { Hero }       from './hero';
 @Injectable()
 export class HeroService {
 
-  // TODO move to database
+  // TODO: move to database
   private heroes: Array<Hero> = [
     new Hero(1, 'RubberMan', 'Hero of many talents', '123-456-7899'),
     new Hero(2, 'Magma', 'Hero of all trades', '555-555-5555'),

aio/content/examples/dependency-injection-in-action/src/app/parent-finder.component.ts

@@ -50,7 +50,7 @@ const templateC = `
 })
 // #docregion carol-class
 export class CarolComponent {
-  name= 'Carol';
+  name = 'Carol';
   // #docregion carol-ctor
   constructor( @Optional() public parent: Parent ) { }
   // #enddocregion carol-ctor
@@ -63,7 +63,7 @@ export class CarolComponent {
   template: templateC
 })
 export class ChrisComponent {
-  name= 'Chris';
+  name = 'Chris';
   constructor( @Optional() public parent: Parent ) { }
 }
 
@@ -116,7 +116,7 @@ export class BarryComponent implements Parent {
   providers:  [ provideParent(BobComponent) ]
 })
 export class BobComponent implements Parent {
-  name= 'Bob';
+  name = 'Bob';
   constructor( @SkipSelf() @Optional() public parent: Parent ) { }
 }
 
@@ -128,7 +128,7 @@ export class BobComponent implements Parent {
 // #enddocregion beth-providers
 })
 export class BethComponent implements Parent {
-  name= 'Beth';
+  name = 'Beth';
   constructor( @SkipSelf() @Optional() public parent: Parent ) { }
 }
 
@@ -151,13 +151,13 @@ export class BethComponent implements Parent {
 // #docregion alex-1
 })
 // #enddocregion alex-1
-// Todo: Add `... implements Parent` to class signature
+// TODO: Add `... implements Parent` to class signature
 // #docregion alex-1
 // #docregion alex-class-signature
 export class AlexComponent extends Base
 // #enddocregion alex-class-signature
 {
-  name= 'Alex';
+  name = 'Alex';
 }
 // #enddocregion alex, alex-1
 
@@ -182,7 +182,7 @@ export class AlexComponent extends Base
 export class AliceComponent implements Parent
 // #enddocregion alice-class-signature
 {
-  name= 'Alice';
+  name = 'Alice';
 }
 // #enddocregion alice
 

aio/content/examples/dependency-injection/e2e/src/app.e2e-spec.ts

@@ -187,7 +187,7 @@ describe('Dependency Injection Tests', function () {
         let heroes = element.all(by.css('#authorized app-hero-list div'));
         expect(heroes.count()).toBeGreaterThan(0);
 
-        let filteredHeroes = heroes.filter(function(elem: ElementFinder, index: number){
+        let filteredHeroes = heroes.filter(function(elem: ElementFinder, index: number) {
          return elem.getText().then(function(text: string) {
             return /secret/.test(text);
           });

aio/content/examples/dependency-injection/src/app/user.service.ts

@@ -7,7 +7,7 @@ export class User {
     public isAuthorized = false) { }
 }
 
-// Todo: get the user; don't 'new' it.
+// TODO: get the user; don't 'new' it.
 let alice = new User('Alice', true);
 let bob = new User('Bob', false);
 

aio/content/examples/dynamic-component-loader/src/app/ad-banner.component.ts

@@ -19,7 +19,7 @@ import { AdComponent } from './ad.component';
 // #docregion class
 export class AdBannerComponent implements OnInit, OnDestroy {
   @Input() ads: AdItem[];
-  currentAdIndex: number = -1;
+  currentAdIndex = -1;
   @ViewChild(AdDirective) adHost: AdDirective;
   interval: any;
 

aio/content/examples/dynamic-component-loader/src/app/hero-job-ad.component.ts

@@ -6,8 +6,8 @@ import { AdComponent }      from './ad.component';
 @Component({
   template: `
     <div class="job-ad">
-      <h4>{{data.headline}}</h4> 
-      
+      <h4>{{data.headline}}</h4>
+
       {{data.body}}
     </div>
   `

aio/content/examples/dynamic-component-loader/src/app/hero-profile.component.ts

@@ -8,7 +8,7 @@ import { AdComponent }       from './ad.component';
     <div class="hero-profile">
       <h3>Featured Hero Profile</h3>
       <h4>{{data.name}}</h4>
-      
+
       <p>{{data.bio}}</p>
 
       <strong>Hire this hero today!</strong>

aio/content/examples/dynamic-form/e2e/src/app.e2e-spec.ts

@@ -21,7 +21,7 @@ describe('Dynamic Form', function () {
       element(by.css('select option[value="solid"]')).click();
 
       let saveButton = element.all(by.css('button')).get(0);
-      saveButton.click().then(function(){
+      saveButton.click().then(function() {
         expect(element(by.xpath("//strong[contains(text(),'Saved the following values')]")).isPresent()).toBe(true);
       });
   });

aio/content/examples/dynamic-form/src/app/question-base.ts

@@ -1,5 +1,5 @@
 // #docregion
-export class QuestionBase<T>{
+export class QuestionBase<T> {
   value: T;
   key: string;
   label: string;

aio/content/examples/dynamic-form/src/app/question.service.ts

@@ -8,8 +8,8 @@ import { TextboxQuestion }  from './question-textbox';
 @Injectable()
 export class QuestionService {
 
-  // Todo: get from a remote source of question metadata
-  // Todo: make asynchronous
+  // TODO: get from a remote source of question metadata
+  // TODO: make asynchronous
   getQuestions() {
 
     let questions: QuestionBase<any>[] = [

aio/content/examples/http/src/app/http-interceptors/upload-interceptor.ts

@@ -14,7 +14,7 @@ export class UploadInterceptor implements HttpInterceptor {
     if (req.url.indexOf('/upload/file') === -1) {
       return next.handle(req);
     }
-    const delay = 300; // Todo: inject delay?
+    const delay = 300; // TODO: inject delay?
     return createUploadEvents(delay);
   }
 }

aio/content/examples/reactive-forms/src/app/hero-list/hero-list.component.ts

@@ -23,7 +23,7 @@ export class HeroListComponent implements OnInit {
   getHeroes() {
     this.isLoading = true;
     this.heroes = this.heroService.getHeroes()
-                      // Todo: error handling
+                      // TODO: error handling
                       .pipe(finalize(() => this.isLoading = false));
     this.selectedHero = undefined;
   }

aio/content/examples/router/e2e/src/app.e2e-spec.ts

@@ -88,7 +88,8 @@ describe('Router', () => {
     await crisisCenterEdit(2, true);
   });
 
-  it('can cancel changed crisis details', async () => {
+  // TODO: Figure out why this test is failing now
+  xit('can cancel changed crisis details', async () => {
     const page = getPageStruct();
     await page.crisisHref.click();
     await crisisCenterEdit(3, false);

aio/content/examples/router/src/app/heroes/hero-list.component.1.ts

@@ -1,6 +1,6 @@
 // #docplaster
 // #docregion
-// TODO SOMEDAY: Feature Componetized like HeroCenter
+// TODO: Feature Componetized like HeroCenter
 import { Component, OnInit }   from '@angular/core';
 import { Router }              from '@angular/router';
 import { Observable }          from 'rxjs';

aio/content/examples/router/src/app/heroes/hero-list.component.ts

@@ -1,6 +1,6 @@
 // #docplaster
 // #docregion
-// TODO SOMEDAY: Feature Componetized like CrisisCenter
+// TODO: Feature Componetized like CrisisCenter
 // #docregion rxjs-imports
 import { Observable } from 'rxjs';
 import { switchMap } from 'rxjs/operators';

aio/content/examples/testing/src/app/demo/demo.ts

@@ -37,8 +37,8 @@ export class ValueService {
 // #docregion MasterService
 @Injectable()
 export class MasterService {
-  constructor(private masterService: ValueService) { }
-  getValue() { return this.masterService.getValue(); }
+  constructor(private valueService: ValueService) { }
+  getValue() { return this.valueService.getValue(); }
 }
 // #enddocregion MasterService
 

aio/content/examples/testing/src/app/model/hero.service.spec.ts

@@ -15,7 +15,7 @@ describe ('HeroesService (with spies)', () => {
   let heroService: HeroService;
 
   beforeEach(() => {
-    // Todo: spy on other methods too
+    // TODO: spy on other methods too
     httpClientSpy = jasmine.createSpyObj('HttpClient', ['get']);
     heroService = new HeroService(<any> httpClientSpy);
   });

aio/content/examples/toh-pt4/src/app/hero.service.ts

@@ -26,7 +26,7 @@ export class HeroService {
   // #docregion getHeroes, getHeroes-1
   getHeroes(): Observable<Hero[]> {
     // #enddocregion getHeroes-1
-    // Todo: send the message _after_ fetching the heroes
+    // TODO: send the message _after_ fetching the heroes
     this.messageService.add('HeroService: fetched heroes');
     // #docregion getHeroes-1
     return of(HEROES);

aio/content/examples/toh-pt5/src/app/hero.service.ts

@@ -12,14 +12,14 @@ export class HeroService {
   constructor(private messageService: MessageService) { }
 
   getHeroes(): Observable<Hero[]> {
-    // Todo: send the message _after_ fetching the heroes
+    // TODO: send the message _after_ fetching the heroes
     this.messageService.add('HeroService: fetched heroes');
     return of(HEROES);
   }
 
   // #docregion getHero
   getHero(id: number): Observable<Hero> {
-    // Todo: send the message _after_ fetching the hero
+    // TODO: send the message _after_ fetching the hero
     this.messageService.add(`HeroService: fetched hero id=${id}`);
     return of(HEROES.find(hero => hero.id === id));
   }

aio/content/examples/toh-pt6/e2e/src/app.e2e-spec.ts

@@ -44,10 +44,7 @@ class Hero {
   }
 }
 
-// TODO(i): temorarily disable these tests because angular-in-memory-web-api is not compatible with rxjs v6 yet
-//          and we don't have the backwards compatibility package yet.
-//          Reenable after rxjs v6 compatibility package is out or angular-in-memory-web-api is compatible with rxjs v6
-xdescribe('Tutorial part 6', () => {
+describe('Tutorial part 6', () => {
 
   beforeAll(() => browser.get(''));
 

aio/content/examples/universal/tsconfig.json

@@ -1,19 +0,0 @@
-{
-  "compileOnSave": false,
-  "compilerOptions": {
-    "outDir": "./dist/out-tsc",
-    "sourceMap": true,
-    "declaration": false,
-    "moduleResolution": "node",
-    "emitDecoratorMetadata": true,
-    "experimentalDecorators": true,
-    "target": "es5",
-    "typeRoots": [
-      "node_modules/@types"
-    ],
-    "lib": [
-      "es2017",
-      "dom"
-    ]
-  }
-}

aio/content/examples/upgrade-module/src/systemjs.config.1.js

@@ -36,10 +36,6 @@
       'rxjs/operators': {main: 'index.js', defaultExtension: 'js' },
       'rxjs/testing': {main: 'index.js', defaultExtension: 'js' },
       'rxjs/websocket': {main: 'index.js', defaultExtension: 'js' },
-      'rxjs/ajax': {main: 'index.js', defaultExtension: 'js' },
-      'rxjs/operators': {main: 'index.js', defaultExtension: 'js' },
-      'rxjs/testing': {main: 'index.js', defaultExtension: 'js' },
-      'rxjs/websocket': {main: 'index.js', defaultExtension: 'js' },
       'rxjs': { main: 'index.js', defaultExtension: 'js' },
     }
   });

aio/content/guide/aot-compiler.md

@@ -103,7 +103,7 @@ You can control your app compilation by providing template compiler options in t
 This option tells the compiler not to produce `.metadata.json` files.
 The option is `false` by default.
 
-`.metadata.json` files contain infomration needed by the template compiler from a `.ts`
+`.metadata.json` files contain information needed by the template compiler from a `.ts`
 file that is not included in the `.d.ts` file produced by the TypeScript compiler. This information contains,
 for example, the content of annotations (such as a component's template) which TypeScript
 emits to the `.js` file but not to the `.d.ts` file.

aio/content/guide/architecture-components.md

@@ -22,7 +22,7 @@ Angular creates, updates, and destroys components as the user moves through the
 
 <img src="generated/images/guide/architecture/metadata.png" alt="Metadata" class="left">
 
-The `@Component` decorator identifies the class immediately below it as a component class, and specifies its metadata. In the example code below, you can see that `HeroListComponent` is just a class, with no special Angular notation or syntax at all. It's not a component until mark it as one with the `@Component` decorator.
+The `@Component` decorator identifies the class immediately below it as a component class, and specifies its metadata. In the example code below, you can see that `HeroListComponent` is just a class, with no special Angular notation or syntax at all. It's not a component until you mark it as one with the `@Component` decorator.
 
 The metadata for a component tells Angular where to get the major building blocks it needs to create and present the component and its view. In particular, it associates a _template_ with the component, either directly with inline code, or by reference. Together, the component and its template describe a _view_.
 
@@ -76,7 +76,7 @@ This template uses typical HTML elements like `<h2>` and  `<p>`, and also includ
 
 Without a framework, you would be responsible for pushing data values into the HTML controls and turning user responses into actions and value updates. Writing such push/pull logic by hand is tedious, error-prone, and a nightmare to read, as any experienced jQuery programmer can attest.
 
-Angular supports *two-way data binding*, a mechanism for coordinating parts of a template with parts of a component. Add binding markup to the template HTML to tell Angular how to connect both sides. 
+Angular supports *two-way data binding*, a mechanism for coordinating parts of a template with parts of a component. Add binding markup to the template HTML to tell Angular how to connect both sides.
 
 The following diagram shows the four forms of data binding markup. Each form has a direction&mdash;to the DOM, from the DOM, or in both directions.
 

aio/content/guide/cheatsheet.md

@@ -311,11 +311,11 @@ so the <code>@Directive</code> configuration applies to components as well</p>
 </td>
 </tr><tr>
 <td><code><b>ngAfterViewInit()</b> { ... }</code></td>
-<td><p>Called after <code>ngAfterContentInit</code> when the component's view has been initialized. Applies to components only.</p>
+<td><p>Called after <code>ngAfterContentInit</code> when the component's views and child views / the view that a directive is in has been initialized.</p>
 </td>
 </tr><tr>
 <td><code><b>ngAfterViewChecked()</b> { ... }</code></td>
-<td><p>Called after every check of the component's view. Applies to components only.</p>
+<td><p>Called after every check of the component's views and child views / the view that a directive is in.</p>
 </td>
 </tr><tr>
 <td><code><b>ngOnDestroy()</b> { ... }</code></td>

aio/content/guide/comparing-observables.md

@@ -249,7 +249,7 @@ An observable produces values over time. An array is created as a static set of
       <pre>➞5</pre>
     </td>
     <td>
-      <pre>arr.find((v) => v>10)</pre>
+      <pre>arr.find((v) => v>3)</pre>
       <pre>5</pre>
     </td>
   </tr>
@@ -273,8 +273,8 @@ An observable produces values over time. An array is created as a static set of
 1
 2
 3
-4
-5</pre>
+5
+7</pre>
     </td>
     <td>
       <pre>arr.forEach((v) => {
@@ -283,8 +283,8 @@ An observable produces values over time. An array is created as a static set of
 1
 2
 3
-4
-5</pre>
+5
+7</pre>
     </td>
   </tr>
   <tr>

aio/content/guide/component-interaction.md

@@ -61,7 +61,7 @@ The running application displays three heroes:
 E2E test that all children were instantiated and displayed as expected:
 
 
-<code-example path="component-interaction/e2e/app.e2e-spec.ts" region="parent-to-child" title="component-interaction/e2e/app.e2e-spec.ts">
+<code-example path="component-interaction/e2e/src/app.e2e-spec.ts" region="parent-to-child" title="component-interaction/e2e/src/app.e2e-spec.ts">
 
 </code-example>
 
@@ -105,7 +105,7 @@ Here's the `NameParentComponent` demonstrating name variations including a name
 E2E tests of input property setter with empty and non-empty names:
 
 
-<code-example path="component-interaction/e2e/app.e2e-spec.ts" region="parent-to-child-setter" title="component-interaction/e2e/app.e2e-spec.ts">
+<code-example path="component-interaction/e2e/src/app.e2e-spec.ts" region="parent-to-child-setter" title="component-interaction/e2e/src/app.e2e-spec.ts">
 
 </code-example>
 
@@ -164,7 +164,7 @@ Test that ***both*** input properties are set initially and that button clicks t
 the expected `ngOnChanges` calls and values:
 
 
-<code-example path="component-interaction/e2e/app.e2e-spec.ts" region="parent-to-child-onchanges" title="component-interaction/e2e/app.e2e-spec.ts">
+<code-example path="component-interaction/e2e/src/app.e2e-spec.ts" region="parent-to-child-onchanges" title="component-interaction/e2e/src/app.e2e-spec.ts">
 
 </code-example>
 
@@ -217,7 +217,7 @@ and the method processes it:
 Test that clicking the *Agree* and *Disagree* buttons update the appropriate counters:
 
 
-<code-example path="component-interaction/e2e/app.e2e-spec.ts" region="child-to-parent" title="component-interaction/e2e/app.e2e-spec.ts">
+<code-example path="component-interaction/e2e/src/app.e2e-spec.ts" region="child-to-parent" title="component-interaction/e2e/src/app.e2e-spec.ts">
 
 </code-example>
 
@@ -284,7 +284,7 @@ match the seconds displayed in the child's status message.
 Test also that clicking the *Stop* button pauses the countdown timer:
 
 
-<code-example path="component-interaction/e2e/app.e2e-spec.ts" region="countdown-timer-tests" title="component-interaction/e2e/app.e2e-spec.ts">
+<code-example path="component-interaction/e2e/src/app.e2e-spec.ts" region="countdown-timer-tests" title="component-interaction/e2e/src/app.e2e-spec.ts">
 
 </code-example>
 
@@ -433,7 +433,7 @@ Tests click buttons of both the parent `MissionControlComponent` and the `Astron
 and verify that the history meets expectations:
 
 
-<code-example path="component-interaction/e2e/app.e2e-spec.ts" region="bidirectional-service" title="component-interaction/e2e/app.e2e-spec.ts">
+<code-example path="component-interaction/e2e/src/app.e2e-spec.ts" region="bidirectional-service" title="component-interaction/e2e/src/app.e2e-spec.ts">
 
 </code-example>
 

aio/content/guide/elements.md

@@ -109,12 +109,14 @@ The recently-developed [custom elements](https://developer.mozilla.org/en-US/doc
 <tr>
   <td>Edge</td>
   <td>Working on an implementation. <br>    
- Use the <a href="https://cli.angular.io/" target="_blanks">CLI</a> to automatically set up your project with the correct polyfill: <code>ng add @angular/elements</code>.
+
   </td>
 </tr>
 </table>
-  
 
+In browsers that support Custom Elements natively, the specification requires developers use ES2015 classes to define Custom Elements - developers can opt-in to this by setting the `target: "es2015"` property in their project's `tsconfig.json`. As Custom Element and ES2015 support may not be available in all browsers, developers can instead choose to use a polyfill to support older browsers and ES5 code.
+
+Use the [Angular CLI](https://cli.angular.io/) to automatically set up your project with the correct polyfill: `ng add @angular/elements --name=*your_project_name*`.
 - For more information about polyfills, see [polyfill documentation](https://www.webcomponents.org/polyfills). 
 
 - For more information about Angular browser support, see [Browser Support](guide/browser-support).

aio/content/guide/quickstart.md

@@ -206,14 +206,17 @@ Any files outside of this folder are meant to support building your app.
       <div class="file">environment.prod.ts</div>
       <div class="file">environment.ts</div>
     </div>
+    <div class="file">browserslist</div>
     <div class="file">favicon.ico</div>
     <div class="file">index.html</div>
+    <div class="file">karma.conf.js</div>
     <div class="file">main.ts</div>
     <div class="file">polyfills.ts</div>
     <div class="file">styles.css</div>
     <div class="file">test.ts</div>
     <div class="file">tsconfig.app.json</div>
     <div class="file">tsconfig.spec.json</div>
+    <div class="file">tslint.json</div>
   </div>
 </div>
 
@@ -297,6 +300,18 @@ Any files outside of this folder are meant to support building your app.
 
     </td>
   </tr>
+  <tr>
+    <td>
+
+      `browserslist`
+
+    </td>
+    <td>
+
+      A configuration file to share [target browsers](https://github.com/browserslist/browserslist) between different front-end tools.
+
+    </td>
+  </tr>  
   <tr>
     <td>
 
@@ -325,6 +340,19 @@ Any files outside of this folder are meant to support building your app.
 
     </td>
   </tr>
+  <tr>
+    <td>
+
+      `karma.conf.js`
+
+    </td>
+    <td>
+
+      Unit test configuration for the [Karma test runner](https://karma-runner.github.io),
+      used when running `ng test`.
+
+    </td>
+  </tr>  
   <tr>
     <td>
 
@@ -395,6 +423,20 @@ Any files outside of this folder are meant to support building your app.
 
     </td>
   </tr>
+  <tr>
+    <td>
+
+      `tslint.json`
+
+    </td>
+    <td>
+
+      Additional Linting configuration for [TSLint](https://palantir.github.io/tslint/) together with
+      [Codelyzer](http://codelyzer.com/), used when running `ng lint`.
+      Linting helps keep your code style consistent.
+
+    </td>
+  </tr>  
 </table>
 
 ### The root folder
@@ -409,18 +451,23 @@ These files go in the root folder next to `src/`.
   <div class='children'>
     <div class="file">e2e</div>
     <div class='children'>
-      <div class="file">app.e2e-spec.ts</div>
-      <div class="file">app.po.ts</div>
+      <div class="file">src</div>
+      <div class='children'>
+        <div class="file">app.e2e-spec.ts</div>
+        <div class="file">app.po.ts</div>
+      </div>      
       <div class="file">tsconfig.e2e.json</div>
+      <div class="file">protractor.conf.js</div>
     </div>
     <div class="file">node_modules/...</div>
     <div class="file">src/...</div>
-    <div class="file">.angular-cli.json</div>
+    <div class='children'>
+      <div class="file">karma.conf.js</div>
+    </div>    
     <div class="file">.editorconfig</div>
     <div class="file">.gitignore</div>
-    <div class="file">karma.conf.js</div>
+    <div class="file">angular.json</div>
     <div class="file">package.json</div>
-    <div class="file">protractor.conf.js</div>
     <div class="file">README.md</div>
     <div class="file">tsconfig.json</div>
     <div class="file">tslint.json</div>
@@ -473,21 +520,6 @@ These files go in the root folder next to `src/`.
       `package.json` inside of it.
     </td>
   </tr>
-  <tr>
-    <td>
-
-      `.angular-cli.json`
-
-    </td>
-    <td>
-
-      Configuration for Angular CLI.
-      In this file you can set several defaults and also configure what files are included
-      when your project is built.
-      Check out the official documentation if you want to know more.
-
-    </td>
-  </tr>
   <tr>
     <td>
 
@@ -518,13 +550,15 @@ These files go in the root folder next to `src/`.
   <tr>
     <td>
 
-      `karma.conf.js`
+      `angular.json`
 
     </td>
     <td>
 
-      Unit test configuration for the [Karma test runner](https://karma-runner.github.io),
-      used when running `ng test`.
+      Configuration for Angular CLI.
+      In this file you can set several defaults and also configure what files are included
+      when your project is built.
+      Check out the official documentation if you want to know more.
 
     </td>
   </tr>

aio/content/guide/service-worker-config.md

@@ -1,5 +1,3 @@
-{@a glob}
-
 # Service worker configuration
 
 #### Prerequisites
@@ -9,9 +7,9 @@ A basic understanding of the following:
 
 <hr />
 
-The `src/ngsw-config.json` configuration file specifies which files and data URLs the Angular 
-service worker should cache and how it should update the cached files and data. The 
-CLI processes the configuration file during `ng build --prod`. Manually, you can process 
+The `src/ngsw-config.json` configuration file specifies which files and data URLs the Angular
+service worker should cache and how it should update the cached files and data. The
+CLI processes the configuration file during `ng build --prod`. Manually, you can process
 it with the `ngsw-config` tool:
 
 ```sh
@@ -20,10 +18,11 @@ ngsw-config dist src/ngsw-config.json /base/href
 
 The configuration file uses the JSON format. All file paths must begin with `/`, which is the deployment directory&mdash;usually `dist` in CLI projects.
 
-Patterns use a limited glob format:
+{@a glob-patterns}
+Unless otherwise noted, patterns use a limited glob format:
 
 * `**` matches 0 or more path segments.
-* `*` matches exactly one path segment or filename segment.
+* `*` matches 0 or more characters excluding `/`.
 * The `!` prefix marks the pattern as being negative, meaning that only files that don't match the pattern will be included.
 
 Example patterns:
@@ -32,13 +31,14 @@ Example patterns:
 * `/*.html` specifies only HTML files in the root.
 * `!/**/*.map` exclude all sourcemaps.
 
-Each section of the configuration file is described below. 
+Each section of the configuration file is described below.
 
 ## `appData`
 
 This section enables you to pass any data you want that describes this particular version of the app.
 The `SwUpdate` service includes that data in the update notifications. Many apps use this section to provide additional information for the display of UI popups, notifying users of the available update.
 
+{@a index-file}
 ## `index`
 
 Specifies the file that serves as the index page to satisfy navigation requests. Usually this is `/index.html`.
@@ -92,7 +92,7 @@ The `installMode` determines how these resources are initially cached. The `inst
 
 For resources already in the cache, the `updateMode` determines the caching behavior when a new version of the app is discovered. Any resources in the group that have changed since the previous version are updated in accordance with `updateMode`.
 
-* `prefetch` tells the service worker to download and cache the changed resources immediately. 
+* `prefetch` tells the service worker to download and cache the changed resources immediately.
 
 * `lazy` tells the service worker to not cache those resources. Instead, it treats them as unrequested and waits until they're requested again before updating them. An `updateMode` of `lazy` is only valid if the `installMode` is also `lazy`.
 
@@ -104,7 +104,8 @@ This section describes the resources to cache, broken up into three groups.
 
 * `versionedFiles` is like `files` but should be used for build artifacts that already include a hash in the filename, which is used for cache busting. The Angular service worker can optimize some aspects of its operation if it can assume file contents are immutable.
 
-* `urls` includes both URLs and URL patterns that will be matched at runtime. These resources are not fetched directly and do not have content hashes, but they will be cached according to their HTTP headers. This is most useful for CDNs such as the Google Fonts service.
+* `urls` includes both URLs and URL patterns that will be matched at runtime. These resources are not fetched directly and do not have content hashes, but they will be cached according to their HTTP headers. This is most useful for CDNs such as the Google Fonts service.<br>
+  _(Negative glob patterns are not supported.)_
 
 ## `dataGroups`
 
@@ -130,12 +131,13 @@ export interface DataGroup {
 Similar to `assetGroups`, every data group has a `name` which uniquely identifies it.
 
 ### `urls`
-A list of URL patterns. URLs that match these patterns will be cached according to this data group's policy.
+A list of URL patterns. URLs that match these patterns will be cached according to this data group's policy.<br>
+  _(Negative glob patterns are not supported.)_
 
 ### `version`
 Occasionally APIs change formats in a way that is not backward-compatible. A new version of the app may not be compatible with the old API format and thus may not be compatible with existing cached resources from that API.
 
-`version` provides a mechanism to indicate that the resources being cached have been updated in a backwards-incompatible way, and that the old cache entries&mdash;those from previous versions&mdash;should be discarded. 
+`version` provides a mechanism to indicate that the resources being cached have been updated in a backwards-incompatible way, and that the old cache entries&mdash;those from previous versions&mdash;should be discarded.
 
 `version` is an integer field and defaults to `0`.
 
@@ -167,3 +169,38 @@ The Angular service worker can use either of two caching strategies for data res
 
 * `freshness` optimizes for currency of data, preferentially fetching requested data from the network. Only if the network times out, according to `timeout`, does the request fall back to the cache. This is useful for resources that change frequently; for example, account balances.
 
+## `navigationUrls`
+
+This optional section enables you to specify a custom list of URLs that will be redirected to the index file.
+
+### Handling navigation requests
+
+The ServiceWorker will redirect navigation requests that don't match any `asset` or `data` group to the specified [index file](#index-file). A request is considered to be a navigation request if:
+
+1. Its [mode](https://developer.mozilla.org/en-US/docs/Web/API/Request/mode) is `navigation`.
+2. It accepts a `text/html` response (as determined by the value of the `Accept` header).
+3. Its URL matches certain criteria (see below).
+
+By default, these criteria are:
+
+1. The URL must not contain a file extension (i.e. a `.`) in the last path segment.
+2. The URL must not contain `__`.
+
+### Matching navigation request URLs
+
+While these default criteria are fine in most cases, it is sometimes desirable to configure different rules. For example, you may want to ignore specific routes (that are not part of the Angular app) and pass them through to the server.
+
+This field contains an array of URLs and [glob-like](#glob-patterns) URL patterns that will be matched at runtime. It can contain both negative patterns (i.e. patterns starting with `!`) and non-negative patterns and URLs.
+
+Only requests whose URLs match _any_ of the non-negative URLs/patterns and _none_ of the negative ones will be considered navigation requests. The URL query will be ignored when matching.
+
+If the field is omitted, it defaults to:
+
+```ts
+[
+  '/**',           // Include all URLs.
+  '!/**/*.*',      // Exclude URLs to files.
+  '!/**/*__*',     // Exclude URLs containing `__` in the last segment.
+  '!/**/*__*/**',  // Exclude URLs containing `__` in any other segment.
+]
+```

aio/content/guide/service-worker-devops.md

@@ -21,20 +21,20 @@ In the context of an Angular service worker, a "version" is a collection of reso
 
 To preserve app integrity, the Angular service worker groups all files into a version together. The files grouped into a version usually include HTML, JS, and CSS files. Grouping of these files is essential for integrity because HTML, JS, and CSS files frequently refer to each other and depend on specific content. For example, an `index.html` file might have a `<script>` tag that references `bundle.js` and it might attempt to call a function `startApp()` from within that script. Any time this version of `index.html` is served, the corresponding `bundle.js` must be served with it. For example, assume that the `startApp()` function is renamed to `runApp()` in both files. In this scenario, it is not valid to serve the old `index.html`, which calls `startApp()`, along with the new bundle, which defines `runApp()`.
 
-This file integrity is especially important when lazy loading modules. 
-A JS bundle may reference many lazy chunks, and the filenames of the 
-lazy chunks are unique to the particular build of the app. If a running 
-app at version `X` attempts to load a lazy chunk, but the server has 
+This file integrity is especially important when lazy loading modules.
+A JS bundle may reference many lazy chunks, and the filenames of the
+lazy chunks are unique to the particular build of the app. If a running
+app at version `X` attempts to load a lazy chunk, but the server has
 updated to version `X + 1` already, the lazy loading operation will fail.
 
-The version identifier of the app is determined by the contents of all 
-resources, and it changes if any of them change. In practice, the version 
-is determined by the contents of the `ngsw.json` file, which includes 
-hashes for all known content. If any of the cached files change, the file's 
-hash will change in `ngsw.json`, causing the Angular service worker to 
-treat the active set of files as a new version. 
+The version identifier of the app is determined by the contents of all
+resources, and it changes if any of them change. In practice, the version
+is determined by the contents of the `ngsw.json` file, which includes
+hashes for all known content. If any of the cached files change, the file's
+hash will change in `ngsw.json`, causing the Angular service worker to
+treat the active set of files as a new version.
 
-With the versioning behavior of the Angular service worker, an application 
+With the versioning behavior of the Angular service worker, an application
 server can ensure that the Angular app always has a consistent set of files.
 
 #### Update checks
@@ -46,25 +46,25 @@ the next time the application is loaded.
 
 ### Resource integrity
 
-One of the potential side effects of long caching is inadvertently 
-caching an invalid resource. In a normal HTTP cache, a hard refresh 
-or cache expiration limits the negative effects of caching an invalid 
-file. A service worker ignores such constraints and effectively long 
-caches the entire app. Consequently, it is essential that the service worker 
-get the correct content.
+One of the potential side effects of long caching is inadvertently
+caching an invalid resource. In a normal HTTP cache, a hard refresh
+or cache expiration limits the negative effects of caching an invalid
+file. A service worker ignores such constraints and effectively long
+caches the entire app. Consequently, it is essential that the service worker
+gets the correct content.
 
-To ensure resource integrity, the Angular service worker validates 
-the hashes of all resources for which it has a hash. Typically for 
-a CLI app, this is everything in the `dist` directory covered by 
+To ensure resource integrity, the Angular service worker validates
+the hashes of all resources for which it has a hash. Typically for
+a CLI app, this is everything in the `dist` directory covered by
 the user's `src/ngsw-config.json` configuration.
 
-If a particular file fails validation, the Angular service worker 
-attempts to re-fetch the content using a "cache-busting" URL 
-parameter to eliminate the effects of browser or intermediate 
-caching. If that content also fails validation, the service worker 
-considers the entire version of the app to be invalid and it stops 
-serving the app. If necessary, the service worker enters a safe mode 
-where requests fall back on the network, opting not to use its cache 
+If a particular file fails validation, the Angular service worker
+attempts to re-fetch the content using a "cache-busting" URL
+parameter to eliminate the effects of browser or intermediate
+caching. If that content also fails validation, the service worker
+considers the entire version of the app to be invalid and it stops
+serving the app. If necessary, the service worker enters a safe mode
+where requests fall back on the network, opting not to use its cache
 if the risk of serving invalid, broken, or outdated content is high.
 
 Hash mismatches can occur for a variety of reasons:
@@ -75,57 +75,57 @@ Hash mismatches can occur for a variety of reasons:
 
 #### Unhashed content
 
-The only resources that have hashes in the `ngsw.json` 
-manifest are resources that were present in the `dist` 
-directory at the time the manifest was built. Other 
-resources, especially those loaded from CDNs, have 
-content that is unknown at build time or are updated 
+The only resources that have hashes in the `ngsw.json`
+manifest are resources that were present in the `dist`
+directory at the time the manifest was built. Other
+resources, especially those loaded from CDNs, have
+content that is unknown at build time or are updated
 more frequently than the app is deployed.
 
-If the Angular service worker does not have a hash to validate 
-a given resource, it still caches its contents but it honors 
-the HTTP caching headers by using a policy of "stale while 
-revalidate." That is, when HTTP caching headers for a cached 
-resource indicate that the resource has expired, the Angular 
-service worker continues to serve the content and it attempts 
-to refresh the resource in the background. This way, broken 
-unhashed resources do not remain in the cache beyond their 
+If the Angular service worker does not have a hash to validate
+a given resource, it still caches its contents but it honors
+the HTTP caching headers by using a policy of "stale while
+revalidate." That is, when HTTP caching headers for a cached
+resource indicate that the resource has expired, the Angular
+service worker continues to serve the content and it attempts
+to refresh the resource in the background. This way, broken
+unhashed resources do not remain in the cache beyond their
 configured lifetimes.
 
 {@a tabs}
 
 ### App tabs
 
-It can be problematic for an app if the version of resources 
-it's receiving changes suddenly or without warning. See the 
-[Versions](guide/service-worker-devops#versions) section above 
+It can be problematic for an app if the version of resources
+it's receiving changes suddenly or without warning. See the
+[Versions](guide/service-worker-devops#versions) section above
 for a description of such issues.
 
-The Angular service worker provides a guarantee: a running app 
-will continue to run the same version of the app. If another 
-instance of the app is opened in a new web browser tab, then 
-the most current version of the app is served. As a result, 
-that new tab can be running a different version of the app 
+The Angular service worker provides a guarantee: a running app
+will continue to run the same version of the app. If another
+instance of the app is opened in a new web browser tab, then
+the most current version of the app is served. As a result,
+that new tab can be running a different version of the app
 than the original tab.
 
-It's important to note that this guarantee is **stronger** 
-than that provided by the normal web deployment model. Without 
-a service worker, there is no guarantee that code lazily loaded 
-later in a running app is from the same version as the initial 
+It's important to note that this guarantee is **stronger**
+than that provided by the normal web deployment model. Without
+a service worker, there is no guarantee that code lazily loaded
+later in a running app is from the same version as the initial
 code for the app.
 
-There are a few limited reasons why the Angular service worker 
-might change the version of a running app. Some of them are 
+There are a few limited reasons why the Angular service worker
+might change the version of a running app. Some of them are
 error conditions:
 
 * The current version becomes invalid due to a failed hash.
 * An unrelated error causes the service worker to enter safe mode; that is, temporary deactivation.
 
-The Angular service worker is aware of which versions are in 
-use at any given moment and it cleans up versions when 
+The Angular service worker is aware of which versions are in
+use at any given moment and it cleans up versions when
 no tab is using them.
 
-Other reasons the Angular service worker might change the version 
+Other reasons the Angular service worker might change the version
 of a running app are normal events:
 
 * The page is reloaded/refreshed.
@@ -133,33 +133,33 @@ of a running app are normal events:
 
 ### Service worker updates
 
-The Angular service worker is a small script that runs in web browsers. 
-From time to time, the service worker will be updated with bug 
-fixes and feature improvements. 
+The Angular service worker is a small script that runs in web browsers.
+From time to time, the service worker will be updated with bug
+fixes and feature improvements.
 
-The Angular service worker is downloaded when the app is first opened 
-and when the app is accessed after a period of inactivity. If the 
-service worker has changed, the service worker will be updated in the background.  
+The Angular service worker is downloaded when the app is first opened
+and when the app is accessed after a period of inactivity. If the
+service worker has changed, the service worker will be updated in the background.
 
-Most updates to the Angular service worker are transparent to the 
-app&mdash;the old caches are still valid and content is still served 
-normally. However, occasionally a bugfix or feature in the Angular 
-service worker requires the invalidation of old caches. In this case, 
+Most updates to the Angular service worker are transparent to the
+app&mdash;the old caches are still valid and content is still served
+normally. However, occasionally a bugfix or feature in the Angular
+service worker requires the invalidation of old caches. In this case,
 the app will be refreshed transparently from the network.
 
 
 ## Debugging the Angular service worker
 
-Occasionally, it may be necessary to examine the Angular service 
-worker in a running state to investigate issues or to ensure that 
-it is operating as designed. Browsers provide built-in tools for 
-debugging service workers and the Angular service worker itself 
+Occasionally, it may be necessary to examine the Angular service
+worker in a running state to investigate issues or to ensure that
+it is operating as designed. Browsers provide built-in tools for
+debugging service workers and the Angular service worker itself
 includes useful debugging features.
 
 ### Locating and analyzing debugging information
 
-The Angular service worker exposes debugging information under 
-the `ngsw/` virtual directory. Currently, the single exposed URL 
+The Angular service worker exposes debugging information under
+the `ngsw/` virtual directory. Currently, the single exposed URL
 is `ngsw/state`. Here is an example of this debug page's contents:
 
 ```
@@ -184,27 +184,27 @@ Debug log:
 
 #### Driver state
 
-The first line indicates the driver state: 
+The first line indicates the driver state:
 
 ```
 Driver state: NORMAL ((nominal))
 ```
 
-`NORMAL` indicates that the service worker is operating normally and is not in a degraded state. 
+`NORMAL` indicates that the service worker is operating normally and is not in a degraded state.
 
 There are two possible degraded states:
 
-* `EXISTING_CLIENTS_ONLY`: the service worker does not have a 
-clean copy of the latest known version of the app. Older cached 
-versions are safe to use, so existing tabs continue to run from 
+* `EXISTING_CLIENTS_ONLY`: the service worker does not have a
+clean copy of the latest known version of the app. Older cached
+versions are safe to use, so existing tabs continue to run from
 cache, but new loads of the app will be served from the network.
 
-* `SAFE_MODE`: the service worker cannot guarantee the safety of 
-using cached data. Either an unexpected error occurred or all 
-cached versions are invalid. All traffic will be served from the 
+* `SAFE_MODE`: the service worker cannot guarantee the safety of
+using cached data. Either an unexpected error occurred or all
+cached versions are invalid. All traffic will be served from the
 network, running as little service worker code as possible.
 
-In both cases, the parenthetical annotation provides the 
+In both cases, the parenthetical annotation provides the
 error that caused the service worker to enter the degraded state.
 
 
@@ -223,7 +223,7 @@ This is the SHA1 hash of the most up-to-date version of the app that the service
 Last update check: never
 ```
 
-This indicates the last time the service worker checked for a new version, or update, of the app. `never` indicates that the service worker has never checked for an update. 
+This indicates the last time the service worker checked for a new version, or update, of the app. `never` indicates that the service worker has never checked for an update.
 
 In this example debug file, the update check is currently scheduled, as explained the next section.
 
@@ -235,10 +235,10 @@ In this example debug file, the update check is currently scheduled, as explaine
 Clients: 7b79a015-69af-4d3d-9ae6-95ba90c79486, 5bc08295-aaf2-42f3-a4cc-9e4ef9100f65
 ```
 
-In this example, the service worker has one version of the app cached and 
-being used to serve two different tabs. Note that this version hash 
-is the "latest manifest hash" listed above. Both clients are on the 
-latest version. Each client is listed by its ID from the `Clients` 
+In this example, the service worker has one version of the app cached and
+being used to serve two different tabs. Note that this version hash
+is the "latest manifest hash" listed above. Both clients are on the
+latest version. Each client is listed by its ID from the `Clients`
 API in the browser.
 
 
@@ -252,16 +252,16 @@ Task queue:
  * init post-load (update, cleanup)
 ```
 
-The Idle Task Queue is the queue of all pending tasks that happen 
-in the background in the service worker. If there are any tasks 
-in the queue, they are listed with a description. In this example, 
-the service worker has one such task scheduled, a post-initialization 
+The Idle Task Queue is the queue of all pending tasks that happen
+in the background in the service worker. If there are any tasks
+in the queue, they are listed with a description. In this example,
+the service worker has one such task scheduled, a post-initialization
 operation involving an update check and cleanup of stale caches.
 
-The last update tick/run counters give the time since specific 
-events happened related to the idle queue. The "Last update run" 
-counter shows the last time idle tasks were actually executed. 
-"Last update tick" shows the time since the last event after 
+The last update tick/run counters give the time since specific
+events happened related to the idle queue. The "Last update run"
+counter shows the last time idle tasks were actually executed.
+"Last update tick" shows the time since the last event after
 which the queue might be processed.
 
 
@@ -276,34 +276,34 @@ Errors that occur within the service worker will be logged here.
 
 ### Developer Tools
 
-Browsers such as Chrome provide developer tools for interacting 
-with service workers. Such tools can be powerful when used properly, 
+Browsers such as Chrome provide developer tools for interacting
+with service workers. Such tools can be powerful when used properly,
 but there are a few things to keep in mind.
 
-* When using developer tools, the service worker is kept running 
+* When using developer tools, the service worker is kept running
 in the background and never restarts. This can cause behavior with Dev
 Tools open to differ from behavior a user might experience.
 
-* If you look in the Cache Storage viewer, the cache is frequently 
+* If you look in the Cache Storage viewer, the cache is frequently
 out of date. Right click the Cache Storage title and refresh the caches.
 
-Stopping and starting the service worker in the Service Worker 
+Stopping and starting the service worker in the Service Worker
 pane triggers a check for updates.
 
 ## Service Worker Safety
 
-Like any complex system, bugs or broken configurations can cause 
-the Angular service worker to act in unforeseen ways. While its 
-design attempts to minimize the impact of such problems, the 
-Angular service worker contains several failsafe mechanisms in case 
+Like any complex system, bugs or broken configurations can cause
+the Angular service worker to act in unforeseen ways. While its
+design attempts to minimize the impact of such problems, the
+Angular service worker contains several failsafe mechanisms in case
 an administrator ever needs to deactivate the service worker quickly.
 
-## Fail-safe
+### Fail-safe
 
-To deactivate the service worker, remove or rename the 
-`ngsw-config.json` file. When the service worker's request 
-for `ngsw.json` returns a `404`, then the service worker 
-removes all of its caches and de-registers itself, 
+To deactivate the service worker, remove or rename the
+`ngsw-config.json` file. When the service worker's request
+for `ngsw.json` returns a `404`, then the service worker
+removes all of its caches and de-registers itself,
 essentially self-destructing.
 
 ### Safety Worker

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

@@ -1,87 +1,35 @@
 # Getting started with service workers
 
+
+This document explains how to enable Angular service worker support in your CLI projects. It then uses a simple example to show you a service worker in action, demonstrating loading and basic caching. 
+
 #### Prerequisites
 
 A basic understanding of the following:
 * [Introduction to Angular service workers](guide/service-worker-intro).
+* Angular v6, including Angular CLI v6.
 
 <hr />
 
 
-Beginning in Angular 5.0.0, you can easily enable Angular service worker support in any CLI project. This document explains how to enable Angular service worker support in new and existing projects. It then uses a simple example to show you a service worker in action, demonstrating loading and basic caching.  
+## Adding a service worker to your project
 
-## Adding a service worker to a new application
-
-If you're generating a new CLI project, you can use the CLI to set up the Angular service worker as part of creating the project. To do so, add the `--service-worker` flag to the `ng new`  command:
+To set up the Angular service worker in your project, use the CLI command `ng add @angular/pwa`. It takes care of configuring your app to use service workers by adding the `service-worker` package along 
+with setting up the necessary support files.
 
 ```sh
-ng new my-project --service-worker 
+ng add  @angular/pwa --project *project-name* 
 ```
 
-The `--service-worker` flag takes care of configuring your app to 
-use service workers by adding the `service-worker` package along 
-with setting up the necessary files to support service workers. 
-For information on the details, see the following section 
-which covers the process in detail as it shows you how to add a 
-service worker manually to an existing app.
+The above command completes the following actions:
+
+1. Adds the `@angular/service-worker` package. 
+2. Enables service worker build support in the CLI.
+3. Imports and registers the service worker in the app module.
+4. Creates the service worker configuration file called `ngsw-config.json` which specifies the caching behaviors and other settings. 
 
 
-
-## Adding a service worker to an existing app
-
-To add a service worker to an existing app:
-
-1. Add the service worker package.
-2. Enable service worker build support in the CLI.
-3. Import and register the service worker.
-4. Create the service worker configuration file, which specifies the caching behaviors and other settings. 
-5. Build the project.
-
-### Step 1: Add the service worker package
-
-Add the package `@angular/service-worker`, using the yarn utility as shown here:
-
-```sh
-yarn add @angular/service-worker
-```
-
-### Step 2: Enable service worker build support in the CLI
-
-To enable the Angular service worker, the CLI must generate an Angular service worker manifest at build time. To cause the CLI to generate the manifest for an existing project, set the `serviceWorker` flag to `true` in the project's `.angular-cli.json` file as shown here:
-
-```sh
-ng set apps.0.serviceWorker=true
-```
-
-### Step 3: Import and register the service worker
-
-To import and register the Angular service worker:
-
-At the top of the root module, `src/app/app.module.ts`, import `ServiceWorkerModule` and `environment`.
-
-<code-example path="service-worker-getting-started/src/app/app.module.ts" linenums="false" title="src/app/app.module.ts" region="sw-import"> </code-example>
-
-
-Add `ServiceWorkerModule` to the `@NgModule` `imports` array. Use the `register()` helper to take care of registering the service worker, taking care to disable the service worker when not running in production mode.
-
-<code-example path="service-worker-getting-started/src/app/app.module.ts" linenums="false" title="src/app/app.module.ts" region="sw-module"> </code-example>
-
-The file `ngsw-worker.js` is the name of the prebuilt service worker script, which the CLI copies into `dist/` to deploy along with your server.
-
-### Step 4: Create the configuration file, `ngsw-config.json`
-
-The Angular CLI needs a service worker configuration file, called `ngsw-config.json`. The configuration file controls how the service worker caches files and data 
-resources.
-
-You can begin with the boilerplate version from the CLI, which configures sensible defaults for most applications.
-
-Alternately, save the following as `src/ngsw-config.json`:
-
-<code-example path="service-worker-getting-started/src/ngsw-config.json" linenums="false" title="src/ngsw-config.json"> </code-example>
-
-### Step 5: Build the project
-
-Finally, build the project: 
+ Now, build the project: 
 
 ```sh
 ng build --prod

aio/content/guide/service-worker-intro.md

@@ -25,17 +25,12 @@ The Angular service worker's behavior follows that design goal:
 * Updates happen in the background, relatively quickly after changes are published. The previous version of the application is served until an update is installed and ready.
 * The service worker conserves bandwidth when possible. Resources are only downloaded if they've changed.
 
-To support these behaviors, the Angular service worker loads a *manifest* file from the server. The manifest describes the resources to cache and includes hashes of every file's contents. When an update to the application is deployed, the contents of the manifest change, informing the service worker that a new version of the application should be downloaded and cached. This manifest is generated from a user-provided configuration file called `ngsw-config.json`, by using a build tool such as the Angular CLI.
+To support these behaviors, the Angular service worker loads a *manifest* file from the server. The manifest describes the resources to cache and includes hashes of every file's contents. When an update to the application is deployed, the contents of the manifest change, informing the service worker that a new version of the application should be downloaded and cached. This manifest is generated from a CLI-generated configuration file called `ngsw-config.json`.
 
 Installing the Angular service worker is as simple as including an `NgModule`. In addition to registering the Angular service worker with the browser, this also makes a few services available for injection which interact with the service worker and can be used to control it. For example, an application can ask to be notified when a new update becomes available, or an application can ask the service worker to check the server for available updates.
 
 ## Prerequisites
 
-To use Angular service workers, you must have the following Angular and CLI versions:
-
-* Angular 5.0.0 or later.
-* Angular CLI 1.6.0 or later.
-
 Your application must run in a web browser that supports service workers. Currently, the latest versions of Chrome and Firefox are supported. To learn about other browsers that are service worker ready, see the [Can I Use](http://caniuse.com/#feat=serviceworkers) page.
 
 ## Related resources

aio/content/marketing/announcements.json

@@ -1,9 +1,16 @@
 [
   {
     "startDate": "2018-02-14",
-    "endDate": "2018-04-22",
+    "endDate": "2018-04-18",
     "message": "Join us for ng-conf<br/>Apr 18th-20th, 2018",
     "imageUrl": "generated/images/marketing/home/ng-conf.png",
     "linkUrl": "http://ng-conf.org/"
+  },
+  {
+    "startDate": "2018-04-18",
+    "endDate": "2018-04-22",
+    "message": "Watch ng-conf live stream <br/>Apr 18th-20th, 2018",
+    "imageUrl": "generated/images/marketing/home/ng-conf.png",
+    "linkUrl": "https://www.ng-conf.org/livestream/"
   }
 ]

aio/content/marketing/resources.json

@@ -574,6 +574,12 @@
             "title": "Learn Angular (francais)",
             "url": "http://www.learn-angular.fr/"
           },
+          "upgrading-ajs": {
+            "desc": "The world's most comprehensive, step-by-step course on using best practices and avoiding pitfalls while migrating from AngularJS to Angular.",
+            "rev": true,
+            "title": "Upgrading AngularJS",
+            "url": "https://www.upgradingangularjs.com"
+          },
           "toddmotto-ultimateangular": {
             "desc": "Online courses providing in-depth coverage of the Angular ecosystem, AngularJS, Angular and TypeScript, with functional code samples and a full-featured seed environment. Get a deep understanding of Angular and TypeScript from foundation to functional application, then move on to advanced topics with Todd Motto and collaborators.",
             "rev": true,

aio/content/navigation.json

@@ -633,6 +633,10 @@
         {
           "title": "中文版",
           "url": "https://angular.cn/"
+        },
+        {
+          "title": "日本語版",
+          "url": "https://angular.jp/"
         }
       ]
     }

aio/content/tutorial/toh-pt3.md

@@ -5,10 +5,10 @@ At the moment, the `HeroesComponent` displays both the list of heroes and the se
 Keeping all features in one component as the application grows will not be maintainable.
 You'll want to split up large components into smaller sub-components, each focused on a specific task or workflow.
 
-In this page, you'll take the first step in that direction by moving the hero details into a separate, reusable `HeroDetailsComponent`.
+In this page, you'll take the first step in that direction by moving the hero details into a separate, reusable `HeroDetailComponent`.
 
 The `HeroesComponent` will only present the list of heroes.
-The `HeroDetailsComponent` will present details of a selected hero.
+The `HeroDetailComponent` will present details of a selected hero.
 
 ## Make the `HeroDetailComponent`
 

aio/content/tutorial/toh-pt4.md

@@ -348,7 +348,7 @@ Open `MessagesComponent` and import the `MessageService`.
 
 Modify the constructor with a parameter that declares a **public** `messageService` property.
 Angular will inject the singleton `MessageService` into that property 
-when it creates the `HeroService`.
+when it creates the `MessagesComponent`.
 
 <code-example
   path="toh-pt4/src/app/messages/messages.component.ts" region="ctor">

aio/content/tutorial/toh-pt6.md

@@ -49,7 +49,7 @@ Install the *In-memory Web API* package from _npm_
   npm install angular-in-memory-web-api --save
 </code-example>
 
-Import the `InMemoryWebApiModule` and the `InMemoryDataService` class, 
+Import the `HttpClientInMemoryWebApiModule` and the `InMemoryDataService` class, 
 which you will create in a moment.
 
 <code-example 
@@ -58,7 +58,7 @@ which you will create in a moment.
   title="src/app/app.module.ts (In-memory Web API imports)">
 </code-example>
 
-Add the `InMemoryWebApiModule` to the `@NgModule.imports` array&mdash;
+Add the `HttpClientInMemoryWebApiModule` to the `@NgModule.imports` array&mdash;
 _after importing the `HttpClient`_,
 &mdash;while configuring it with the `InMemoryDataService`.
 

aio/package.json

@@ -12,7 +12,7 @@
     "aio-use-npm": "node tools/ng-packages-installer restore .",
     "aio-check-local": "node tools/ng-packages-installer check .",
     "ng": "yarn check-env && ng",
-    "start": "yarn check-env && ng serve --aot",
+    "start": "yarn check-env && ng serve",
     "prebuild": "yarn setup",
     "build": "yarn ~~build",
     "prebuild-local": "yarn setup-local",
@@ -21,7 +21,6 @@
     "test": "yarn check-env && ng test",
     "pree2e": "yarn check-env && yarn update-webdriver",
     "e2e": "ng e2e --no-webdriver-update",
-    "e2e-prod": "yarn e2e --environment=dev --target=production",
     "presetup": "yarn install --frozen-lockfile && yarn ~~check-env && yarn boilerplate:remove",
     "setup": "yarn aio-use-npm && yarn example-use-npm",
     "postsetup": "yarn boilerplate:add && yarn build-ie-polyfills && yarn docs",
@@ -45,7 +44,7 @@
     "docs-watch": "node tools/transforms/authors-package/watchr.js",
     "docs-lint": "eslint --ignore-path=\"tools/transforms/.eslintignore\" tools/transforms",
     "docs-test": "node tools/transforms/test.js",
-    "deployment-config-test": "jasmine-ts tests/deployment-config/unit/**/*.spec.ts",
+    "redirects-test": "jasmine-ts tests/deployment/unit/**/*.spec.ts",
     "firebase-utils-test": "jasmine-ts tools/firebase-test-utils/*.spec.ts",
     "tools-lint": "tslint -c \"tools/tslint.json\" \"tools/firebase-test-utils/**/*.ts\"",
     "tools-test": "./scripts/deploy-to-firebase.test.sh && yarn docs-test && yarn boilerplate:test && jasmine tools/ng-packages-installer/index.spec.js && yarn firebase-utils-test",
@@ -58,10 +57,10 @@
     "generate-zips": "node ./tools/example-zipper/generateZips",
     "sw-manifest": "ngu-sw-manifest --dist dist --in ngsw-manifest.json --out dist/ngsw-manifest.json",
     "sw-copy": "cp node_modules/@angular/service-worker/bundles/worker-basic.min.js dist/",
-    "build-ie-polyfills": "node node_modules/webpack/bin/webpack.js -p src/ie-polyfills.js src/generated/ie-polyfills.min.js",
+    "build-ie-polyfills": "yarn webpack-cli src/ie-polyfills.js -o src/generated/ie-polyfills.min.js --mode production",
     "update-webdriver": "webdriver-manager update --standalone false --gecko false $CHROMEDRIVER_VERSION_ARG",
     "~~check-env": "node scripts/check-environment",
-    "~~build": "ng build --target=production --environment=stable -sm",
+    "~~build": "ng build --configuration=stable",
     "post~~build": "yarn sw-manifest && yarn sw-copy"
   },
   "engines": {
@@ -70,34 +69,36 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^6.0.0-rc.1",
-    "@angular/cdk": "^5.0.0-rc.1",
-    "@angular/common": "^6.0.0-rc.1",
-    "@angular/compiler": "^6.0.0-rc.1",
-    "@angular/core": "^6.0.0-rc.1",
-    "@angular/elements": "^6.0.0-rc.1",
-    "@angular/forms": "^6.0.0-rc.1",
-    "@angular/http": "^6.0.0-rc.1",
-    "@angular/material": "^5.0.0-rc.1",
-    "@angular/platform-browser": "^6.0.0-rc.1",
-    "@angular/platform-browser-dynamic": "^6.0.0-rc.1",
-    "@angular/platform-server": "^6.0.0-rc.1",
-    "@angular/router": "^6.0.0-rc.1",
+    "@angular/animations": "6.0.0-rc.5",
+    "@angular/cdk": "6.0.0-rc.11",
+    "@angular/common": "6.0.0-rc.5",
+    "@angular/core": "6.0.0-rc.5",
+    "@angular/elements": "6.0.0-rc.5",
+    "@angular/forms": "6.0.0-rc.5",
+    "@angular/http": "6.0.0-rc.5",
+    "@angular/material": "6.0.0-rc.11",
+    "@angular/platform-browser": "6.0.0-rc.5",
+    "@angular/platform-browser-dynamic": "6.0.0-rc.5",
+    "@angular/platform-server": "6.0.0-rc.5",
+    "@angular/router": "6.0.0-rc.5",
     "@angular/service-worker": "^1.0.0-beta.16",
     "@webcomponents/custom-elements": "^1.0.8",
     "classlist.js": "^1.1.20150312",
     "core-js": "^2.4.1",
     "jasmine": "^2.6.0",
     "ng-pwa-tools": "^0.0.10",
-    "rxjs": "6.0.0-rc.0",
-    "rxjs-compat": "6.0.0-rc.0",
+    "rxjs": "6.0.0-uncanny-rc.7",
+    "rxjs-compat": "6.0.0-uncanny-rc.7",
     "tslib": "^1.9.0",
     "web-animations-js": "^2.2.5",
     "zone.js": "^0.8.26"
   },
   "devDependencies": {
-    "@angular/cli": "^1.7.3",
-    "@angular/compiler-cli": "^6.0.0-rc.1",
+    "@angular-devkit/build-angular": "^0.5.6",
+    "@angular/cli": "^6.0.0-rc.4",
+    "@angular/compiler": "6.0.0-rc.5",
+    "@angular/compiler-cli": "6.0.0-rc.5",
+    "@angular/language-service": "6.0.0-rc.5",
     "@types/jasmine": "^2.5.52",
     "@types/jasminewd2": "^2.0.3",
     "@types/node": "~6.0.60",
@@ -105,7 +106,7 @@
     "canonical-path": "^0.0.2",
     "chalk": "^2.1.0",
     "cjson": "^0.5.0",
-    "codelyzer": "~2.0.0",
+    "codelyzer": "~4.2.1",
     "concurrently": "^3.4.0",
     "cross-spawn": "^5.1.0",
     "css-selector-parser": "^1.3.0",
@@ -146,16 +147,17 @@
     "shelljs": "^0.7.7",
     "tree-kill": "^1.1.0",
     "ts-node": "^3.3.0",
-    "tslint": "~4.5.0",
+    "tslint": "~5.9.1",
     "typescript": "~2.7.2",
     "uglify-js": "^3.0.15",
     "unist-util-filter": "^0.2.1",
     "unist-util-source": "^1.0.1",
     "unist-util-visit": "^1.1.1",
     "unist-util-visit-parents": "^1.1.1",
-    "vrsource-tslint-rules": "^4.0.1",
+    "vrsource-tslint-rules": "^5.8.2",
     "watchr": "^3.0.1",
+    "webpack-cli": "^2.0.14",
     "xregexp": "^4.0.0",
     "yargs": "^7.0.2"
   }
-}
+}

aio/scripts/_payload-limits.json

@@ -2,10 +2,10 @@
   "aio": {
     "master": {
       "uncompressed": {
-        "inline": 1971,
-        "main": 565539,
-        "polyfills": 38514,
-        "prettify": 14886
+        "runtime": 2689,
+        "main": 478529,
+        "polyfills": 38453,
+        "prettify": 14913
       }
     }
   }

aio/scripts/deploy-to-firebase.sh

@@ -20,7 +20,7 @@ fi
 if [[ $TRAVIS_BRANCH == master ]]; then
   readonly deployEnv=next
 elif [[ $TRAVIS_BRANCH == $STABLE_BRANCH ]]; then
-    readonly deployEnv=stable
+  readonly deployEnv=stable
 else
   # Extract the major versions from the branches, e.g. the 4 from 4.3.x
   readonly majorVersion=${TRAVIS_BRANCH%%.*}
@@ -87,7 +87,7 @@ fi
   cd "`dirname $0`/.."
 
   # Build the app
-  yarn build --env=$deployEnv
+  yarn build --configuration=$deployEnv
 
   # Include any mode-specific files
   cp -rf src/extra-files/$deployEnv/. dist/

aio/scripts/test-production.sh

@@ -5,12 +5,11 @@ set +x -eu -o pipefail
   readonly thisDir="$(cd $(dirname ${BASH_SOURCE[0]}); pwd)"
   readonly aioDir="$(realpath $thisDir/..)"
 
-  readonly appPtorConf="$aioDir/tests/e2e/protractor.conf.js"
-  readonly cfgPtorConf="$aioDir/tests/deployment-config/e2e/protractor.conf.js"
+  readonly protractorConf="$aioDir/tests/deployment/e2e/protractor.conf.js"
   readonly minPwaScore="95"
   readonly urls=(
     "https://angular.io/"
-    "https://next.angular.io"
+    "https://next.angular.io/"
   )
 
   cd "$aioDir"
@@ -24,11 +23,8 @@ set +x -eu -o pipefail
   for url in "${urls[@]}"; do
     echo -e "\nChecking '$url'...\n-----"
 
-    # Run e2e tests.
-    yarn protractor "$appPtorConf" --baseUrl "$url"
-
-    # Run deployment config tests.
-    yarn protractor "$cfgPtorConf" --baseUrl "$url"
+    # Run basic e2e and deployment config tests.
+    yarn protractor "$protractorConf" --baseUrl "$url"
 
     # Run PWA-score tests.
     yarn test-pwa-score "$url" "$minPwaScore"

aio/src/app/app.component.html

@@ -34,7 +34,7 @@
 
 <mat-sidenav-container class="sidenav-container" [class.starting]="isStarting" [class.has-floating-toc]="hasFloatingToc" role="main">
 
-  <mat-sidenav [ngClass]="{'collapsed': !isSideBySide}" #sidenav class="sidenav" [opened]="isOpened" [mode]="mode" (open)="updateHostClasses()" (close)="updateHostClasses()">
+  <mat-sidenav [ngClass]="{'collapsed': !isSideBySide}" #sidenav class="sidenav" [mode]="mode" [opened]="isOpened" (openedChange)="updateHostClasses()">
     <aio-nav-menu *ngIf="!isSideBySide" [nodes]="topMenuNarrowNodes" [currentNode]="currentNodes?.TopBarNarrow" [isWide]="false"></aio-nav-menu>
     <aio-nav-menu [nodes]="sideNavNodes" [currentNode]="currentNodes?.SideNav" [isWide]="isSideBySide"></aio-nav-menu>
 

aio/src/app/app.component.spec.ts

@@ -6,8 +6,8 @@ import { HttpClient } from '@angular/common/http';
 import { MatProgressBar, MatSidenav } from '@angular/material';
 import { By } from '@angular/platform-browser';
 
-import { Observable, timer } from 'rxjs';
-import { mapTo } from 'rxjs/operators';
+import { timer } from 'rxjs';
+import { first, mapTo } from 'rxjs/operators';
 
 import { AppComponent } from './app.component';
 import { AppModule } from './app.module';
@@ -64,13 +64,13 @@ describe('AppComponent', () => {
     const de = fixture.debugElement;
     const docViewerDe = de.query(By.css('aio-doc-viewer'));
 
-    documentService = de.injector.get(DocumentService) as DocumentService;
+    documentService = de.injector.get<DocumentService>(DocumentService);
     docViewer = docViewerDe.nativeElement;
     docViewerComponent = docViewerDe.componentInstance;
     hamburger = de.query(By.css('.hamburger')).nativeElement;
-    locationService = de.injector.get(LocationService) as any;
+    locationService = de.injector.get<any>(LocationService);
     sidenav = de.query(By.directive(MatSidenav)).componentInstance;
-    tocService = de.injector.get(TocService);
+    tocService = de.injector.get<TocService>(TocService);
 
     return waitForDoc && awaitDocRendered();
   };
@@ -463,7 +463,7 @@ describe('AppComponent', () => {
       let scrollToTopSpy: jasmine.Spy;
 
       beforeEach(() => {
-        scrollService = fixture.debugElement.injector.get(ScrollService);
+        scrollService = fixture.debugElement.injector.get<ScrollService>(ScrollService);
         scrollSpy = spyOn(scrollService, 'scroll');
         scrollToTopSpy = spyOn(scrollService, 'scrollToTop');
       });
@@ -1114,20 +1114,23 @@ describe('AppComponent', () => {
         checkHostClass('sidenav', 'open');
 
         sidenav.close();
-        await waitForEmit(sidenav.onClose);
+        await waitForSidenavOpenedChange();
         fixture.detectChanges();
         checkHostClass('sidenav', 'closed');
 
         sidenav.open();
-        await waitForEmit(sidenav.onOpen);
+        await waitForSidenavOpenedChange();
         fixture.detectChanges();
         checkHostClass('sidenav', 'open');
 
-        function waitForEmit(emitter: Observable<void>): Promise<void> {
-          return new Promise(resolve => {
-            emitter.subscribe(resolve);
-            fixture.detectChanges();
-          });
+        async function waitForSidenavOpenedChange() {
+          const promise = new Promise(resolve => sidenav.openedChange.pipe(first()).subscribe(resolve));
+
+          await Promise.resolve();  // Wait for `MatSidenav.openedChange.emit()` to be called.
+          jasmine.clock().tick(0);  // Notify `MatSidenav.openedChange` observers.
+                                    // (It is an async `EventEmitter`, thus uses `setTimeout()`.)
+
+          await promise;
         }
       });
 

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

@@ -97,11 +97,11 @@ describe('ApiListComponent', () => {
     });
   });
 
-  describe('initial critera from location', () => {
+  describe('initial criteria from location', () => {
     let locationService: TestLocationService;
 
     beforeEach(() => {
-      locationService = <any> fixture.componentRef.injector.get(LocationService);
+      locationService = fixture.componentRef.injector.get<any>(LocationService);
     });
 
     function expectOneItem(name: string, section: string, type: string, stability: string) {
@@ -110,7 +110,7 @@ describe('ApiListComponent', () => {
       component.filteredSections.subscribe(filtered => {
         expect(filtered.length).toBe(1, 'sections');
         expect(filtered[0].name).toBe(section, 'section name');
-        const items = filtered[0].items.filter(item => item.show);
+        const items = filtered[0].items.filter(i => i.show);
         expect(items.length).toBe(1, 'items');
 
         const item = items[0];
@@ -168,7 +168,7 @@ describe('ApiListComponent', () => {
     let locationService: TestLocationService;
 
     beforeEach(() => {
-      locationService = <any> fixture.componentRef.injector.get(LocationService);
+      locationService = fixture.componentRef.injector.get<any>(LocationService);
     });
 
     it('should have query', () => {

aio/src/app/custom-elements/api/api-list.component.ts

@@ -16,9 +16,9 @@ import { ApiSection, ApiService } from './api.service';
 import { Option } from 'app/shared/select/select.component';
 
 class SearchCriteria {
-  query? = '';
-  status? = 'all';
-  type? = 'all';
+  query ? = '';
+  status ? = 'all';
+  type ? = 'all';
 }
 
 @Component({
@@ -78,7 +78,7 @@ export class ApiListComponent implements OnInit {
     this.initializeSearchCriteria();
   }
 
-  // Todo: may need to debounce as the original did
+  // TODO: may need to debounce as the original did
   // although there shouldn't be any perf consequences if we don't
   setQuery(query: string) {
     this.setSearchCriteria({query: (query || '').toLowerCase().trim() });

aio/src/app/custom-elements/api/api.service.spec.ts

@@ -21,7 +21,7 @@ describe('ApiService', () => {
       ]
     });
 
-    service = injector.get(ApiService);
+    service = injector.get<ApiService>(ApiService);
     httpMock = injector.get(HttpTestingController);
   });
 

aio/src/app/custom-elements/api/api.service.ts

@@ -75,7 +75,7 @@ export class ApiService implements OnDestroy {
       .subscribe(
         sections => this.sectionsSubject.next(sections),
         (err: HttpErrorResponse) => {
-          // Todo: handle error
+          // TODO: handle error
           this.logger.error(err);
           throw err; // rethrow for now.
         }

aio/src/app/custom-elements/code/code-example.component.ts

@@ -15,18 +15,18 @@ import { CodeComponent } from './code.component';
  */
 @Component({
   selector: 'code-example',
-  template: `    
+  template: `
     <!-- Content projection is used to get the content HTML provided to this component -->
     <div #content style="display: none"><ng-content></ng-content></div>
-    
+
     <header *ngIf="title">{{title}}</header>
 
-    <aio-code [ngClass]="classes"  
-              [language]="language" 
-              [linenums]="linenums" 
-              [path]="path" 
-              [region]="region"  
-              [hideCopy]="hidecopy" 
+    <aio-code [ngClass]="classes"
+              [language]="language"
+              [linenums]="linenums"
+              [path]="path"
+              [region]="region"
+              [hideCopy]="hidecopy"
               [title]="title">
     </aio-code>
   `,