refactor: simplify bazel saucelabs targets using karma pre-test wrapper and shared saucelabs connection between tests (#34769)

* Added a /tools/saucelabs/sauce-service.sh script that manages the sauce-connect as a service which is used by the karma-saucelabs.js wrapper to start the service.
* Added /tools/saucelabs/README.md that covers the details of SauceLabs karma testing with Bazel.

PR Close #34769

.circleci/bazel.common.rc

@@ -13,7 +13,3 @@ test --flaky_test_attempts=2
 
 # More details on failures
 build --verbose_failures=true
-
-# For saucelabs tests we don't want to enable flaky test attempts. Karma has its own integrated
-# retry mechanism and we do not want to retry unnecessarily if Karma already tried multiple times.
-test:saucelabs --flaky_test_attempts=1

.circleci/config.yml

@@ -314,19 +314,15 @@ jobs:
       - custom_attach_workspace
       - init_environment
       - run:
-          name: Run Bazel tests in saucelabs
-          # All web tests are contained within a single //:saucelabs_unit_tests_poc target
-          # for Saucelabs as running each set of tests as a separate target will attempt to acquire
-          # too many browsers on Saucelabs (7 per target currently) and some tests will always
-          # fail to acquire browsers. For example:
-          # 14 02 2019 19:52:33.170:WARN [launcher]: chrome beta on SauceLabs have not captured in 180000 ms, killing.
-          # //packages/forms/test:web_test_sauce TIMEOUT in 315.0s
-          command:  |
-            ./scripts/saucelabs/run-bazel-via-tunnel.sh \
-              --tunnel-id angular-${CIRCLE_BUILD_NUM}-${CIRCLE_NODE_INDEX} \
-              --username $SAUCE_USERNAME \
-              --key $(echo $SAUCE_ACCESS_KEY | rev) \
-              -- yarn bazel test //:saucelabs_unit_tests_poc --config=saucelabs
+          name: Preparing environment for running tests on Saucelabs.
+          command: setSecretVar SAUCE_ACCESS_KEY $(echo $SAUCE_ACCESS_KEY | rev)
+      - run:
+          name: Run Bazel tests on Saucelabs
+          # See /tools/saucelabs/README.md for more info
+          command: |
+            yarn bazel run //tools/saucelabs:sauce_service_setup
+            yarn bazel test //:saucelabs_unit_tests_poc_suite --config=saucelabs
+            yarn bazel run //tools/saucelabs:sauce_service_stop
           no_output_timeout: 20m
       - notify_webhook_on_fail:
           webhook_url_env_var: SLACK_DEV_INFRA_CI_FAILURES_WEBHOOK_URL
@@ -341,15 +337,16 @@ jobs:
     steps:
       - custom_attach_workspace
       - init_environment
+      - run:
+          name: Preparing environment for running tests on Saucelabs.
+          command: setSecretVar SAUCE_ACCESS_KEY $(echo $SAUCE_ACCESS_KEY | rev)
       - run:
           name: Run Bazel tests on Saucelabs
-          # Runs the //:saucelabs_tests target with Saucelabs and Ivy.
-          command:  |
-            ./scripts/saucelabs/run-bazel-via-tunnel.sh \
-              --tunnel-id angular-${CIRCLE_BUILD_NUM}-${CIRCLE_NODE_INDEX} \
-              --username $SAUCE_USERNAME \
-              --key $(echo $SAUCE_ACCESS_KEY | rev) \
-              -- yarn bazel test //:saucelabs_unit_tests --config=ivy --config=saucelabs
+          # See /tools/saucelabs/README.md for more info
+          command: |
+            yarn bazel run //tools/saucelabs:sauce_service_setup
+            yarn bazel test //:saucelabs_unit_tests --config=saucelabs --config=ivy
+            yarn bazel run //tools/saucelabs:sauce_service_stop
           no_output_timeout: 20m
 
   test_aio:
@@ -665,17 +662,20 @@ jobs:
             setPublicVar KARMA_JS_BROWSERS $(node -e 'console.log(require("./browser-providers.conf").sauceAliases.CI_REQUIRED.join(","))')
             setSecretVar SAUCE_ACCESS_KEY $(echo $SAUCE_ACCESS_KEY | rev)
       - run:
-          name: Starting Saucelabs tunnel
-          command: ./scripts/saucelabs/start-tunnel.sh
+          name: Starting Saucelabs tunnel service
+          command: ./tools/saucelabs/sauce-service.sh run
           background: true
       - run: yarn tsc -p packages
       - run: yarn tsc -p modules
       - run: yarn bazel build //packages/zone.js:npm_package
-        # Waits for the Saucelabs tunnel to be ready. This ensures that we don't run tests
-        # too early without Saucelabs not being ready.
-      - run: ./scripts/saucelabs/wait-for-tunnel.sh
+      - run:
+          # Waiting on ready ensures that we don't run tests too early without Saucelabs not being ready.
+          name: Waiting for Saucelabs tunnel to connect
+          command: ./tools/saucelabs/sauce-service.sh ready-wait
       - run: yarn karma start ./karma-js.conf.js --single-run --browsers=${KARMA_JS_BROWSERS}
-      - run: ./scripts/saucelabs/stop-tunnel.sh
+      - run:
+          name: Stop Saucelabs tunnel service
+          command: ./tools/saucelabs/sauce-service.sh stop
 
   # Job that runs all unit tests of the `angular/components` repository.
   components-repo-unit-tests: