feat(examples): add protractor angular architect (#1594)

.circleci/config.yml

@@ -9,8 +9,8 @@
 
 ## IMPORTANT
 # If you change the `default_docker_image` version, also change the `cache_key` version
-var_1: &default_docker_image circleci/node:10.16
-var_2: &browsers_docker_image circleci/node:10.16-browsers
+var_1: &default_docker_image circleci/node:12.14
+var_2: &browsers_docker_image circleci/node:12.14-browsers
 var_3: &cache_key node-0.16-{{ checksum "yarn.lock" }}-v2
 
 

examples/angular_bazel_architect/BUILD.bazel

@@ -73,6 +73,45 @@ architect_test(
     ],
 )
 
+architect_test(
+    name = "e2e",
+    args = ["frontend:e2e"],
+    configuration_env_vars = ["NG_BUILD_CACHE"],
+    data = glob([
+        "src/*",
+        "src/**",
+        "e2e/*",
+        "e2e/**",
+    ]) + [
+        "angular.json",
+        "browserslist",
+        "tsconfig.app.json",
+        "tsconfig.json",
+        "@npm//mime",
+        "@npm//@angular/cli",
+        "@npm//@angular/core",
+        "@npm//@angular/router",
+        "@npm//@angular/platform-browser-dynamic",
+        "@npm//@angular-devkit/build-angular",
+        "@npm//protractor",
+        "@npm//jasmine-spec-reporter",
+        "@npm//ts-node",
+        "@npm//@types/jasmine",
+        "@npm//@types/jasminewd2",
+        "@npm//@types/node",
+    ],
+    tags = [
+        "browser:chromium-local",
+        # Fails in buildkite with this error
+        # [19:48:16] E/launcher - unknown error: cannot find Chrome binary
+        #   (Driver info: chromedriver=79.0.3945.36 (3582db32b33893869b8c1339e8f4d9ed1816f143-refs/branch-heads/3945@{#614}),platform=Mac OS X 10.15.3 x86_64)
+        # [19:48:16] E/launcher - WebDriverError: unknown error: cannot find Chrome binary
+        #   (Driver info: chromedriver=79.0.3945.36 (3582db32b33893869b8c1339e8f4d9ed1816f143-refs/branch-heads/3945@{#614}),platform=Mac OS X 10.15.3 x86_64)
+        #     at Object.checkLegacyResponse
+        "no-bazelci-mac",
+    ],
+)
+
 # Just a dummy test so that we have a test target for //... on certain bazelci platforms with bazel_integration_test
 sh_test(
     name = "dummy_test",

examples/angular_bazel_architect/e2e/protractor.conf.js

@@ -10,13 +10,34 @@ const {SpecReporter} = require('jasmine-spec-reporter');
 exports.config = {
   allScriptsTimeout: 11000,
   specs: ['./src/**/*.e2e-spec.ts'],
-  capabilities: {'browserName': 'chrome'},
   directConnect: true,
   baseUrl: 'http://localhost:4200/',
   framework: 'jasmine',
   jasmineNodeOpts: {showColors: true, defaultTimeoutInterval: 30000, print: function() {}},
   onPrepare() {
     require('ts-node').register({project: require('path').join(__dirname, './tsconfig.json')});
     jasmine.getEnv().addReporter(new SpecReporter({spec: {displayStacktrace: true}}));
+  },
+  capabilities: {
+    browserName: 'chrome',
+    chromeOptions: {
+      // `--no-sandbox` flag disables the chrome sandbox because it causes Chrome to crash on some
+      // environments
+      // http://chromedriver.chromium.org/help/chrome-doesn-t-start
+      // https://github.com/puppeteer/puppeteer/blob/v1.0.0/docs/troubleshooting.md#chrome-headless-fails-due-to-sandbox-issues
+      // `--headess` flag runs the browser in headless mode
+      // `--disable-gpu` flag disables GPU usage because it causes Chrome to crash on some
+      // environments
+      // `--disable-dev-shm-usage` flag disables the usage of `/dev/shm` because it causes Chrome to
+      // crash on some environments.
+      // https://github.com/puppeteer/puppeteer/blob/v1.0.0/docs/troubleshooting.md#tips
+      // https://stackoverflow.com/questions/50642308/webdriverexception-unknown-error-devtoolsactiveport-file-doesnt-exist-while-t
+      // `--hide-scrollbars` flag comes from puppeteer headless mode defaults
+      // `--mute-audio` flag comes from puppeteer headless mode defaults
+      args: [
+        '--no-sandbox', '--headless', '--disable-gpu', '--disable-dev-shm-usage',
+        '--hide-scrollbars', '--mute-audio'
+      ]
+    }
   }
 };