build: switch example e2e tests to bazel (angular#28402)

* No longer builds the example e2e tests using "tsc". The examples are now built with Bazel and can therefore be built with Ivy by using the `--define=compile=aot` switch.
* No longer runs the example e2e tests using the protractor CLI. example e2e tests are executed with the Bazel protractor rule and can therefore run incrementally.

NOTE: Unit tests found within the examples are still running within the legacy jobs.

PR Close angular#28402

Author: devversion

.circleci/config.yml

@@ -410,7 +410,6 @@ jobs:
       - *define_env_vars
       - *yarn_install
       - run: yarn tsc -p packages
-      - run: yarn tsc -p packages/examples
       - run: yarn tsc -p modules
       - run: yarn karma start ./karma-js.conf.js --single-run --browsers=ChromeNoSandbox
 
@@ -437,7 +436,6 @@ jobs:
           command: ./scripts/saucelabs/start-tunnel.sh
           background: true
       - run: yarn tsc -p packages
-      - run: yarn tsc -p packages/examples
       - run: yarn tsc -p modules
         # Waits for the Saucelabs tunnel to be ready. This ensures that we don't run tests
         # too early without Saucelabs not being ready.
@@ -465,10 +463,9 @@ jobs:
       - run: ./scripts/build-e2e-tests.sh --use-existing-packages-dist
       - run:
           name: Starting servers for e2e tests
-          command: yarn gulp serve serve-examples
+          command: yarn gulp serve
           background: true
       - run: NODE_PATH=$NODE_PATH:./dist/all yarn protractor ./protractor-e2e.conf.js --bundles=true
-      - run: NODE_PATH=$NODE_PATH:./dist/all yarn protractor ./protractor-examples-e2e.conf.js --bundles=true
       - run: NODE_PATH=$NODE_PATH:./dist/all yarn protractor ./protractor-perf.conf.js --bundles=true --dryrun
 
   legacy-misc-tests:

gulpfile.js

@@ -39,7 +39,6 @@ gulp.task('source-map-test', loadTask('source-map-test'));
 gulp.task('tools:build', loadTask('tools-build'));
 gulp.task('check-cycle', loadTask('check-cycle'));
 gulp.task('serve', loadTask('serve', 'default'));
-gulp.task('serve-examples', loadTask('serve', 'examples'));
 gulp.task('changelog', loadTask('changelog'));
 gulp.task('check-env', () => {/* this is a noop because the env test ran already above */});
 gulp.task('cldr:extract', loadTask('cldr', 'extract'));

package.json

@@ -38,12 +38,14 @@
     "@bazel/karma": "~0.22.1",
     "@bazel/typescript": "~0.22.1",
     "@schematics/angular": "^7.0.4",
+    "@types/angular": "^1.6.47",
     "@types/chokidar": "1.7.3",
     "@types/convert-source-map": "^1.5.1",
     "@types/diff": "^3.2.2",
     "@types/fs-extra": "4.0.2",
     "@types/hammerjs": "2.0.35",
     "@types/jasmine": "^2.8.8",
+    "@types/jasminewd2": "^2.0.6",
     "@types/mock-fs": "^3.6.30",
     "@types/node": "^10.9.4",
     "@types/selenium-webdriver": "3.0.7",
@@ -98,9 +100,7 @@
     "@bazel/bazel": "~0.22.0",
     "@bazel/buildifier": "^0.19.2",
     "@bazel/ibazel": "~0.9.0",
-    "@types/angular": "^1.6.47",
     "@types/base64-js": "1.2.5",
-    "@types/jasminewd2": "^2.0.4",
     "@types/minimist": "^1.2.0",
     "@types/systemjs": "0.19.32",
     "browserstacktunnel-wrapper": "2.0.1",

packages/examples/BUILD.bazel

@@ -0,0 +1,4 @@
+exports_files([
+    "index.html",
+    "tsconfig-e2e.json",
+])

packages/examples/README.md

@@ -7,28 +7,15 @@ behavior) just like an Angular application developer would write.
 # Running the examples
 
 ```
-# # execute the following command only when framework code changes
-./build.sh
+# Serving individual examples (e.g. common)
+yarn bazel run //packages/examples/common:devserver
 
-# run when test change
-./packages/examples/build.sh  
-
-# start server
-$(npm bin)/gulp serve-examples
+# "core" examples
+yarn bazel run //packages/examples/core:devserver
 ```
 
-navigate to [http://localhost:8001](http://localhost:8001)
-
 # Running the tests
 
 ```
- # run only when framework code changes
-./build.sh
-
-# run to compile tests and run them
-./packages/examples/test.sh
-```
-
-NOTE: sometimes the http server does not exit properly and it retains the `8001` port.
- in such a case you can use `lsof -i:8001` to see which process it is and then use `kill` 
- to remove it. (Or in single command: `lsof -i:8001 -t | xargs kill`)
+yarn bazel test //packages/examples/...
+```