fix(programming): fix evaluation polling after user navigate away

- polling now handled by SubmissionEditIndex component, timers started on mount and cleared on unmount
- autograding job polling (from page load and "Run Code" button) moved from pollJob to component timers

client/app/bundles/course/assessment/submission/actions/answers/index.js

@@ -33,28 +33,10 @@ export const updateClientVersion = (answerId, clientVersion) => (dispatch) =>
     payload: { answer: { id: answerId, clientVersion } },
   });
 
-const pollAutogradingJob =
-  (jobUrl, submissionId, questionId, answerId) => (dispatch) => {
-    pollJob(
-      jobUrl,
-      () => dispatch(getEvaluationResult(submissionId, answerId, questionId)),
-      (errorData) => {
-        dispatch({
-          type: actionTypes.AUTOGRADE_FAILURE,
-          questionId,
-          payload: errorData,
-        });
-        dispatch(setNotification(translations.requestFailure));
-      },
-      JOB_POLL_DELAY_MS,
-    );
-  };
-
-export function submitAnswer(submissionId, answerId, rawAnswer, resetField) {
+export function submitAnswer(questionId, answerId, rawAnswer, resetField) {
   const currentTime = Date.now();
   const answer = formatAnswer(rawAnswer, currentTime);
   const payload = { answer };
-  const questionId = answer.questionId;
 
   return (dispatch) => {
     dispatch(updateClientVersion(answerId, currentTime));
@@ -73,16 +55,16 @@ export function submitAnswer(submissionId, answerId, rawAnswer, resetField) {
         if (data.newSessionUrl) {
           window.location = data.newSessionUrl;
         } else if (data.jobUrl) {
-          pollAutogradingJob(
-            data.jobUrl,
-            submissionId,
-            questionId,
-            answerId,
-          )(dispatch);
+          console.log(`AUTOGRADE_SUBMITTED`);
+          console.log({ questionId, jobUrl: data.jobUrl })
+          dispatch({
+            type: actionTypes.AUTOGRADE_SUBMITTED,
+            payload: { questionId, jobUrl: data.jobUrl },
+          });
         } else {
           dispatch({
             type: actionTypes.AUTOGRADE_SUCCESS,
-            payload: data,
+            payload: { ...data, answerId },
           });
           // When an answer is submitted, the value of that field needs to be updated.
           resetField(`${answerId}`, {
@@ -353,20 +335,10 @@ export function reevaluateAnswer(submissionId, answerId, questionId) {
         if (data.newSessionUrl) {
           window.location = data.newSessionUrl;
         } else if (data.jobUrl) {
-          pollJob(
-            data.jobUrl,
-            () =>
-              dispatch(getEvaluationResult(submissionId, answerId, questionId)),
-            (errorData) => {
-              dispatch({
-                type: actionTypes.REEVALUATE_FAILURE,
-                questionId,
-                payload: errorData,
-              });
-              dispatch(setNotification(translations.requestFailure));
-            },
-            JOB_POLL_DELAY_MS,
-          );
+          dispatch({
+            type: actionTypes.REEVALUATE_SUBMITTED,
+            payload: { questionId, jobUrl: data.jobUrl },
+          });
         } else {
           dispatch({
             type: actionTypes.REEVALUATE_SUCCESS,

client/app/bundles/course/assessment/submission/actions/index.js

@@ -1,3 +1,4 @@
+import GlobalAPI from 'api';
 import CourseAPI from 'api/course';
 import { setNotification } from 'lib/actions';
 import pollJob from 'lib/helpers/jobHelpers';
@@ -12,7 +13,6 @@ import translations from '../translations';
 import { buildErrorMessage, formatAnswers } from './utils';
 
 const JOB_POLL_DELAY_MS = 500;
-const JOB_STAGGER_DELAY_MS = 400;
 
 export function getEvaluationResult(submissionId, answerId, questionId) {
   return (dispatch) => {
@@ -22,16 +22,20 @@ export function getEvaluationResult(submissionId, answerId, questionId) {
       .then((data) => {
         dispatch({
           type: actionTypes.AUTOGRADE_SUCCESS,
-          payload: data,
+          payload: { ...data, answerId },
         });
       })
       .catch(() => {
         dispatch(setNotification(translations.requestFailure));
-        dispatch({ type: actionTypes.AUTOGRADE_FAILURE, questionId });
+        dispatch({ type: actionTypes.AUTOGRADE_FAILURE, questionId, answerId });
       });
   };
 }
 
+export function getJobStatus(jobUrl) {
+  return GlobalAPI.jobs.get(jobUrl);
+}
+
 export function fetchSubmission(id, onGetMonitoringSessionId) {
   return (dispatch) => {
     dispatch({ type: actionTypes.FETCH_SUBMISSION_REQUEST });
@@ -48,29 +52,6 @@ export function fetchSubmission(id, onGetMonitoringSessionId) {
           window.location = data.newSessionUrl;
           return;
         }
-        data.answers
-          .filter((a) => a.autograding && a.autograding.path)
-          .forEach((answer, index) => {
-            setTimeout(() => {
-              pollJob(
-                answer.autograding.path,
-                () =>
-                  dispatch(
-                    getEvaluationResult(
-                      id,
-                      answer.fields.id,
-                      answer.questionId,
-                    ),
-                  ),
-                () =>
-                  dispatch({
-                    type: actionTypes.AUTOGRADE_FAILURE,
-                    questionId: answer.questionId,
-                  }),
-                JOB_POLL_DELAY_MS,
-              );
-            }, JOB_STAGGER_DELAY_MS * index);
-          });
         if (data.monitoringSessionId !== undefined)
           onGetMonitoringSessionId?.(data.monitoringSessionId);
         dispatch({

client/app/bundles/course/assessment/submission/constants.ts

@@ -22,7 +22,8 @@ export const BUFFER_TIME_TO_FORCE_SUBMIT_MS = 5 * 1000;
 // to still be considered a "newly created" submission
 export const TIME_LAPSE_NEW_SUBMISSION_MS = 10 * 1000;
 
-export const POLL_INTERVAL_MILLISECONDS = 2000;
+export const EVALUATE_POLL_INTERVAL_MILLISECONDS = 500;
+export const FEEDBACK_POLL_INTERVAL_MILLISECONDS = 2000;
 
 export const workflowStates = {
   Unstarted: 'unstarted' as const,
@@ -160,6 +161,7 @@ const actionTypes = mirrorCreator([
   'UNSUBMIT_SUCCESS',
   'UNSUBMIT_FAILURE',
   'AUTOGRADE_REQUEST',
+  'AUTOGRADE_SUBMITTED',
   'AUTOGRADE_SUCCESS',
   'AUTOGRADE_FAILURE',
   'AUTOGRADE_SAVING_SUCCESS',
@@ -168,6 +170,7 @@ const actionTypes = mirrorCreator([
   'FEEDBACK_SUCCESS',
   'FEEDBACK_FAILURE',
   'REEVALUATE_REQUEST',
+  'REEVALUATE_SUBMITTED',
   'REEVALUATE_SUCCESS',
   'REEVALUATE_FAILURE',
   'RESET_REQUEST',

client/app/bundles/course/assessment/submission/pages/SubmissionEditIndex/SubmissionForm.tsx

@@ -7,19 +7,21 @@ import usePrompt from 'lib/hooks/router/usePrompt';
 import { useAppDispatch, useAppSelector } from 'lib/hooks/store';
 import useTranslation from 'lib/hooks/useTranslation';
 
-import { finalise } from '../../actions';
+import { finalise, getEvaluationResult, getJobStatus } from '../../actions';
 import { fetchLiveFeedback } from '../../actions/answers';
 import WarningDialog from '../../components/WarningDialog';
-import {
+import actionTypes, {
   formNames,
-  POLL_INTERVAL_MILLISECONDS,
+  EVALUATE_POLL_INTERVAL_MILLISECONDS,
+  FEEDBACK_POLL_INTERVAL_MILLISECONDS,
   workflowStates,
 } from '../../constants';
 import GradingPanel from '../../containers/GradingPanel';
 import { getInitialAnswer } from '../../selectors/answers';
 import { getAssessment } from '../../selectors/assessments';
 import { getAttachments } from '../../selectors/attachments';
 import { getLiveFeedbacks } from '../../selectors/liveFeedbacks';
+import { getQuestionFlags } from '../../selectors/questionFlags';
 import { getQuestions } from '../../selectors/questions';
 import { getSubmission } from '../../selectors/submissions';
 import translations from '../../translations';
@@ -51,6 +53,7 @@ const SubmissionForm: FC<Props> = (props) => {
   const assessment = useAppSelector(getAssessment);
   const submission = useAppSelector(getSubmission);
   const questions = useAppSelector(getQuestions);
+  const questionFlags = useAppSelector(getQuestionFlags);
   const attachments = useAppSelector(getAttachments);
   const liveFeedbacks = useAppSelector(getLiveFeedbacks);
   const initialValues = useAppSelector(getInitialAnswer);
@@ -144,7 +147,8 @@ const SubmissionForm: FC<Props> = (props) => {
     }
   });
 
-  const pollerRef = useRef<NodeJS.Timeout | null>(null);
+  const feedbackPollerRef = useRef<NodeJS.Timeout | null>(null);
+  const evaluatePollerRef = useRef<NodeJS.Timeout | null>(null);
   const pollAllFeedback = (): void => {
     questionIds.forEach((id) => {
       const question = questions[id];
@@ -156,17 +160,61 @@ const SubmissionForm: FC<Props> = (props) => {
     });
   };
 
+  const handleEvaluationPolling = (): void => {
+    Object.values(questions).forEach((question) => {
+      if (
+        questionFlags[question.id]?.isAutograding &&
+        questionFlags[question.id]?.jobUrl
+      ) {
+        getJobStatus(questionFlags[question.id].jobUrl).then(
+          (response) => {
+            switch (response.data.status) {
+              case 'submitted':
+                break;
+              case 'completed':
+                dispatch(
+                  getEvaluationResult(
+                    submissionId,
+                    question.answerId,
+                    question.id,
+                  ),
+                );
+                break;
+              case 'errored':
+                dispatch({
+                  type: actionTypes.AUTOGRADE_FAILURE,
+                  answerId: question.answerId,
+                  questionId: question.id,
+                });
+                break;
+              default:
+                throw new Error('Unknown job status');
+            }
+          },
+        );
+      }
+    });
+  };
+
   useEffect(() => {
     // check for feedback from Codaveri on page load for each question
-    pollerRef.current = setInterval(
+    feedbackPollerRef.current = setInterval(
       pollAllFeedback,
-      POLL_INTERVAL_MILLISECONDS,
+      FEEDBACK_POLL_INTERVAL_MILLISECONDS,
+    );
+
+    evaluatePollerRef.current = setInterval(
+      handleEvaluationPolling,
+      EVALUATE_POLL_INTERVAL_MILLISECONDS,
     );
 
     // clean up poller on unmount
     return () => {
-      if (pollerRef.current) {
-        clearInterval(pollerRef.current);
+      if (feedbackPollerRef.current) {
+        clearInterval(feedbackPollerRef.current);
+      }
+      if (evaluatePollerRef.current) {
+        clearInterval(evaluatePollerRef.current);
       }
     };
   });

client/app/bundles/course/assessment/submission/pages/SubmissionEditIndex/components/button/RunCodeButton.tsx

@@ -40,7 +40,7 @@ const RunCodeButton: FC<Props> = (props) => {
   const onSubmitAnswer = (): void => {
     dispatch(
       submitAnswer(
-        submissionId,
+        question.id,
         answerId,
         getValues(`${answerId}`),
         resetField,

client/app/bundles/course/assessment/submission/pages/SubmissionEditIndex/components/button/SubmitButton.tsx

@@ -52,7 +52,7 @@ const SubmitButton: FC<Props> = (props) => {
   const onSubmitAnswer = (): void => {
     dispatch(
       submitAnswer(
-        submissionId,
+        question.id,
         answerId,
         getValues(`${answerId}`),
         resetField,

client/app/bundles/course/assessment/submission/reducers/questionsFlags.js

@@ -1,28 +1,33 @@
 import actions from '../constants';
 
+function initQuestionsFlagsFromSubmissionPayload(payload) {
+  return payload.questions.reduce((obj, question) => {
+    const answer = payload.answers.find(
+      (ans) => ans.questionId === question.id,
+    );
+    return {
+      ...obj,
+      [question.id]: {
+        isResetting: false,
+        isAutograding:
+          Boolean(answer?.autograding) &&
+          answer?.autograding?.status === 'submitted',
+        jobUrl: answer?.autograding?.jobUrl,
+        jobError:
+          Boolean(answer?.autograding) &&
+          answer?.autograding?.status === 'errored',
+        jobErrorMessage: answer?.autograding?.errorMessage,
+      },
+    };
+  }, {});
+}
+
 export default function (state = {}, action) {
   switch (action.type) {
     case actions.FETCH_SUBMISSION_SUCCESS:
     case actions.UNSUBMIT_SUCCESS:
     case actions.FINALISE_SUCCESS:
-      return action.payload.questions.reduce((obj, question) => {
-        const answer = action.payload.answers.find(
-          (ans) => ans.questionId === question.id,
-        );
-        return {
-          ...obj,
-          [question.id]: {
-            isResetting: false,
-            isAutograding:
-              Boolean(answer?.autograding) &&
-              answer?.autograding?.status === 'submitted',
-            jobError:
-              Boolean(answer?.autograding) &&
-              answer?.autograding?.status === 'errored',
-            jobErrorMessage: answer?.autograding?.errorMessage,
-          },
-        };
-      }, {});
+      return initQuestionsFlagsFromSubmissionPayload(action.payload);
     case actions.REEVALUATE_REQUEST:
     case actions.AUTOGRADE_REQUEST: {
       const { questionId } = action.payload;
@@ -31,6 +36,19 @@ export default function (state = {}, action) {
         [questionId]: {
           ...state[questionId],
           isAutograding: true,
+          jobUrl: null,
+        },
+      };
+    }
+    case actions.REEVALUATE_SUBMITTED:
+    case actions.AUTOGRADE_SUBMITTED: {
+      const { questionId, jobUrl } = action.payload;
+      return {
+        ...state,
+        [questionId]: {
+          ...state[questionId],
+          isAutograding: true,
+          jobUrl,
         },
       };
     }
@@ -42,7 +60,9 @@ export default function (state = {}, action) {
         [questionId]: {
           ...state[questionId],
           isAutograding: false,
+          jobUrl: null,
           jobError: false,
+          jobErrorMessage: null,
         },
       };
     }
@@ -55,6 +75,7 @@ export default function (state = {}, action) {
         [questionId]: {
           ...state[questionId],
           isAutograding: false,
+          jobUrl: null,
           jobError: Boolean(jobError),
           jobErrorMessage: payload?.errorMessage,
         },

client/app/bundles/course/assessment/submission/types.ts

@@ -127,6 +127,7 @@ export interface SubmissionFlagsState {
 export interface QuestionFlag {
   isAutograding: boolean;
   isResetting: boolean;
+  jobUrl: string | null;
   jobError: boolean;
   jobErrorMessage?: string;
 }