Add js tests to new jenkins

Change-Id: Ia30e8fd105738a95fb10364e1643be179876b81b
Reviewed-on: https://gerrit.instructure.com/207502
Tested-by: Jenkins
QA-Review: Ryan Shaw <ryan@instructure.com>
Product-Review: Ryan Shaw <ryan@instructure.com>
Reviewed-by: Ryan Shaw <ryan@instructure.com>

Jenkinsfile.linters-js

@@ -45,10 +45,7 @@ pipeline {
   stages {
     stage('Setup') {
       steps {
-        timeout(time: 60) {
-          sh 'printenv | sort'
-          sh 'build/new-jenkins/docker-compose-build-up.sh'
-        }
+        setDockerUp()
       }
     }
     stage('Linters') {
@@ -70,8 +67,64 @@ pipeline {
         }
       }
     }
+    stage('Tests Setup') {
+      environment {
+        COMPOSE_FILE = 'docker-compose.new-jenkins-js.yml:docker-compose.new-jenkins-karma.yml'
+      }
+      steps {
+        setDockerUp() 
+      }
+    }  
+    stage('Tests') {
+      environment {
+        COMPOSE_FILE = 'docker-compose.new-jenkins-js.yml:docker-compose.new-jenkins-karma.yml'
+      }
+      parallel {
+        stage('Jest') {
+          steps {
+            sh 'build/new-jenkins/js/tests-jest.sh'
+          }
+        }
+        stage('Packages') {
+          steps {
+            sh 'build/new-jenkins/js/tests-packages.sh'
+          }
+        }
+        stage('Karma - Spec Group - coffee') {
+          environment {
+            JSPEC_GROUP = 'coffee'
+          }
+          steps {
+            sh 'build/new-jenkins/js/tests-karma.sh'
+          }
+        }
+        stage('Karma - Spec Group - jsa - A-F') {
+          environment {
+            JSPEC_GROUP = 'jsa'
+          }
+          steps {
+            sh 'build/new-jenkins/js/tests-karma.sh'
+          }
+        }
+        stage('Karma - Spec Group - jsg - G') {
+          environment {
+            JSPEC_GROUP = 'jsg'
+          }
+          steps {
+            sh 'build/new-jenkins/js/tests-karma.sh'
+          }
+        }
+        stage('Karma - Spec Group - jsh - H-Z') {
+          environment {
+            JSPEC_GROUP = 'jsh'
+          }
+          steps {
+            sh 'build/new-jenkins/js/tests-karma.sh'
+          }
+        }
+      }
+    }
   }
