Updates frontend testing infrastructure, and adds a courses draft page

.github/workflows/backend-tests.yml

@@ -12,7 +12,6 @@ on:
 
 jobs:
   test:
-
     runs-on: ubuntu-latest
 
     strategy:

.github/workflows/frontend-tests.yml

@@ -12,13 +12,27 @@ on:
 
 jobs:
   test:
-
     runs-on: ubuntu-latest
 
     strategy:
       matrix:
         node-version: [18.x]
 
+    services:
+      postgres:
+        image: postgres:latest
+        env:
+          POSTGRES_USER: postgres
+          POSTGRES_PASSWORD: postgres
+          POSTGRES_DB: test_db
+        ports:
+          - 5432:5432
+        options: >-
+          --health-cmd pg_isready
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
+
     steps:
     - uses: actions/checkout@v4
 
@@ -27,10 +41,21 @@ jobs:
       with:
         node-version: ${{ matrix.node-version }}
 
-    - name: CI
+    - name: Setup frontend
       working-directory: ./frontend
       run: |
         npm install
-        npm run build --if-present
+
+    - name: CI
+      env:
+        DATABASE_URL: postgres://postgres:postgres@localhost:5432/test_db
+        BACKEND_API_URL: http://localhost:5000
+      run: |
+        cd backend
+        npm install
+        npx prisma migrate dev --name init
+        npm run prisma:generate
+        npm run generate:mock
+        cd ../frontend
         npm test
 

backend/.gitignore

@@ -2,3 +2,4 @@ node_modules
 dist
 # Keep environment variables out of version control
 .env
+mockData.json

backend/package.json

@@ -7,10 +7,12 @@
         "dev": "nodemon src/server.ts",
         "docker:up": "docker compose up -d",
         "docker:down": "docker compose down",
-        "migration:generate": "npx prisma migrate dev --name init",
-        "prettier": "prettier --write .",
-        "dummy": "npx ts-node scripts/dummy-data.ts",
-        "test": "npm run docker:up && npx prisma migrate deploy && jest -i"
+        "prisma:migration": "npx prisma migrate dev --name init",
+        "prisma:generate": "npx prisma generate",
+        "generate:dummy": "npx ts-node scripts/dummy-data.ts",
+        "generate:mock": "npx ts-node scripts/generate-mock-data.ts && cp -f ./mockData.json ../frontend/tests/mocks/data.json",
+        "test": "npm run docker:up && npx prisma migrate deploy && jest -i",
+        "prettier": "prettier --write ."
     },
     "keywords": [],
     "author": "",

backend/prisma/schema.prisma

@@ -2,6 +2,12 @@ generator client {
   provider = "prisma-client-js"
 }
 
+generator frontend {
+  provider = "prisma-client-js"
+  output   = "../../frontend/node_modules/.prisma/client"
+}
+
+
 datasource db {
   provider = "postgresql"
   url      = env("DATABASE_URL")

backend/scripts/generate-mock-data.ts

@@ -0,0 +1,23 @@
+import { writeFileSync } from "fs";
+import { createContext } from "../src/context";
+import { createStudent, createCourses } from "../tests/utils";
+
+(async () => {
+    const students = await createStudent(10);
+    const courses = await createCourses(5);
+
+    const mockData = {
+        students,
+        courses,
+    };
+
+    writeFileSync("./mockData.json", JSON.stringify(mockData));
+})();
+
+console.log("Mock data generated successfully!");
+console.log("Cleaning up...");
+
+const prisma = createContext().prisma;
+
+prisma.user.deleteMany();
+prisma.course.deleteMany();

backend/src/courseController.ts

@@ -1,5 +1,5 @@
 import { Context } from "./context";
 
 export async function getAllCourses(ctx: Context) {
-    return await ctx.prisma.course.findMany();
+    return await ctx.prisma.course.findMany({ include: { instructor: true } });
 }

backend/tests/utils.ts

@@ -1,6 +1,6 @@
 import { createContext } from "../src/context";
 import { Role } from "@prisma/client";
-import { userFactory, courseFactory } from "./factory";
+import { userFactory, courseFactory } from "../factories/factory";
 
 const prisma = createContext().prisma;
 
@@ -10,6 +10,17 @@ export const createInstructor = async () => {
     return user;
 };
 
+export const createStudent = async (amount: number = 1) => {
+    const students = await Promise.all(
+        Array.from({ length: amount }, async () => {
+            const student = userFactory(Role.STUDENT);
+            return await prisma.user.create({ data: student });
+        }),
+    );
+
+    return students;
+};
+
 export const createCourses = async (amount: number = 1) => {
     const instructor = await createInstructor();
 

backend/tsconfig.json

@@ -7,5 +7,11 @@
         "esModuleInterop": true,
         "strict": true
     },
-    "exclude": ["node_modules", "tests", "jest.config.ts", "scripts"]
+    "exclude": [
+        "node_modules",
+        "tests",
+        "jest.config.ts",
+        "scripts",
+        "factories"
+    ]
 }

frontend/.gitignore

@@ -41,5 +41,6 @@ yarn-error.log*
 *.tsbuildinfo
 next-env.d.ts
 
-#
-.hintrc
+tests/mocks/*.json
+
+.hintrc

frontend/jest.config.ts

@@ -143,7 +143,7 @@ const config: Config = {
     // setupFiles: [],
 
     // A list of paths to modules that run some code to configure or set up the testing framework before each test
-    // setupFilesAfterEnv: [],
+    setupFilesAfterEnv: ["./tests/setupTests.ts"],
 
     // The number of seconds after which a test is considered as slow and reported as such in the results.
     // slowTestThreshold: 5,
@@ -152,10 +152,12 @@ const config: Config = {
     // snapshotSerializers: [],
 
     // The test environment that will be used for testing
-    testEnvironment: "jsdom",
+    testEnvironment: "jest-fixed-jsdom",
 
     // Options that will be passed to the testEnvironment
-    // testEnvironmentOptions: {},
+    testEnvironmentOptions: {
+        customExportConditions: [""],
+    },
 
     // Adds a location field to test results
     // testLocationInResults: false,