Merge pull request #97 from nicolelim02/feat/collab

Display test cases

Author: feliciagan

backend/code-execution-service/src/controllers/codeExecutionControllers.ts

@@ -41,17 +41,17 @@ export const executeCode = async (req: Request, res: Response) => {
   try {
     // Get question test case files
     const qnsResponse = await questionService.get(`/${questionId}`);
-    const { testcaseInputFileUrl, testcaseOutputFileUrl } =
+    const { inputs: stdinList, outputs: expectedResultList } =
       qnsResponse.data.question;
 
     // Extract test cases from input and output files
-    const testCases = await testCasesApi(
-      testcaseInputFileUrl,
-      testcaseOutputFileUrl
-    );
+    // const testCases = await testCasesApi(
+    //   testcaseInputFileUrl,
+    //   testcaseOutputFileUrl
+    // );
 
-    const stdinList: string[] = testCases.input;
-    const expectedResultList: string[] = testCases.output;
+    // const stdinList: string[] = testCases.input;
+    // const expectedResultList: string[] = testCases.output;
 
     if (stdinList.length !== expectedResultList.length) {
       res.status(400).json({

backend/code-execution-service/tests/codeExecutionRoutes.spec.ts

@@ -57,17 +57,12 @@ describe("Code execution routes", () => {
       (questionService.get as jest.Mock).mockResolvedValue({
         data: {
           question: {
-            testcaseInputFileUrl: "https://peerprep.com/input",
-            testcaseOutputFileUrl: "https://peerprep.com/output",
+            inputs: ["1", "2"],
+            outputs: ["1"],
           },
         },
       });
 
-      (testCasesApi as jest.Mock).mockResolvedValue({
-        input: ["1", "2"],
-        output: ["1"],
-      });
-
       const response = await request.post(`${BASE_URL}/run`).send({
         language: "python",
         code: "print('Hello, world!')",
@@ -81,23 +76,20 @@ describe("Code execution routes", () => {
       (questionService.get as jest.Mock).mockResolvedValue({
         data: {
           question: {
-            testcaseInputFileUrl: "https://peerprep.com/input",
-            testcaseOutputFileUrl: "https://peerprep.com/output",
+            inputs: ["1", "2"],
+            outputs: ["1", "2"],
           },
         },
       });
 
-      (testCasesApi as jest.Mock).mockResolvedValue({
-        input: ["1", "2"],
-        output: ["1", "4"],
-      });
-
       const response = await request.post(`${BASE_URL}/run`).send({
         language: "python",
         code: "print(input())",
         questionId: "1234",
       });
 
+      console.log(response.body);
+
       expect(response.status).toBe(200);
       expect(response.body.message).toBe(SUCCESS_MESSAGE);
       expect(response.body.data).toBeInstanceOf(Array);

backend/question-service/src/controllers/questionController.ts

@@ -1,6 +1,10 @@
 import { Request, Response } from "express";
 import Question, { IQuestion } from "../models/Question.ts";
-import { checkIsExistingQuestion, sortAlphabetically } from "../utils/utils.ts";
+import {
+  checkIsExistingQuestion,
+  getFileContent,
+  sortAlphabetically,
+} from "../utils/utils.ts";
 import {
   DUPLICATE_QUESTION_MESSAGE,
   QN_DESC_EXCEED_CHAR_LIMIT_MESSAGE,
@@ -76,7 +80,7 @@ export const createQuestion = async (
 
     res.status(201).json({
       message: QN_CREATED_MESSAGE,
-      question: formatQuestionIndivResponse(newQuestion),
+      question: await formatQuestionIndivResponse(newQuestion),
     });
   } catch (error) {
     console.log(error);
@@ -221,7 +225,7 @@ export const updateQuestion = async (
 
     res.status(200).json({
       message: "Question updated successfully",
-      question: formatQuestionIndivResponse(updatedQuestion as IQuestion),
+      question: await formatQuestionIndivResponse(updatedQuestion as IQuestion),
     });
   } catch (error) {
     res.status(500).json({ message: SERVER_ERROR_MESSAGE, error });
@@ -322,7 +326,7 @@ export const readQuestionIndiv = async (
 
     res.status(200).json({
       message: QN_RETRIEVED_MESSAGE,
-      question: formatQuestionIndivResponse(questionDetails),
+      question: await formatQuestionIndivResponse(questionDetails),
     });
   } catch (error) {
     res.status(500).json({ message: SERVER_ERROR_MESSAGE, error });
@@ -353,7 +357,7 @@ export const readRandomQuestion = async (
 
     res.status(200).json({
       message: QN_RETRIEVED_MESSAGE,
-      question: formatQuestionIndivResponse(chosenQuestion),
+      question: await formatQuestionIndivResponse(chosenQuestion),
     });
   } catch (error) {
     res.status(500).json({ message: SERVER_ERROR_MESSAGE, error });
@@ -393,15 +397,22 @@ const formatQuestionResponse = (question: IQuestion) => {
   };
 };
 
-const formatQuestionIndivResponse = (question: IQuestion) => {
+const formatQuestionIndivResponse = async (question: IQuestion) => {
+  const testcaseDelimiter = "\n\n";
+  const inputs = (await getFileContent(question.testcaseInputFileUrl))
+    .replace(/\r\n/g, "\n")
+    .split(testcaseDelimiter);
+  const outputs = (await getFileContent(question.testcaseOutputFileUrl))
+    .replace(/\r\n/g, "\n")
+    .split(testcaseDelimiter);
   return {
     id: question._id,
     title: question.title,
     description: question.description,
     complexity: question.complexity,
     categories: question.category,
-    testcaseInputFileUrl: question.testcaseInputFileUrl,
-    testcaseOutputFileUrl: question.testcaseOutputFileUrl,
+    inputs,
+    outputs,
     pythonTemplate: question.pythonTemplate,
     javaTemplate: question.javaTemplate,
     cTemplate: question.cTemplate,

backend/question-service/src/utils/utils.ts

@@ -1,8 +1,8 @@
+import axios from "axios";
 import mongoose from "mongoose";
 import { v4 as uuidv4 } from "uuid";
 
 import { bucket } from "../config/firebase";
-
 import Question from "../models/Question";
 
 export const checkIsExistingQuestion = async (
@@ -50,6 +50,16 @@ export const uploadFileToFirebase = async (
   });
 };
 
+export const getFileContent = async (url: string): Promise<string> => {
+  try {
+    const { data } = await axios.get(url);
+    return data;
+  } catch (error) {
+    console.error(error);
+    return "";
+  }
+};
+
 export const sortAlphabetically = (arr: string[]) => {
   return [...arr].sort((a, b) =>
     a.localeCompare(b, undefined, { sensitivity: "base" }),

frontend/src/components/TestCase/index.tsx

@@ -2,9 +2,9 @@ import { Box, styled, Typography } from "@mui/material";
 
 type TestCaseProps = {
   input: string;
-  output: string;
+  output?: string;
   stdout: string;
-  result: string;
+  result?: string;
 };
 
 const StyledBox = styled(Box)(({ theme }) => ({
@@ -30,16 +30,20 @@ const TestCase: React.FC<TestCaseProps> = ({
         <Typography variant="overline">Input</Typography>
         <StyledTypography fontFamily={"monospace"}>{input}</StyledTypography>
       </StyledBox>
+      {output && (
+        <StyledBox>
+          <Typography variant="overline">Output</Typography>
+          <StyledTypography fontFamily={"monospace"}>{output}</StyledTypography>
+        </StyledBox>
+      )}
+      {stdout && (
+        <StyledBox>
+          <Typography variant="overline">Stdout</Typography>
+          <StyledTypography fontFamily={"monospace"}>{stdout}</StyledTypography>
+        </StyledBox>
+      )}
       <StyledBox>
-        <Typography variant="overline">Output</Typography>
-        <StyledTypography fontFamily={"monospace"}>{output}</StyledTypography>
-      </StyledBox>
-      <StyledBox>
-        <Typography variant="overline">Standard output</Typography>
-        <StyledTypography fontFamily={"monospace"}>{stdout}</StyledTypography>
-      </StyledBox>
-      <StyledBox>
-        <Typography variant="overline">Result</Typography>
+        <Typography variant="overline">Expected</Typography>
         <StyledTypography fontFamily={"monospace"}>{result}</StyledTypography>
       </StyledBox>
     </Box>

frontend/src/pages/CollabSandbox/index.tsx

@@ -34,30 +34,6 @@ import CodeEditor from "../../components/CodeEditor";
 import { CollabSessionData, join, leave } from "../../utils/collabSocket";
 import { toast } from "react-toastify";
 
-// hardcode for now...
-
-type TestCase = {
-  input: string;
-  output: string;
-  stdout: string;
-  result: string;
-};
-
-const testcases: TestCase[] = [
-  {
-    input: "1 2 3 4",
-    output: "1 2 3 4",
-    stdout: "1\n2\n3\n4",
-    result: "1 2 3 4",
-  },
-  {
-    input: "5 6 7 8",
-    output: "5 6 7 8",
-    stdout: "5\n6\n7\n8",
-    result: "5 6 7 8",
-  },
-];
-
 const CollabSandbox: React.FC = () => {
   const [editorState, setEditorState] = useState<CollabSessionData | null>(
     null
@@ -267,7 +243,7 @@ const CollabSandbox: React.FC = () => {
 
             <TabPanel value={selectedTab} selected="tests">
               <Box sx={(theme) => ({ margin: theme.spacing(2, 0) })}>
-                {[...Array(testcases.length)]
+                {[...Array(selectedQuestion.inputs.length)]
                   .map((_, index) => index + 1)
                   .map((i) => (
                     <Button
@@ -283,11 +259,12 @@ const CollabSandbox: React.FC = () => {
                     </Button>
                   ))}
               </Box>
+              {/* display result of each test case in the output (result) and stdout (any print statements executed) */}
               <TestCase
-                input={testcases[selectedTestcase].input}
-                output={testcases[selectedTestcase].output}
-                stdout={testcases[selectedTestcase].stdout}
-                result={testcases[selectedTestcase].result}
+                input={selectedQuestion.inputs[selectedTestcase]}
+                output={""}
+                stdout={""}
+                result={selectedQuestion.outputs[selectedTestcase]}
               />
             </TabPanel>
             <TabPanel value={selectedTab} selected="chat">

frontend/src/reducers/questionReducer.ts

@@ -18,15 +18,17 @@ type QuestionDetail = {
   description: string;
   complexity: string;
   categories: Array<string>;
+  inputs: Array<string>;
+  outputs: Array<string>;
   pythonTemplate: string;
   javaTemplate: string;
   cTemplate: string;
 };
 
-type QuestionDetailWithUrl = QuestionDetail & {
-  testcaseInputFileUrl: string;
-  testcaseOutputFileUrl: string;
-};
+// type QuestionDetailWithUrl = QuestionDetail & {
+//   testcaseInputFileUrl: string;
+//   testcaseOutputFileUrl: string;
+// };
 
 type QuestionListDetail = {
   id: string;
@@ -56,26 +58,21 @@ enum QuestionActionTypes {
 
 type QuestionActions = {
   type: QuestionActionTypes;
-  payload:
-    | QuestionList
-    | QuestionDetail
-    | QuestionDetailWithUrl
-    | string[]
-    | string;
+  payload: QuestionList | QuestionDetail | string[] | string;
 };
 
 type QuestionsState = {
   questionCategories: Array<string>;
   questions: Array<QuestionListDetail>;
   questionCount: number;
-  selectedQuestion: QuestionDetailWithUrl | null;
+  selectedQuestion: QuestionDetail | null;
   questionCategoriesError: string | null;
   questionListError: string | null;
   selectedQuestionError: string | null;
 };
 
 // eslint-disable-next-line  @typescript-eslint/no-explicit-any
-const isQuestion = (question: any): question is QuestionDetailWithUrl => {
+const isQuestion = (question: any): question is QuestionDetail => {
   if (!question || typeof question !== "object") {
     return false;
   }
@@ -272,7 +269,7 @@ export const getQuestionById = (
 
 export const updateQuestionById = async (
   questionId: string,
-  question: Omit<QuestionDetailWithUrl, "id">,
+  question: Omit<QuestionDetail, "id">,
   testcaseFiles: TestcaseFiles,
   dispatch: Dispatch<QuestionActions>
 ): Promise<boolean> => {
@@ -309,8 +306,8 @@ export const updateQuestionById = async (
         description: question.description,
         complexity: question.complexity,
         category: question.categories,
-        testcaseInputFileUrl: question.testcaseInputFileUrl,
-        testcaseOutputFileUrl: question.testcaseOutputFileUrl,
+        // testcaseInputFileUrl: question.testcaseInputFileUrl,
+        // testcaseOutputFileUrl: question.testcaseOutputFileUrl,
         ...urls,
         pythonTemplate: question.pythonTemplate,
         javaTemplate: question.javaTemplate,