-
   post {
     cleanup {
       cleanupDocker()

app/jsx/assignments_2/student/components/__tests__/CommentsTextArea.test.js

@@ -31,6 +31,8 @@ import CommentTextArea from '../CommentsTab/CommentTextArea'
 import CommentsTab from '../CommentsTab'
 import * as uploadFileModule from '../../../../shared/upload_file'
 
+jest.setTimeout(10000)
+
 describe('CommentTextArea', () => {
   beforeAll(() => {
     window.URL.createObjectURL = jest.fn()
@@ -227,12 +229,12 @@ describe('CommentTextArea', () => {
     const mockedComments = mockComments()
     mockedComments.attachments = mockMultipleAttachments()
     const basicMock = commentGraphqlMock(mockedComments)
-    const {container, getByPlaceholderText, getByText} = render(
+    const {container, findByPlaceholderText, findByText} = render(
       <MockedProvider mocks={basicMock} addTypename>
         <CommentsTab assignment={mockAssignment()} submission={legacyMockSubmission()} />
       </MockedProvider>
     )
-    const textArea = await waitForElement(() => getByPlaceholderText('Submit a Comment'))
+    const textArea = await findByPlaceholderText('Submit a Comment')
     const fileInput = await waitForElement(() =>
       container.querySelector('input[id="attachmentFile"]')
     )
@@ -244,10 +246,10 @@ describe('CommentTextArea', () => {
     uploadFiles(fileInput, [file1, file2, file3])
 
     fireEvent.change(textArea, {target: {value: 'lion'}})
-    fireEvent.click(getByText('Send Comment'))
+    fireEvent.click(await findByText('Send Comment'))
 
     uploadFileModule.submissionCommentAttachmentsUpload = mockedFunctionPlacedholder
-    expect(await waitForElement(() => getByText('Submission comment sent'))).toBeInTheDocument()
+    expect(await findByText('Submission comment sent')).toBeInTheDocument()
   })
 
   it('users cannot send submission comments with not files or text', async () => {

app/jsx/assignments_2/student/components/__tests__/ViewManager.test.js

@@ -24,6 +24,8 @@ import {STUDENT_VIEW_QUERY, SUBMISSION_HISTORIES_QUERY} from '../../graphqlData/
 import {SubmissionMocks} from '../../graphqlData/Submission'
 import ViewManager from '../ViewManager'
 
+jest.setTimeout(10000)
+
 async function mockStudentViewResult(overrides = {}) {
   const variables = {assignmentLid: '1', submissionID: '1'}
   const result = await mockQuery(STUDENT_VIEW_QUERY, overrides, variables)

build/new-jenkins/js/Dockerfile-karma

@@ -0,0 +1,22 @@
+ARG image_name
+FROM $image_name
+
+ENV APP_HOME /usr/src/app/
+ENV NODE_ENV test
+ENV CHROME_BIN /usr/bin/google-chrome
+
+USER root
+
+RUN curl --silent "https://dl-ssl.google.com/linux/linux_signing_key.pub" | apt-key add - \
+ && curl --silent "https://dl.yarnpkg.com/debian/pubkey.gpg" | apt-key add - \
+ && echo "deb https://dl.google.com/linux/chrome/deb/ stable main" > "/etc/apt/sources.list.d/google.list" \
+ && echo "deb https://dl.yarnpkg.com/debian/ stable main" > /etc/apt/sources.list.d/yarn.list \
+ && apt-get update --quiet=2 \
+ && apt-get install --quiet=2 google-chrome-beta yarn > /dev/null \
+ && apt-get clean \
+ && rm -rf /var/lib/apt/lists/* /tmp/* /var/tmp/*
+
+USER docker
+
+EXPOSE 9876
+

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

@@ -0,0 +1,5 @@
+#!/bin/bash
+
+export COMPOSE_FILE=./docker-compose.new-jenkins-js.yml
+
+docker-compose run --name tests-jest web yarn test:jest

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

@@ -0,0 +1,7 @@
+#!/bin/bash
+
+export COMPOSE_FILE="docker-compose.new-jenkins-js.yml:docker-compose.new-jenkins-karma.yml"
+
+NAME='tests-karma-'$JSPEC_GROUP
+
+docker-compose run --name $NAME karma yarn test:karma:headless

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

@@ -0,0 +1,5 @@
+#!/bin/bash
+
+export COMPOSE_FILE=./docker-compose.new-jenkins-js.yml
+
+docker-compose run --name tests-packages web yarn test:packages

docker-compose.new-jenkins-karma.yml

@@ -0,0 +1,10 @@
+version: "2.1"
+services:
+  karma:
+    environment:
+      - JSPEC_GROUP
+    build:
+      context: .
+      dockerfile: ./build/new-jenkins/js/Dockerfile-karma
+      args:
+        image_name: $PATCHSET_TAG

spec/javascripts/jsx/course_settings/actionsSpec.js

@@ -229,11 +229,11 @@ test('uploadFile dispatches prepareSetImage when successful', assert => {
 
   const fakeDragonDropEvent = {
     dataTransfer: {
-      files: [{
+      files: [new File(["fake"], "fake.jpg", {
         name: 'test file',
         size: 12345,
         type: 'image/jpeg'
-      }]
+      })]
     },
     preventDefault: () => {}
   };

spec/javascripts/jsx/shared/uploadFileSpec.js

@@ -43,7 +43,7 @@ test('uploadFile posts form data instead of json if necessary', () => {
     name: 'fake',
     'attachment[context_code]': 'course_1'
   };
-  const file = sinon.stub();
+  const file = new File(["fake"], "fake.txt");
 
   return uploadFile(url, data, file, fakeAjaxLib).then(() => {
     ok(postStub.calledWith(url, 'name=fake&attachment%5Bcontext_code%5D=course_1&no_redirect=true'),
@@ -71,7 +71,7 @@ test('uploadFile requests no_redirect in preflight even if not specified', () =>
 
   const url = `/api/v1/courses/1/files`;
   const data = { name: 'fake' };
-  const file = sinon.stub();
+  const file = new File(["fake"], "fake.txt");
 
   return uploadFile(url, data, file, fakeAjaxLib).then(() => {
     ok(postStub.calledWith(url, { name: "fake", no_redirect: true }),
@@ -103,7 +103,7 @@ test('uploadFile threads through in direct to S3 case', () => {
 
   const url = `/api/v1/courses/1/files`;
   const data = { name: 'fake' };
-  const file = sinon.stub();
+  const file = new File(["fake"], "fake.txt");
 
   return uploadFile(url, data, file, fakeAjaxLib).then(() => {
     ok(getStub.calledWith(successUrl), 'made request to success url');
@@ -141,7 +141,7 @@ test('uploadFile threads through in inst-fs case', () => {
 
   const url = `/api/v1/courses/1/files`;
   const data = { name: 'fake' };
-  const file = sinon.stub();
+  const file = new File(["fake"], "fake.txt");
 
   return uploadFile(url, data, file, fakeAjaxLib).then(() => {
     ok(getStub.calledWith(successUrl), 'made request to success url');
@@ -177,7 +177,7 @@ test('uploadFile threads through in local-storage case', () => {
 
   const url = `/api/v1/courses/1/files`;
   const data = { name: 'fake' };
-  const file = sinon.stub();
+  const file = new File(["fake"], "fake.txt");
 
   return uploadFile(url, data, file, fakeAjaxLib).then((response) => {
     equal(response.id, 1, 'passed response through');
@@ -194,7 +194,7 @@ test('completeUpload upacks embedded "attachments" wrapper if any', () => {
   postStub.resolves({ data: {} });
   const fakeAjaxLib = { post: postStub };
 
-  const file = sinon.stub();
+  const file = new File(["fake"], "fake.txt");
 
   return completeUpload(preflightResponse, file, { ajaxLib: fakeAjaxLib }).then(() => {
     ok(postStub.calledWith(upload_url, sinon.match.any, sinon.match.any),
@@ -208,7 +208,7 @@ test('completeUpload wires up progress callback if any', () => {
   const fakeAjaxLib = { post: postStub };
 
   const preflightResponse = { upload_url: 'http://uploadUrl' };
-  const file = sinon.stub();
+  const file = new File(["fake"], "fake.txt");
   const options = {
     ajaxLib: fakeAjaxLib,
     onProgress: sinon.spy()
@@ -242,7 +242,7 @@ test('completeUpload skips GET after inst-fs upload if options.ignoreResult', ()
   };
 
   const preflightResponse = { upload_url: 'http://uploadUrl' };
-  const file = sinon.stub();
+  const file = new File(["fake"], "fake.txt");
   const options = {
     ajaxLib: fakeAjaxLib,
     ignoreResult: true
@@ -274,7 +274,7 @@ test('completeUpload appends avatar include in GET after upload if options.inclu
   };
 
   const preflightResponse = { upload_url: 'http://uploadUrl' };
-  const file = sinon.stub();
+  const file = new File(["fake"], "fake.txt");
   const options = {
     ajaxLib: fakeAjaxLib,
     includeAvatar: true
@@ -302,7 +302,7 @@ test('completeUpload to S3 posts withCredentials false', () => {
     upload_url: 'http://uploadUrl',
     success_url: successUrl
   };
-  const file = sinon.stub();
+  const file = new File(["fake"], "fake.txt");
   const options = { ajaxLib: fakeAjaxLib };
 
   return completeUpload(preflightResponse, file, options).then(() => {
@@ -324,7 +324,7 @@ test('completeUpload to non-S3 posts withCredentials true', () => {
   };
 
   const preflightResponse = { upload_url: 'http://uploadUrl' };
-  const file = sinon.stub();
+  const file = new File(["fake"], "fake.txt");
   const options = { ajaxLib: fakeAjaxLib };
 
   return completeUpload(preflightResponse, file, options).then(() => {
@@ -405,7 +405,8 @@ test('completeUpload waits on progress after upload POST if given both a progres
 test('uploadFile differentiates network failures during preflight', () => {
   const fakeAjaxLib = { post: sinon.stub() };
   fakeAjaxLib.post.rejects({ message: 'Network Error' }); // preflight attempt
-  return uploadFile('http://preflightUrl', {}, sinon.stub(), fakeAjaxLib)
+  const file = new File(["fake"], "fake.txt");
+  return uploadFile('http://preflightUrl', {}, file, fakeAjaxLib)
     .then(() => ok(false, 'preflight should fail'))
     .catch(({ message }) => ok(message.match(/failed to initiate the upload/), 'correct error message'));
 });
@@ -414,7 +415,8 @@ test('uploadFile differentiates network failures during POST to upload_url', ()
   const fakeAjaxLib = { post: sinon.stub() };
   fakeAjaxLib.post.onCall(0).resolves({ data: { upload_url: 'http://uploadUrl' } }); // preflight
   fakeAjaxLib.post.onCall(1).rejects({ message: 'Network Error' }); // upload attempt
-  return uploadFile('http://preflightUrl', {}, sinon.stub(), fakeAjaxLib)
+  const file = new File(["fake"], "fake.txt");
+  return uploadFile('http://preflightUrl', {}, file, fakeAjaxLib)
     .then(() => ok(false, 'upload should fail'))
     .catch(({ message }) => ok(message.match(/service may be down/), 'correct error message'));
 });
@@ -427,7 +429,8 @@ test('uploadFile differentiates network failures after upload', () => {
   }}); // preflight
   fakeAjaxLib.post.onCall(1).resolves({ data: {} }); // upload
   fakeAjaxLib.get.rejects({ message: 'Network Error' }); // success url attempt
-  return uploadFile('http://preflightUrl', {}, sinon.stub(), fakeAjaxLib)
+  const file = new File(["fake"], "fake.txt");
+  return uploadFile('http://preflightUrl', {}, file, fakeAjaxLib)
     .then(() => ok(false, 'finalization should fail'))
     .catch(({ message }) => ok(message.match(/failed to complete the upload/), 'correct error message'));
 });