From 3366fbe18cf0c878fed69255c4b9518b1f4874a0 Mon Sep 17 00:00:00 2001 From: "C. Fuhrman" Date: Fri, 10 Jan 2025 15:42:47 -0500 Subject: [PATCH 1/7] map the constants import to a mocked one --- client/jest.config.cjs | 3 ++- client/src/__mocks__/constantsMock.tsx | 13 +++++++++++++ 2 files changed, 15 insertions(+), 1 deletion(-) create mode 100644 client/src/__mocks__/constantsMock.tsx diff --git a/client/jest.config.cjs b/client/jest.config.cjs index 84b514c..dba1c3f 100644 --- a/client/jest.config.cjs +++ b/client/jest.config.cjs @@ -11,7 +11,8 @@ module.exports = { //moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'], setupFiles: ['./jest.setup.cjs'], moduleNameMapper: { - '\\.(css|less|scss|sass)$': 'identity-obj-proxy' + '\\.(css|less|scss|sass)$': 'identity-obj-proxy', + '^src/constants$': '/src/__mocks__/constantsMock.tsx', }, transformIgnorePatterns: ['node_modules/(?!nanoid/)'], }; diff --git a/client/src/__mocks__/constantsMock.tsx b/client/src/__mocks__/constantsMock.tsx new file mode 100644 index 0000000..9cdc04d --- /dev/null +++ b/client/src/__mocks__/constantsMock.tsx @@ -0,0 +1,13 @@ +console.log('constantsMock.tsx is loaded'); + +// constants.tsx +const ENV_VARIABLES = { + MODE: 'production', + VITE_BACKEND_URL: process.env.VITE_BACKEND_URL || "", + VITE_BACKEND_SOCKET_URL: process.env.VITE_BACKEND_SOCKET_URL || "", +}; + +console.log(`ENV_VARIABLES.VITE_BACKEND_URL=${ENV_VARIABLES.VITE_BACKEND_URL}`); +console.log(`ENV_VARIABLES.VITE_BACKEND_SOCKET_URL=${ENV_VARIABLES.VITE_BACKEND_SOCKET_URL}`); + +export { ENV_VARIABLES }; From 535e726e6e8372474c40bc9f7ebbd14805287096 Mon Sep 17 00:00:00 2001 From: "C. Fuhrman" Date: Fri, 10 Jan 2025 15:43:12 -0500 Subject: [PATCH 2/7] use correct env variable --- client/.env | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/.env b/client/.env index fa03bbb..e37f392 100644 --- a/client/.env +++ b/client/.env @@ -1,2 +1,2 @@ VITE_BACKEND_URL=http://localhost:4400 -VITE_AZURE_BACKEND_URL=http://localhost:4400 +VITE_BACKEND_SOCKET_URL=http://localhost:4400 From 3faed3625ec4064c0fac445938b0aae09c406f2d Mon Sep 17 00:00:00 2001 From: "C. Fuhrman" Date: Fri, 10 Jan 2025 15:44:22 -0500 Subject: [PATCH 3/7] allow always using 'src/constants' (a kind of absolute path) --- client/tsconfig.json | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/client/tsconfig.json b/client/tsconfig.json index 5324e80..d328c26 100644 --- a/client/tsconfig.json +++ b/client/tsconfig.json @@ -1,5 +1,9 @@ { "compilerOptions": { + "baseUrl": "./", + "paths": { + "src/*": ["src/*"] + }, "target": "ESNext", "useDefineForClassFields": true, "lib": ["ES2020", "DOM", "DOM.Iterable"], From 51d3d9f4731bf0d5b8fadaea4e34960fce30c544 Mon Sep 17 00:00:00 2001 From: "C. Fuhrman" Date: Fri, 10 Jan 2025 15:45:07 -0500 Subject: [PATCH 4/7] got back to import.meta (so dev version works) --- client/src/constants.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/client/src/constants.tsx b/client/src/constants.tsx index 09afd51..1fc104b 100644 --- a/client/src/constants.tsx +++ b/client/src/constants.tsx @@ -1,8 +1,8 @@ // constants.tsx const ENV_VARIABLES = { MODE: 'production', - VITE_BACKEND_URL: process.env.VITE_BACKEND_URL || "", - VITE_BACKEND_SOCKET_URL: process.env.VITE_BACKEND_SOCKET_URL || "", + VITE_BACKEND_URL: import.meta.env.VITE_BACKEND_URL || "", + VITE_BACKEND_SOCKET_URL: import.meta.env.VITE_BACKEND_SOCKET_URL || "", }; console.log(`ENV_VARIABLES.VITE_BACKEND_URL=${ENV_VARIABLES.VITE_BACKEND_URL}`); From 6c73cfddc9f94a3799f6944a1d1cb8556e30d90f Mon Sep 17 00:00:00 2001 From: "C. Fuhrman" Date: Fri, 10 Jan 2025 15:46:17 -0500 Subject: [PATCH 5/7] use src/constants (abs path) so it can remap when jest runs --- client/src/__tests__/services/WebsocketService.test.tsx | 8 +------- client/src/pages/Student/JoinRoom/JoinRoom.tsx | 2 +- client/src/pages/Teacher/ManageRoom/ManageRoom.tsx | 2 +- client/src/services/ApiService.tsx | 6 +++--- 4 files changed, 6 insertions(+), 12 deletions(-) diff --git a/client/src/__tests__/services/WebsocketService.test.tsx b/client/src/__tests__/services/WebsocketService.test.tsx index b4965dc..5a98e3e 100644 --- a/client/src/__tests__/services/WebsocketService.test.tsx +++ b/client/src/__tests__/services/WebsocketService.test.tsx @@ -1,16 +1,10 @@ //WebsocketService.test.tsx import WebsocketService from '../../services/WebsocketService'; import { io, Socket } from 'socket.io-client'; -import { ENV_VARIABLES } from '../../constants'; +import { ENV_VARIABLES } from 'src/constants'; jest.mock('socket.io-client'); -// jest.mock('../../constants', () => ({ -// ENV_VARIABLES: { -// VITE_BACKEND_SOCKET_URL: 'https://ets-glitch-backend.glitch.me/' -// } -// })); - describe('WebSocketService', () => { let mockSocket: Partial; diff --git a/client/src/pages/Student/JoinRoom/JoinRoom.tsx b/client/src/pages/Student/JoinRoom/JoinRoom.tsx index 1c865e8..040f22e 100644 --- a/client/src/pages/Student/JoinRoom/JoinRoom.tsx +++ b/client/src/pages/Student/JoinRoom/JoinRoom.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useState } from 'react'; import { Socket } from 'socket.io-client'; -import { ENV_VARIABLES } from '../../../constants'; +import { ENV_VARIABLES } from 'src/constants'; import StudentModeQuiz from '../../../components/StudentModeQuiz/StudentModeQuiz'; import TeacherModeQuiz from '../../../components/TeacherModeQuiz/TeacherModeQuiz'; diff --git a/client/src/pages/Teacher/ManageRoom/ManageRoom.tsx b/client/src/pages/Teacher/ManageRoom/ManageRoom.tsx index c65b179..949a6de 100644 --- a/client/src/pages/Teacher/ManageRoom/ManageRoom.tsx +++ b/client/src/pages/Teacher/ManageRoom/ManageRoom.tsx @@ -10,7 +10,7 @@ import webSocketService, { AnswerReceptionFromBackendType } from '../../../servi import { QuizType } from '../../../Types/QuizType'; import './manageRoom.css'; -import { ENV_VARIABLES } from '../../../constants'; +import { ENV_VARIABLES } from 'src/constants'; import { StudentType, Answer } from '../../../Types/StudentType'; import { Button } from '@mui/material'; import LoadingCircle from '../../../components/LoadingCircle/LoadingCircle'; diff --git a/client/src/services/ApiService.tsx b/client/src/services/ApiService.tsx index ea0d79d..987c091 100644 --- a/client/src/services/ApiService.tsx +++ b/client/src/services/ApiService.tsx @@ -1,8 +1,8 @@ import axios, { AxiosError, AxiosResponse } from 'axios'; -import { ENV_VARIABLES } from '../constants'; -import { QuizType } from '../Types/QuizType'; -import { FolderType } from '../Types/FolderType'; +import { FolderType } from 'src/Types/FolderType'; +import { QuizType } from 'src/Types/QuizType'; +import { ENV_VARIABLES } from 'src/constants'; class ApiService { private BASE_URL: string; From ea6454550c7b425d4326dd9f5474b7845c6191c7 Mon Sep 17 00:00:00 2001 From: "C. Fuhrman" Date: Fri, 10 Jan 2025 15:56:43 -0500 Subject: [PATCH 6/7] vite needs to understand the src mapping (redundant with tsconfig.json) --- client/vite.config.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/client/vite.config.ts b/client/vite.config.ts index 4e7a5a2..06294d3 100644 --- a/client/vite.config.ts +++ b/client/vite.config.ts @@ -20,6 +20,11 @@ export default defineConfig({ pluginChecker({ typescript: true }), EnvironmentPlugin(filteredEnv), ], + resolve: { + alias: { + 'src': '/src' + } + }, preview: { port: 5173, strictPort: true From 90e42865bad6f000150a1e9856876ffe5f3fda17 Mon Sep 17 00:00:00 2001 From: "C. Fuhrman" Date: Fri, 10 Jan 2025 23:43:15 -0500 Subject: [PATCH 7/7] Clean up server startup Fixes #171 --- server/app.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/server/app.js b/server/app.js index faef1b3..4616014 100644 --- a/server/app.js +++ b/server/app.js @@ -43,6 +43,7 @@ const imagesRouter = require('./routers/images.js'); // Setup environment dotenv.config(); +const isDev = process.env.NODE_ENV === 'development'; const errorHandler = require("./middleware/errorHandler.js"); // Start app @@ -63,13 +64,12 @@ const configureServer = (httpServer, isDev) => { }; // Start sockets (depending on the dev or prod environment) -let server = http.createServer(app); -let isDev = process.env.NODE_ENV === 'development'; +const server = http.createServer(app); console.log(`Environnement: ${process.env.NODE_ENV} (${isDev ? 'dev' : 'prod'})`); const io = configureServer(server); -console.log(`server.io configured: ${io.secure ? 'secure' : 'not secure'}`); +console.log(`Server configured with cors.origin: ${io.opts.cors.origin} and secure: ${io.opts.secure}`); setupWebsocket(io); console.log(`Websocket setup with on() listeners.`);