restructure JS jobs for ruby-runner change

refs DE-376

With the ruby-runner change that is coming, the final image will no longer include the node_modules/ assets, so we have to checkout the WEBPACK_BUILDER separately and copy in the source from the final PATCHSET_TAG.

Change-Id: Ic3c048500e00858bfa39244b308112cbc721783d
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/252666
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
Reviewed-by: Kyle Rosenbaum <krosenbaum@instructure.com>
QA-Review: Aaron Ogata <aogata@instructure.com>
Product-Review: Aaron Ogata <aogata@instructure.com>

Jenkinsfile

@@ -610,13 +610,14 @@ pipeline {
 
                 echo 'adding Javascript (Jest)'
                 buildStage.makeFromJob('Javascript (Jest)', '/Canvas/test-suites/JS', stages, buildParameters + [
+                    string(name: 'WEBPACK_BUILDER_TAG', value: env.WEBPACK_BUILDER_IMAGE),
                     string(name: 'TEST_SUITE', value: "jest"),
                   ], true, "testReport"
                 )
 
-
                 echo 'adding Javascript (Karma)'
                 buildStage.makeFromJob('Javascript (Karma)', '/Canvas/test-suites/JS', stages, buildParameters + [
+                    string(name: 'WEBPACK_BUILDER_TAG', value: env.WEBPACK_BUILDER_IMAGE),
                     string(name: 'TEST_SUITE', value: "karma"),
                   ], true, "testReport"
                 )

Jenkinsfile.js

@@ -65,8 +65,11 @@ pipeline {
   options { ansiColor('xterm') }
 
   environment {
-    COMPOSE_FILE = 'docker-compose.new-jenkins.canvas.yml:docker-compose.new-jenkins-karma.yml'
+    COMPOSE_DOCKER_CLI_BUILD=1
+    COMPOSE_FILE = 'docker-compose.new-jenkins-js.yml'
+    DOCKER_BUILDKIT=1
     FORCE_FAILURE = configuration.forceFailureJS()
+    PROGRESS_NO_TRUNC=1
     SENTRY_URL="https://sentry.insops.net"
     SENTRY_ORG="instructure"
     SENTRY_PROJECT="master-javascript-build"
@@ -85,7 +88,6 @@ pipeline {
 
                 checkoutRepo("canvas-lms", refspecToCheckout, 1)
 
-                sh './build/new-jenkins/docker-with-flakey-network-protection.sh pull $PATCHSET_TAG'
                 sh 'docker-compose build'
               }
             }

build/new-jenkins/js/Dockerfile

@@ -1,6 +1,11 @@
-ARG PATCHSET_TAG
+# syntax=docker/dockerfile:experimental
 
-FROM $PATCHSET_TAG
+ARG PATCHSET_TAG
+ARG WEBPACK_BUILDER_TAG
+
+FROM $PATCHSET_TAG AS patchset
+
+FROM $WEBPACK_BUILDER_TAG
 ENV APP_HOME /usr/src/app/
 ENV NODE_ENV test
 ENV CHROME_BIN /usr/bin/chromium-browser
@@ -11,5 +16,8 @@ RUN apt-get update --quiet=2 \
  && apt-get clean \
  && rm -rf /var/lib/apt/lists/* /tmp/* /var/tmp/*
 
- USER docker
- EXPOSE 9876
+USER docker
+RUN --mount=type=bind,target=/tmp/src,source=/usr/src/app,from=patchset \
+  cp -rf /tmp/src/* /usr/src/app
+
+EXPOSE 9876

build/new-jenkins/js/tests-karma.sh

@@ -2,10 +2,10 @@
 
 set -o errexit -o errtrace -o nounset -o pipefail -o xtrace
 
-CONTAINER_NAME=${CONTAINER_NAME:-tests-karma-$JSPEC_GROUP}
+CONTAINER_NAME=${CONTAINER_NAME:-tests-js-$JSPEC_GROUP}
 sentry=""
 if [[ "${COVERAGE:-}" == "1" ]]; then
   sentry="-e SENTRY_URL -e SENTRY_DSN -e SENTRY_ORG -e SENTRY_PROJECT -e SENTRY_AUTH_TOKEN -e DEPRECATION_SENTRY_DSN"
 fi
 
-docker-compose run --name $CONTAINER_NAME -e CI_NODE_INDEX -e CI_NODE_TOTAL -e COVERAGE -e FORCE_FAILURE $sentry karma yarn test:karma:headless
+docker-compose run --name $CONTAINER_NAME -e CI_NODE_INDEX -e CI_NODE_TOTAL -e COVERAGE -e FORCE_FAILURE $sentry canvas yarn test:karma:headless

docker-compose.new-jenkins-js.yml

@@ -1,11 +1,12 @@
 version: "2.3"
 services:
-  karma:
+  canvas:
     environment:
       - JSPEC_GROUP
     build:
       context: .
-      dockerfile: ./build/new-jenkins/js/Dockerfile-karma
+      dockerfile: ./build/new-jenkins/js/Dockerfile
       args:
         PATCHSET_TAG: $PATCHSET_TAG
+        WEBPACK_BUILDER_TAG: $WEBPACK_BUILDER_TAG
     init: true